Keyboard focus location is lost when copying code or exiting search bar

[peterychang]

After activating the 'Copy to Clipboard' button via keyboard, the page focus resets. The same happens if the search overlay is escaped

This code fixes both issues, though the search bar will grab focus whenever the overlay is escaped; not sure if thats correct behavior or not.

document.addEventListener('DOMContentLoaded', function() {
  // Focus back onto copy button after copy event
  document.querySelectorAll('.copybtn').forEach(button => {
      button.addEventListener('click', async function(event) {
          // Save the current focus
          const focusedElement = document.activeElement;

          // Perform the copy action
          await copyToClipboard(this);

          // Restore the focus
          focusedElement.focus();
      });
  });

  // Focus back on search bar if overlay is escaped
  document.querySelectorAll('.search-button-field').forEach(button => {
    button.addEventListener('click', () => {
      // Save the element that had focus before opening the search
      const previousFocus = document.activeElement;

      document.addEventListener('keydown', (event) => {
        if (event.key === 'Escape') {
          // Restore focus to the previous element
          previousFocus.focus();
        }
      });
    });
  });
});

async function copyToClipboard(button) {
  const targetSelector = button.getAttribute('data-clipboard-target');
  const codeBlock = document.querySelector(targetSelector);
  try {
      await navigator.clipboard.writeText(codeBlock.textContent);
  } catch (err) {
      console.error('Failed to copy text: ', err);
  }
}

[trallard]

Thanks for taking the time to report this. Typing a quick response but will come back later with more details or maybe @gabalafou can add more thoughts:

1. For the copybutton component: this makes sense, though since this is a third-party extension, the onus and fix should be directly on the copybutton project and not on PST.
2. For search, IIRC, the answer pointed to at Is there a way to collapse the sidebar when the focus leaves the region? #2150 (comment) applies still. Since @gabalafou has spent a lot of time working on this (and thinking about it) I will let him chime in on the conversation.

[gabalafou]

1. I can reproduce the copy button behavior on the Sphinx Copybutton documentation site, so as @trallard said, that's an issue that will need to be fixed there.
2. As I mentioned in issue 2139, I think that the search overlay issue you're seeing is the result of using an older version of the theme. That said, when testing out the search overlay, I noticed that there's an extra tab stop in Safari and Firefox, so I will open a separate issue for that.

[trallard]

So from your last message it seems there is nothing actionable/needed on PST @gabalafou ?

The copy button issue would be best reported in the copy button repository @peterychang to ensure that it is fixed in the right place.