Test using png mocks
When using imports with
*.png files it will crash denos testing system with a warning:
While I understand the problem, how can i mock away the png and replace it with an identity object or something similar?
In jest i would transform it away (https://stackoverflow.com/questions/46898638/importing-images-breaks-jest-test) but i am not sure how deno would handle thisStack Overflow
Importing images breaks jest test
In React components importing assets
(ex, import logo from "../../../assets/img/logo.png)
gives such error
({"Object.":function(module,exports,require,dirname,filename,global,jest){�PNG...
29 Replies
Not possible with Deno's built in test runner. Solution is to stick with
jest or vitestHmm, guessing i'd have to write everything in jest then, right ?
yes, use
jest or vitestThat's a shame, is there any support for this planned ?
Importing 'css' files will cause a similar issue so i am assuming a lot of people are running into this issue
no, support planned any time soon I'm afraid. The team is pretty evenly split on whether we should add a module loader API to support loading non-js files
so I doubt it would be added anytime soon
If i were to use something other than deno, i guess deno test, coverage and other things would also need to be done by jest ?
Ah, that's a shame
yes, all these features are part of the test runner.
I am a bit confused as to how front-end development and testing should even be possible then
vite + vitest is the typical setup
yeah but i cannot use
deno test and the coverage report then, right ?yes, but you can generate pretty much the same coverage report with vitest
I find it a bit ironic that one of the main advertised features of deno seems to be "no longer needing to learn a new test system everytime" and then exactly that is the case
fair enough
Is there a template on how to cleanly do this with deno ?
I hear ya, which is why I'm the camp that Deno should support module loaders
I'm not sure if we have a template for that. It should work the same way as you'd do in node
Yeah, but i am only familiar with jest (and all the weird edge cases it has) so i was hoping deno would offer a proper alternative.
I am fine with trying vitest though, guessing there is not much difference if i essentially use react-testing-lib for rendering anyways
if you're familiar with jest, you'll love vitest. It's basically jest for the modern times
Practically impossible to tell what is modern and not nowadays ._. everything is so fast and new anyways.
Just glad deno makes me forget about babel
The deno test runner is a bit barebones. Works well for simple stuff, but doesn't play well with complex frontend needs
hm, so it would be nice if there was a plugin for it i guess, but oh well, nohthing i can do about this now
tho i did loose a day trying to get this to run xD
thx a lot for the context !
would this work for starting vitest:
"test": "deno test -A --node-modules-dir=auto npm:vitest"
Kinda at a loss why it cant find any test files nad is generally not really doing anything and i am not sure if the how the root property interacts with deno and other options
its not running a setujp file or anything elseThe vitest documentation is pretty great. You can configure all of these things in their config file https://vitest.dev/config/#setupfiles
yeah i am reading through that rn
but my vite config came pre-configured with stuff for deno from the template, which i have no idea about
the getting started section of vitest tells you all about that
I'm afraid I don't have the bandwidth to guide you through that at the moment
NP, THX!
I've read through the docs but there is something blocking me from using this inside deno. I am getting this error with a library I wrote: link; It just says to "tell the maintainer", which is me, but I have no clue what vite expects here or if its some resolution problem with deno.
I understand that might be just a vite issue, but maybe if you are familiar with it you can throw me some doc link of what this error is even referring to ?
I am comparing my package.json and library to one from jsdom that isn't throwing the error, but i see no difference
The issue is that some portion of your code or a library that you're using is importing native node modules when vite is creating builds for the browser. This is not a deno or a vite/vitest issue, but an issue with whatever tries to import that in browser builds. Reason is that there is no
node:fs module in the browserHm... my code doesn'T use any node specific things that polyfill would fill, evne if i tried it with polyfill it fails.
I pretty much just wrote custom react hooks in that library. so i am guessing its a configuration problem ?
..or am i not allowed to touch
globalThis at all in any module otherwise its considered not compatible ?Hard to tell without seeing any code
I got all the code, but i really don't want to throw this at you sinec you already said you are tight on time. https://gitlab.zweieuro.at/wui/core/web-user-interface-node/-/releases/v2.5.1
It essentially just does some custom stuff with
global.window.<func here> its part of a big project i work on but that is essentially the API "out".
But its fine if it is undefined.GitLab
v2.5.1 · wui / core / Node Module · GitLab
2.5.1 (2025-03-05) Bug Fixes package.json: fix missingt type...
if something is scanning all imports and looking for illegal statements i could work around em if they are listed somewhere
as far as i can tell the only thing here is
Object.defineProperties(window, ... but even so, that should not trip any predefined things
Even if i delete everything inside the file i am trying to import it throw this error so i am suspecting its not even the content and something else is really wrong
I also treid to find the error inside vitest repo to maybe reverse enginer it, but i cant find it