Skip to content

Conversation

@karlseguin
Copy link
Collaborator

The first time a slotchange event is registered, we setup a SlotChangeMonitor on the page. This uses a global (ugh) MutationEvent to detect slot changes.

We could improve the perfomance of this by installing a MutationEvent per custom element, but a global is obviously a lot easier.

Our MutationEvent currently fired during the changes. This is problematic (in general, but specifically for slotchange). You can image something like:

slot.addEventListener('slotchange', () => {
   // do something with slot.assignedNodes()
});

But, if we dispatch the slotchange during the MutationEvent, assignedNodes will return old nodes. So, our SlotChangeMonitor uses the page scheduler to schedule dispatches on the next tick.

The first time a `slotchange` event is registered, we setup a SlotChangeMonitor
on the page. This uses a global (ugh) MutationEvent to detect slot changes.

We could improve the perfomance of this by installing a MutationEvent per
custom element, but a global is obviously a lot easier.

Our MutationEvent currently fired _during_ the changes. This is problematic
(in general, but specifically for slotchange). You can image something like:

```
slot.addEventListener('slotchange', () => {
   // do something with slot.assignedNodes()
});
```

But, if we dispatch the `slotchange` during the MutationEvent, assignedNodes
will return old nodes. So, our SlotChangeMonitor uses the page scheduler to
schedule dispatches on the next tick.
@karlseguin karlseguin merged commit 202e137 into main Sep 24, 2025
10 checks passed
@karlseguin karlseguin deleted the slotchange branch September 24, 2025 01:23
@github-actions github-actions bot locked and limited conversation to collaborators Sep 24, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants