Comments (33)
@benmccann > 2.1.1 is out now which fixes the file paths in package.json
I still got the same error :(
from svelte-jester.
@sebastianrothe thanks for the info. I'm fairly new to typescript so didn't realize ts-node was implicit. I think offering a next version for testing ESM is a good move. Do you have a timeframe as to when the next release will come that will revert back to the old CJS way but with support for jest 27? Just wondering if I should revert back to jest 26 the old 1.x version for the time being if its going to take a while? Thanks again for the support
from svelte-jester.
@sebastianrothe thanks for the info. I'm fairly new to typescript so didn't realize ts-node was implicit. I think offering a next version for testing ESM is a good move. Do you have a timeframe as to when the next release will come that will revert back to the old CJS way but with support for jest 27? Just wondering if I should revert back to jest 26 the old 1.x version for the time being if its going to take a while? Thanks again for the support
I'll try to find some time next week.
from svelte-jester.
Quick response: have a look over here #59 (comment)
You need to tell ts-node to not transform your jest.config.ts config, which is really weird btw.
from svelte-jester.
TLDR:
Put this in your tsconfig.json"ts-node": { "moduleTypes": { "jest.config.ts": "cjs" }, "transpileOnly": true }
Thanks guys but i'm not using a jest.config.ts file. My jest config is in my package.json..... Of course I could create one and move the config but I shouldn't be forced to. I',m also not using ts-node, just ts-jest. I feel like this project should not have switched to using ESM at this point. I was previously having the issue with import.meta not being supported - due to jest26 - which is why I upgraded but that issue only existed in one file so I was happy to mock it for testing. This new version seems like we are having to jump through all sorts of hoops and still failing. Plus as @micschwarz pointed out using experimental flags for production projects is not great.
Working with Sveltekit has been awesome so far with the exception of testing support. I know Sveltekit is still pre 1.0 software so its going to have gaps and issues but getting this setup is by far the biggest problem so far.
from svelte-jester.
@kevpye-fabdata have you tried
npm i -D [email protected] --force
That works for me with Jest 27.
from svelte-jester.
I resolved this issue by downgrading svelte-jester to 1.8.2 and added jsdom.
from svelte-jester.
It seems that the newest version of the svelte-jester is not compatible with jest library for the lack of process function, by degrading svelte-jester and adding jsdom, everything will works fine. @GHesericsu Thank you for the suggestion.
from svelte-jester.
You have to use jest with es modules. Which brings its own challanges, especially with external dependencies
from svelte-jester.
Thanks for the reply @micschwarz . This is not written anywhere on the current readme - unless i'm going blind. I think this should be made clearer as its a pretty major change not to be mentioned at all in the current documentation. However, even after changing jest to use es modules as per the jest documentation I still get the same problem regarding the synchronous transformer.
The jest documentation says to disable code transforms by passing transform: {} or otherwise configure your transformer to emit ESM. The current documentation instructs us to use
"transform": {
"^.+\\.svelte$": [
"svelte-jester",
{
"preprocess": true
}
]
}
I am using typescript, and thus ts-jest, so I changed my preset to "preset": "ts-jest/presets/default-esm"
to configure the transformer to emit esm. I have tried leaving the transform as shown above and in the readme, I have tried setting the transform to the jest suggestion of transform: {} but I get the same error either way.
I can tell node is running in experimental mode as I get the warnings " ExperimentalWarning: VM Modules is an experimental feature. This feature could change at any time" in my console when executing.
Here is my full jest setup following the jest suggestions to enable ESM - as I mentioned I also tested with the transform: {} shown above with the same results
"jest": {
"preset": "ts-jest/presets/default-esm",
"globals": {
"ts-jest": {
"useESM": true
}
},
"moduleNameMapper": {
"\\$lib\\/(.*)$": "<rootDir>/src/lib/$1"
},
"transform": {
"^.+\\.svelte$": [
"svelte-jester",
{
"preprocess": true
}
]
},
"moduleFileExtensions": [
"js",
"ts",
"svelte"
],
"setupFilesAfterEnv": [
"@testing-library/jest-dom/extend-expect"
]
}
from svelte-jester.
TLDR:
Put this in your tsconfig.json
"ts-node": {
"moduleTypes": {
"jest.config.ts": "cjs"
},
"transpileOnly": true
}
from svelte-jester.
Is there any chance to get this running without experimental vm modules? Using experimental flags for professional projects is not that great. And jests automock does not work with esm.
In addition some imports don't work.
import {Dropdown} from 'bootstrap';
does not work, as jest with node expects something like import bootstrap from 'bootstrap';
, but that is not working for rollup.
Edit: import * as bootstrap from 'bootstrap';
works. But you have to think about it and not let the IDE just import it
from svelte-jester.
Yes, the switch to esm was more problematic then we thought. We are going to change the versioning again and offer ESM support in a version next. We will support async and commonjs with version 2.x. See #61
Nevertheless, esm support is not happening without the experimental flag. This is also enforced by jest itself.
You can have the same config in your package.json.
Also, ts-Node is implicit, if you use typescript and jest.
from svelte-jester.
@kevpye-fabdata have you tried
npm i -D [email protected] --force
That works for me with Jest 27.
I tested this and it gives me several warnings on install - which is not surprising as the dependency versions do not match between this and ts-jest
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: [email protected]
npm WARN node_modules/jest
npm WARN peer jest@"^27.0.0" from [email protected]
npm WARN node_modules/ts-jest
npm WARN dev ts-jest@"^27.0" from the root project
npm WARN 1 more (the root project)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer jest@"<= 26" from [email protected]
npm WARN node_modules/svelte-jester
npm WARN dev svelte-jester@"1.8.2" from the root project
But it does seem to work when I run my tests so I will leave it for now and update this once the next version is out. As the 2.x version that @sebastianrothe is going to try and work on this week will revert back to CJS I still had to go back to mocking my app settings file that uses the import meta syntax as it seems that is only supported for ESM imports with jest without doing some other trickery with babel. For me it was much simpler to simply mock my settings file using a setuptests file and adding it setupFilesAfterEnv setting in package.json.
from svelte-jester.
Downgrading to 1.8.2
helped for me, too. In addition, I had to also downgrade jest and ts-jest to version 26.x.x
to have my tests passing again.
from svelte-jester.
2.1.0 is out now with the CJS build. Is this fixed as a result?
from svelte-jester.
Downgrading to
1.8.2
helped for me, too. In addition, I had to also downgrade jest and ts-jest to version26.x.x
to have my tests passing again.
perhaps there are some incompatible apis between the versions.
from svelte-jester.
Hey what's happening? I upgraded to 2.1.0 from the 2.0.something which threw that weird process error. Yet now I get even more serious looking error:
Module svelte-jester in the transform option was not found.
<rootDir> is: xxx
Going into the node_modules/svelte-jester
folder and looking at the package.json
I see:
"main": "src/transformer.cjs",
"module": "src/transformer.mjs",
Yet inside the folder there is only dist
folder. Did you guys forget to update the paths?
from svelte-jester.
I haven't had a chance to test 2.1.0 yet in my project. I will try to look at it early next week and will report if I see the same problem as @TeemuKoivisto
from svelte-jester.
Doh! Thanks for pointing that out. That should have been updated. PR here: #69. If you change the package.json
in node_modules/svelte-jester
manually does it fix it for you?
from svelte-jester.
@benmccann Hey, good to hear. Updating the paths to dist fixes it but it still throws the process error.
/node_modules/svelte-jester/dist/transformer.cjs must export a "process" function.
I wonder what's up with that.
from svelte-jester.
What if you also remove "type": "module"
from your package.json
? Does that change it?
from svelte-jester.
Nope. After poking around a little I added the process function Jest so sternly requires which changes the error into something else. With:
var transformer = {
process: processAsync,
processAsync
};
The error is now:
TypeError: Jest: a transform's `process` function must return a string, or an object with `code` key containing this string. It's `processAsync` function must return a Promise resolving to it.
from svelte-jester.
Hmm. It looks like you can't use processAsync
with CJS jestjs/jest#11458. I guess we'd have to restore all the old code from before #57 if we want to support CJS
Maybe transpiling isn't the way to go then and we'd be better off including two separate code bases for CJS and for ESM where CJS uses process
and ESM uses processAsyn
. It might result in some duplication, but this is a small enough library that maybe that's okay
from svelte-jester.
Not sure if it's a problem with CJS per se. I am importing the mjs file and removed my commonjs plugin as well as changed the module in my tsconfig to es2020 to no avail. It just seems that Jest it not playing well with the async processing. Granted this whole thing is quite messy so I'm not sure exactly what causes what. Having sync version in the cjs file would seem reasonable as otherwise I'm forced to downgrade 👍.
from svelte-jester.
@TeemuKoivisto would you be able to share a reproduction?
from svelte-jester.
2.1.1 is out now which fixes the file paths in package.json
from svelte-jester.
@TeemuKoivisto would you be able to share a reproduction?
Ahh. Well. I must say I can't put too much effort into this but here's a library https://github.com/teemukoivisto/svelte-tree-view I've been working on and just made public. It's kinda ready just missing tests, hence I'm here posting.
So to reproduce what I've been doing you'd have to clone it, then yarn
to install deps, go to the node_modules/svelte-jester
and change the package.json
paths to dist
instead of src
. Or just install that new version you published.
After that, go to core
folder and try yarn test
and you should receive the error. I have tried various combinations of things with that setup, mainly changing the file in the svelte-jester main
block to include only the mjs
file, removing the commonjs plugin and changing the tsconfig's modules to es2020 and also adding "type": "module"
to the core/package.json (and doing a fresh yarn
install) yet nothing seems to change the error. It does seem jest tries to load the cjs
file in the main
block but switching to mjs doesn't seem to have effect.
Anyway, don't know much else. I'll use the 1.8 version for now and make some tests.
from svelte-jester.
Hi there, I'm relatively new to svelte, and I've been running head-first into this problem for the past couple of days. If you want to reproduce this error, one way is to make a new scaffolded svelte app with TS support according to the svelte pages, then to follow this tutorial: (https://web.archive.org/web/20210127075453/https://timdeschryver.dev/blog/how-to-test-svelte-components). I've archived it just in case the author edits.
The tutorial doesn't suggest specific versions of any library, but rather the latest.
from svelte-jester.
Here's instructions to make it work in ESM mode: rossyman/svelte-add-jest#19 (comment)
from svelte-jester.
Hello you all,
In the Jest documentation (to write custom transformers) it is stated that (quote) "...As can be seen, only process is mandatory to implement..." read here in jestdoc
Also looking at the typescript decl (same page), it is the only mandatory member function in interface SyncTransformer
PS: in interface AsyncTransformer
it is processAsync
is mandatory and all others are optional
interface SyncTransformer<OptionType = unknown> {
canInstrument?: boolean; //OPTIONAL
createTransformer?: (options?: OptionType) => SyncTransformer<OptionType>; //OPTIONAL
getCacheKey?: ... //OPTIONAL
getCacheKeyAsync?: ... //OPTIONAL
process: ( //MANDATORY
sourceText: string,
sourcePath: Config.Path,
options: TransformOptions<OptionType>,
) => TransformedSource;
processAsync?... //(OPTIONAL)
}
from svelte-jester.
process
was added back in 2.1.2
from svelte-jester.
Looks like the 2.1.2 change may have a regression: #74.
from svelte-jester.
Related Issues (20)
- Add presets like vue-jest
- Svelte 4 support HOT 7
- Add mechanism to call beforeEach() and afterEach() manually inside an it block HOT 1
- Allow to use CJS with Svelte 4 without throwing an error HOT 3
- jest 27 + svelte-jester 2 HOT 14
- Phantom file listed in coverage HOT 2
- Support components mocks HOT 2
- yarn vs npm
- jestOptions?.transformerConfig Unexpected token '.' HOT 2
- TypeError [ERR_INVALID_ARG_TYPE] HOT 16
- Regression in 2.1.2: a transform must export a `process` or `processAsync` function. HOT 9
- Cannot find module './preprocess.js' HOT 13
- TypeError [ERR_INVALID_ARG_TYPE] - Sapper HOT 2
- Cannot import from context="module" HOT 10
- Image imports that use typescript alias returns undefined HOT 1
- ParseError: Colon is expected (svelte with scss style) HOT 1
- Coverage of untested files not collected HOT 8
- Completely fails when using preprocessing HOT 4
- <svelte:component/> breaks rendering with `TypeError: switch_value is not a constructor` HOT 1
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 svelte-jester.