Post

Luke
@lukewarlow.dev

One potential solution to rehide is to add an event listener for the blur (or focus out etc) event to the anchor and then re-add the attribute in it?

Christian "Schepp" Schaefer
@schepp.dev

That sounds like an approach to explore. Although I had the browser console.log the document.activeElement to me during find-in-page and cycling through results, and focus did not move to the result until one taps the enter key.

Luke
@lukewarlow.dev

If you used popovers for the labels you could rely on the only one being open at once behaviour along with a toggle event listener to readd hidden until found to the label? Could call showPopover from the beforematch event?

Christian "Schepp" Schaefer
@schepp.dev

Oh, that's an intriguing idea! Gonna explore that one. I also had thought of .hidden-until-found:has(::search-text:current) to at least solve the problem in the future, but I scrapped the idea the moment I realized that :has() does not allow pseudo elements as selectors (like :is() and :where())

0 reposts1 like

Luke
@lukewarlow.dev

Ah yeah it has to be a has enabled pseudo element or something which might be basically nothing right now? I think its to prevent cycles where your CSS changes the existence of a pseudo element. Perhaps that new one will be has enabled?

Christian "Schepp" Schaefer
@schepp.dev

It could be a candidate for the/an enabled-list as it is a pseudo element that you can't create yourself and therefore should not mistakenly lead to cycles. To be sure that :has() would not work I checked with the ::target-text pseudo element which is similar. It indeed did not work.