13.7.0 regression broke .matches(':focus-visible') during focus events

[EvHaus]

Describe the bug

After upgrading from happy-dom 13.6.2 to 13.7.0, we're seeing a problem with focus events. At first I thought maybe it was the same issue as #1409, but I tried with 13.10.2, 14.x.x and 15.0.0 and it is still broken there too.

To Reproduce

const div = document.createElement('div');
div.id = 'test-element';
div.addEventListener('focus', (event) => {
  console.log('focused!');
  
  // BUG: In 13.6.2 this returns `true` but after 13.7.0+ it returns `false`
  // Browsers return `true` here.
  console.log('matches :focus-visible?', event.target.matches(':focus-visible'));
});

document.body.appendChild(div);
document.getElementById('test-element')?.focus();

Expected behavior

Focus events should set the element as matching the :focus-visible.

[capricorn86]

Thank you for reporting @EvHaus! 🙂

These selectors where actually not supported in v13.6.2. There was a bug which made the pseudo selector to match when it did not recognize the pseudo selector.

I have added support for :focus and :focus-visible now. However, :focus-visible will be considered a match for any focused element, as Happy DOM can't differentiate between tabbed elements and input field focus etc. right now.

You can read more about the release here:
https://github.com/capricorn86/happy-dom/releases/tag/v15.6.0

[EvHaus]

Thanks for the super fast response!

However, :focus-visible will be considered a match for any focused element, as Happy DOM can't differentiate between tabbed elements and input field focus etc. right now.

That seems perfectly reasonable to me.