oddbird / popover-polyfill

Polyfills the HTML popover attribute and showPopover/hidePopover/togglePopover methods onto HTMLElement, as well as the popovertarget and popovertargetaction attributes on <button> elements.
BSD 3-Clause "New" or "Revised" License
247 stars 14 forks source link

Error in Safari on iOS 15.8.x #216

Closed dannyotto closed 1 month ago

dannyotto commented 1 month ago

The following line of code generates an error in Safari under iOS 15.8.x

if (selector?.includes(':popover-open'))

I was able to fix the error in this way:

let isPopoverOpen = new RegExp('(?:^|\\s)'+":popover-open", 'i').test(selector);
if (isPopoverOpen) {
   selector = selector.replace(nonEscapedPopoverSelector,"$1.\\:popover-open");
}

There is certainly a more elegant way.

Currently line 150 of https://github.com/oddbird/popover-polyfill/blob/main/src/popover.ts

jgerigmeyer commented 1 month ago

@dannyotto Can you paste the error, or steps to reproduce? Both optional chaining and String.includes should be supported by Safari 15, and I'm not able to reproduce an error.

dannyotto commented 1 month ago

The error message is:

TypeError: _selector.includes is not a function. (In '_selector.includes(":popover-open")', '_selector.includes' is undefined)

dannyotto commented 1 month ago

I have just noticed that it is due to the interaction with other elements of my application. The element stored in _selector no longer exists when the error is triggered. I didn't immediately think of this because it is an element that should not be affected by the polyfill.

However, the error does not occur in other, more up-to-date browsers.