webcomponents / webcomponents/polyfills

[scoped-custom-element-registry] Missing native events on firefox

Open
#580 3 comments 4 reactions 0 assignees View on GitHub
Focus Area: Standards & Polyfills Type: Bug wontfix
Dominant language
HTML
Stars
1.2k
Forks
168
PR merge metrics
No merged PRs in 30d

Description

### Description

Hello,
I was working on a web-component with a element, and was having issues with my events that I managed to narrow down to importing scoped-custom-element-registry. The bug only happens on firefox and not on chrome.

I have a web-component built using lit v3 that contains a dialog element. As soon as I add an import to scoped-custom-element-registry, all events dispatched inside the dialog element fail to propagate outside of the web-component

### Example

Here is a minimal html page to reproduce

```

import {LitElement, html} from 'https://cdn.jsdelivr.net/gh/lit/dist@3/core/lit-core.min.js';
import "https://cdn.jsdelivr.net/npm/@webcomponents/scoped-custom-element-registry@0.0.9/src/scoped-custom-element-registry.js"

export class MyModal extends LitElement {
render() {
return html`
<button @click=${this.open}>open</button>
<dialog>
<slot></slot>
</dialog>
`;
}

open() {
this.shadowRoot.querySelector("dialog").showModal()
}
}

customElements.define('my-modal', MyModal);



click here

document.querySelector("#main").addEventListener("click", (e) => console.log("click on main", e, e.target))

```

### Steps to reproduce

Click on the button to open the dialog, and click again inside.
Expected behavior is to have two logs "click on main" in the console, one for each click.

On firefox, the second click event does not propagate upwards ouside of the web-component.
Removing the scoped-custom-element-registry import fixes the problem.
This affects all events (not only MouseEvents).

### Version

Lit-element v3
@webcomponents/scoped-custom-element-registry v0.0.9

### Browsers affected

It looks like it only recently stopped working on firefox, a colleague mistakenly had an no-up-to-date firefox v109 and could not reproduce it.

- [ ] Chrome
- [x] Firefox
- [ ] Edge
- [ ] Safari
- [ ] IE 11

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.