fix(mock-doc): move slot event listener support from runtime to MockDoc#6287
Merged
christian-bromann merged 1 commit intomainfrom Jun 11, 2025
Merged
fix(mock-doc): move slot event listener support from runtime to MockDoc#6287christian-bromann merged 1 commit intomainfrom
christian-bromann merged 1 commit intomainfrom
Conversation
Moves the addEventListener/removeEventListener/dispatchEvent support for slot elements from the runtime to MockDoc where it belongs, since this issue only affects unit testing with Stencil's mock DOM implementation. **Root Cause:** In scoped components, slots are polyfilled using text/comment nodes. During unit testing, MockDoc's text nodes (MockTextNode) lacked event handling methods, causing "addEventListener is not a function" errors when attaching slot event listeners like onSlotchange. **Solution:** - Add addEventListener, removeEventListener, and dispatchEvent methods to the base MockNode class so all node types can handle events - Revert the previous runtime changes that incorrectly placed this fix in the slot polyfill utilities - Add appropriate override modifiers to MockElement methods **Testing:** - All slot onSlotchange tests pass - MockDoc test suite continues to pass - Runtime functionality remains unaffected Fixes the same issue as the previous runtime fix but places the solution in the correct layer (MockDoc) rather than in the runtime code.
2 tasks
johnjenkins
approved these changes
Jun 11, 2025
1 task
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What is the current behavior?
The slot event listener fix from PR #6281 was incorrectly implemented in the runtime layer (
src/runtime/slot-polyfill-utils.tsandsrc/runtime/vdom/vdom-render.ts). However, as correctly pointed out by @johnjenkins in #6281 (comment), this issue only manifests during unit testing with Stencil's MockDoc implementation, not in actual runtime scenarios.The problem occurs because in scoped components, slot elements are polyfilled using text/comment nodes, and MockDoc's
MockTextNodeclass (which inherits fromMockNode) lacked the necessary event handling methods (addEventListener,removeEventListener,dispatchEvent), causing "addEventListener is not a function" errors during unit tests.What is the new behavior?
This PR moves the slot event listener support from the runtime to MockDoc where it properly belongs:
src/runtime/slot-polyfill-utils.tsandsrc/runtime/vdom/vdom-render.tsaddEventListener,removeEventListener,dispatchEvent) to the baseMockNodeclass insrc/mock-doc/node.tsThis ensures that all MockDoc node types (including text nodes used for slot polyfills) can handle events during unit testing, while keeping the runtime code clean and focused on actual browser behavior.
Documentation
N/A
Does this introduce a breaking change?
Testing
npm run test.jest -- src/runtime/test/scoped.spec.tsxnpm run test.jest -- src/mock-docnpm run test.jest -- src/runtime/test/render-vdom.spec.tsxOther information
Special thanks to @johnjenkins for correctly identifying that this fix belonged in MockDoc rather than the runtime! 🙏
This refactoring addresses his feedback and results in a cleaner, more appropriate solution that:
The original issue from #6269 is still resolved, but now with the fix in the correct layer of the codebase.