-
-
Notifications
You must be signed in to change notification settings - Fork 832
Description
Prerequisites
- I have read the Contributing Guidelines.
- I agree to follow the Code of Conduct.
- I have searched for existing issues that already report this problem, without success.
Stencil Version
4.36.0-4.40.0
Current Behavior
Importing @ionic/angular components (which depend on @stencil/core) in a testing environment using jsdom 27.1.0+ results in the following error:
TypeError: Cannot convert undefined or null to object
node_modules/@stencil/core/internal/client/index.js:266:124
node_modules/@stencil/core/internal/client/index.js:266:201
Expected Behavior
Tests should run without errors related to stencil
System Info
jsdom: 27.1.0 - 27.3.0 (tested)
@ionic/angular: 8.7.14
@stencil/core: (via Ionic dependency)
Test framework: Vitest
Stencil info output:
System: node 24.12.0
Platform: darwin (25.1.0)
CPU Model: Apple M4 Pro (14 cpus)
Compiler: node_modules/@stencil/core/compiler/stencil.js
Build: 1759440611
Stencil: 4.38.0 🎿
TypeScript: 5.5.4
Rollup: 4.34.9
Parse5: 7.2.1
jQuery: 4.0.0-pre
Terser: 5.37.0Steps to Reproduce
- Set up a test environment with:
- jsdom 27.1.0 or higher (tested up to 27.3.0)
- @ionic/angular (tested with 8.7.14)
- @stencil/core (via Ionic dependency)
- Vitest with jsdom environment
- Import an Ionic Angular component in a test file:
import { provideIonicAngular } from '@ionic/angular/standalone'; // or import any Ionic component
- Run the tests
In the attached reproduction repo, you can run npm test to see the issue occur after installing packages
Code Reproduction URL
https://github.com/gremlin896/stencil-jsdom-ionic-repro
Additional Information
The error occurs in
core/src/client/client-window.ts
Line 66 in 4026b45
| !!win.document && Object.getOwnPropertyDescriptor(win.document.adoptedStyleSheets, 'length')!.writable)() |
win.document.adoptedStyleSheets being undefined.
This has always been undefined in jsdom, but this code was previously unreachable due to the supportsConstructableStylesheets evaluating to false due to new CSSStyleSheet().replaceSync being undefined.
Since jsdom@27.1.0 new CSSStyleSheet().replaceSync now results in a function, so supportsConstructableStylesheets evaluates to true - causing the supportsMutableAdoptedStyleSheets check to run and error.
A closed related issue on the jsdom repo can be found here jsdom/jsdom#3998