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.
https://popover.oddbird.net
BSD 3-Clause "New" or "Revised" License
269 stars 14 forks source link

prevent default on clicks to avoid firefox crash #160

Closed keithamus closed 12 months ago

keithamus commented 12 months ago

Description

This fixes https://github.com/oddbird/popover-polyfill/issues/139. Currently the demo page crashes in Firefox (without popovers enabled) if you click the "Click to toggle shadowed popover" button.

Looking through a crash log, we can see this is because Firefox tries to handle the popover using their popover logic, but the logic isn't guarded to check the feature flag, and it tries to get the element by its ID, which is empty. The empty id check fails for some reason, and we end up with a crash:

So, this is definitely a bug in Firefox. Exceptions like this shouldn't happen, I've filed https://bugzilla.mozilla.org/show_bug.cgi?id=1868740 and I'll work on a patch to fix it.

In the meantime, however, we have an opportunity to fix it ourselves, because postHandleEvent() will only be called if the event's default wasn't prevented. Consequently, simply adding event.preventDefault() in our JS fixes this issue.

Steps to test/reproduce

Show me

N/A

netlify[bot] commented 12 months ago

Deploy Preview for popover-polyfill ready!

Name Link
Latest commit 9eef4ea1a95cce9bc364ccaa0871f4bf7dbc0195
Latest deploy log https://app.netlify.com/sites/popover-polyfill/deploys/657195cb7c04b90008f27e61
Deploy Preview https://deploy-preview-160--popover-polyfill.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.