Liegt über einem focusierbaren Element z.B. ein Layer dann sind diese Elemente weiterhin mit Tastatur auswählbar. Folgendes Script löst das Problem durch temporäres setzen eines negativen tabindex.

Beispiel: https://daschmi.de/static/ds_focuser/

const ds_focuser_open_layer = (el_layer) => {
  
  document.querySelectorAll('button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"]):not([disabled]), details:not([disabled]), summary:not(:disabled)').forEach((el) => {

    el.setAttribute('ds_focuser_tabindex', el.getAttribute('tabindex'));
    el.setAttribute('tabindex', '-1');

  });

  el_layer.querySelectorAll('*[ds_focuser_tabindex]').forEach((el) => {
    
    el.setAttribute('tabindex', el.getAttribute('ds_focuser_tabindex'));
    el.removeAttribute('ds_focuser_tabindex');

  });

};

const ds_focuser_close_layer = () => {

  document.querySelectorAll('*[ds_focuser_tabindex]').forEach((el) => {
    
    el.setAttribute('tabindex', el.getAttribute('ds_focuser_tabindex'));
    el.removeAttribute('ds_focuser_tabindex');

  });

};