-
Notifications
You must be signed in to change notification settings - Fork 395
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
test: add tests for new behavior with native lifecycle invocations #4248
Conversation
elm.toggleSpans(); | ||
await Promise.resolve(); | ||
assertSlottedChildrenLength(elm, 1); | ||
expect(window.timingBuffer.length).toBe(6); | ||
expect(window.timingBuffer[3]).toBe( | ||
'x-use-api-version-61-sloter: disconnectedCallback' | ||
); | ||
// Notice x-use-api-version-60-slotee disconnectedCallback is fired but not its connectedCallback | ||
expect(window.timingBuffer[4]).toBe( | ||
'x-use-api-version-60-slotee: disconnectedCallback' | ||
); | ||
expect(window.timingBuffer[5]).toBe('x-use-api-version-61-sloter: connectedCallback'); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
When the sloter is moved, the browser will fire the native disconnectedCallback
which will disconnect the entire subtree.
The browser will then call native connectedCallback
which runs through rehydration > VDOM diffing to determine if it should unmount/mount/patch any of the elements.
Since the sloter's subtree structure hasn't changed (slotee hasn't changed), the engine determines there's no need to do anything and moves on.
The browser will then call the slotee's native connectedCallback
but since it's using synthetic lifecycle (apiVersion = 60
) it will skip invoking.
We're left with the subtree having disconnectedCallback
invoked but not a follow up connectedCallback
.
We're observing 2 issues with this:
- Customer rely on these lifecycle methods to set state in their component which are being invoked differently from before.
- We're seeing wire adapters disconnecting and not being reconnected.
Because of #4249 I doubt we will keep trying to do native custom element lifecycle via API versioning. But it is good to know what the current behavior is. |
Details
With the introduction of native lifecycle, we're observing new behavior when an element is moved inside the DOM.
This PR adds some tests to verify the current behavior.
Does this pull request introduce a breaking change?
Does this pull request introduce an observable change?