Comments (9)
I'm facing a similar issue since I updated my Ionic-Project from v7 to v8. I created a basic demo project. Just do "npm install" and "ng test". When adding the workaround with stencil version 4.18.1 like mentioned above, it's working.
Github Repo with example: https://github.com/Floscho2402/ionic-8-jest-issue
from stencil.
I was experiencing the same error, so I had to add this override in my package.json to make it work:
"overrides": {
"@ionic/angular": {
"@stencil/core": "4.18.1"
}
}
It's a temporary workaround until it's resolved.
from stencil.
Thanks for the issue! This issue has been labeled as needs reproduction
. This label is added to issues that need a code reproduction.
Please reproduce this issue in an Stencil starter component library and provide a way for us to access it (GitHub repo, StackBlitz, etc). Without a reliable code reproduction, it is unlikely we will be able to resolve the issue, leading to it being closed.
If you have already provided a code snippet and are seeing this message, it is likely that the code snippet was not enough for our team to reproduce the issue.
For a guide on how to create a good reproduction, see our Contributing Guide.
from stencil.
seems like adoptedStyleSheets is not supported by jsdom. question is why this stencil code is executed now and not before. because this code part is there in the stencil code for a long time.
jsdom/jsdom#3444
https://github.com/ionic-team/stencil/blame/5f4fcfa12e701ece8884aa1e3b3143bd2221e0a0/src/runtime/styles.ts#L103
i am getting this error in an ionic project using ionic/angular/standalone components and jest
i can confirm it is working with 4.18.1
from stencil.
seems like adoptedStyleSheets is not supported by jsdom.
If you use stencil test
you don't use JSDOM but something we call MockDoc which is the Stencil version of MockDoc. There we may also not supported this interface, however I couldn't find an obvious change between v4.18.1 and v4.18.2 that could have caused this. A reproducible example would be helpful to do investigations here.
from stencil.
Thank you @Floscho2402 for providing the reproduction case. I will take a look as soon as i can.
from stencil.
@Floscho2402 I checked out your reproduction case and struggle to reproduce the case. I've done the following:
❯ g clone https://github.com/Floscho2402/ionic-8-jest-issue.git
Cloning into 'ionic-8-jest-issue'...
...
Resolving deltas: 100% (2/2), done.
❯ cd ionic-8-jest-issue/
❯ npm i
...
added 1735 packages, and audited 1736 packages in 38s
219 packages are looking for funding
run `npm fund` for details
2 moderate severity vulnerabilities
To address all issues (including breaking changes), run:
npm audit fix --force
Run `npm audit` for details.
❯ npx ng test
...
PASS src/app/pages/maintenance/components/demo/demo.component.spec.ts (15.494 s)
DemoComponent
✓ should create (43 ms)
Test Suites: 1 passed, 1 total
Tests: 1 passed, 1 total
Snapshots: 0 total
Time: 16.988 s
Ran all test suites.
Even after removing the given Stencil dependency from @ionic/core
and installing @latest
I still get a passing test.
from stencil.
@christian-bromann I am really surprised. I have no idea why it works for you. Before I uploaded the code, I checked it with a colleague and he also gets the same error as me. To be sure I tried it again and deleted my node_modules, ran "npm cache clear --force" and "jest --clearCache". Then I reinstalled everything and still got the error.
I don't know, if it's relevant for you, but this is my ionic info output:
Ionic:
Ionic CLI : 7.2.0 (C:\Users\flori\AppData\Roaming\npm\node_modules@ionic\cli)
Ionic Framework : @ionic/angular 8.2.2
@angular-devkit/build-angular : 17.3.8
@angular-devkit/schematics : 17.3.8
@angular/cli : 17.3.8
@ionic/angular-toolkit : 11.0.1
Utility:
cordova-res : not installed globally
native-run : not installed globally
System:
NodeJS : v18.15.0 (C:\Program Files\nodejs\node.exe)
npm : 9.5.0
OS : Windows 10
from stencil.
This will be fixed in #5838. You can use a dev release by running npm install @stencil/[email protected]
. Please let me know if this still causes issues.
from stencil.
Related Issues (20)
- bug: watchIgnoredRegex is not respected during `stencil build --watch` HOT 2
- bug: puppeteer: piercing on level 1 breaks HOT 8
- bug: `autofocus` prop/attr is defined on other HTML attribute types instead of `HTMLAttributes` HOT 2
- bug: HOT 6
- bug: missing root element's scope id as classname in user provided children HOT 2
- Attribute ping is missing on AnchorHTMLAttributes HOT 3
- bug: Cannot read properties of undefined (reading 'isProxied') HOT 2
- bug: Stencil v4.18.1 breaks support for Jest v26 HOT 10
- bug: intermediate parents' scope ids are not reflected to the children elements HOT 3
- bug: Removing polyfills except for es5 builds breaks existing installs HOT 16
- bug: __mocks__ copied to output target HOT 3
- bug: Cannot access uninitialized variable, only in Safari, works with dev build HOT 3
- bug: Test files copied to output target HOT 8
- bug: When i try to integrate with react application, the slot element contains hidden attribute instead of displaying the content. Note: This stencil component is using scoped element. HOT 8
- feat: Style modes load styles only when needed HOT 1
- Stencil becomes a dependency to project when installing with --legacy-peer-deps HOT 4
- bug: unable to compile using angular's standalone mode (2) HOT 1
- bug: exception in an async componentWillLoad method will break the rendering cycle HOT 2
- feat: Next.js Support
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from stencil.