mochajs / mocha

β˜•οΈ simple, flexible, fun javascript test framework for node.js & the browser

Home Page:https://mochajs.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

πŸ› Bug: Can't get the .css files to be ignored

Marco0491 opened this issue Β· comments

Bug Report Checklist

  • I have read and agree to Mocha's Code of Conduct and Contributing Guidelines
  • I have searched for related issues and issues with the faq label, but none matched my issue.
  • I have 'smoke tested' the code to be tested by running it outside the real test suite to get a better sense of whether the problem is in the code under test, my usage of Mocha, or Mocha itself.
  • I want to provide a PR to resolve this

Expected

I can't run the tests when I have a CSS file import because I can't get Mocha to ignore that specific extension. Everything I've found so far doesn't work.

Actual

When I run "npm run test" I get this error:

TypeError: Unknown file extension ".css"
at new NodeError (node:internal/errors:405:5)
at Object.getFileProtocolModuleFormat [as file:] (node:internal/modules/esm/get_format:79:11)
at defaultGetFormat (node:internal/modules/esm/get_format:124:36)
at defaultLoad (node:internal/modules/esm/load:84:20)
at nextLoad (node:internal/modules/esm/loader:163:28)
at ESMLoader.load (node:internal/modules/esm/loader:603:26)
at ESMLoader.moduleProvider (node:internal/modules/esm/loader:457:22)
at new ModuleJob (node:internal/modules/esm/module_job:64:26)
at ESMLoader.#createModuleJob (node:internal/modules/esm/loader:480:17)
at ESMLoader.getModuleJob (node:internal/modules/esm/loader:434:34)
at ModuleWrap. (node:internal/modules/esm/module_job:79:21)
make: *** [test] Error 1

Minimal, Reproducible Example

I installed babel/register and in the .mocharc.yml file I have " require: '@babel/register' "

To reproduce the error, simply import a CSS file within the JS file you want to test and run the "npm run test" command.

Versions

Mocha version: v9.2.2
Node: v18.17.1
OS: MacOS Sonoma 14.6.1

Additional Info

No response

https://antfu.me/posts/why-reproductions-are-required

There's no "simply" in web code πŸ™‚. We'd need to know: what versions of packages are you using? What package manager + lockfile, to understand transitive dependencies? What config files for things like Babel?

Please post a reproduction that we as maintainers can use to understand this issue. We'd be happy to take a look then.

Hi Joshua, you're absolutely right! For this reason, I created this sample repo with the current configurations from my project to allow you to replicate the issue. I hope it helps, and if you need anything else, feel free to let me know.

https://github.com/Marco0491/mocha-issue-simulation

Great, thanks! So this is not a bug in Mocha, it's just something that's unfortunately not straightforward to set up. Importing a file type not yet supported in Node.js, such as a CSS file:

import '../css/style.css';

...is not something Node.js knows how to do by default. So, yes, you'd have to do something like node with --import instead.

Talking about how to do that kind of stuff isn't what we'd use this issue tracker for. That's more of a support request. You'll want to ask on StackOverflow or post on our Discord's #help channel.

Separately, https://github.com/mochajs/mocha-examples would be a good place to file a request to have an example showing this.

in the .mocharc.yml file I have " require: '@babel/register' "

Aside: that repo doesn't have a .mocharc.yml file, or any other Mocha config file I can see?

Hi Joshua, thank you so much for the support and feedback. I will try asking on StackOverflow and also join your Discord channel.

In the meantime, I have added the .mocharc.yml file to my sample repo. Thanks again and have a great day!