Can't get Jasmine 4 to support .jsx files

EvHaus commented 2 years ago

Are you creating an issue in the correct repository?

I hope so. Only the core jasmine dependency is used to reproduce this.

Expected Behavior

Spec files with the .jsx extension should be loadable by jasmine@4 when used with babel.

Current Behavior

Trying to load a .jsx file throws:

TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".jsx" for /home/projects/node-pmddnq/spec/jsx.spec.jsx
    at Loader.t.defaultGetFormat [as _getFormat] (https://node-pmddnq.w.staticblitz.com/blitz.bc2b78560fa0e6097e7f69d4e820659cab64d2c5.js:6:731743)
    at Loader.getFormat (https://node-pmddnq.w.staticblitz.com/blitz.bc2b78560fa0e6097e7f69d4e820659cab64d2c5.js:6:865150)
    at Loader.getModuleJob (https://node-pmddnq.w.staticblitz.com/blitz.bc2b78560fa0e6097e7f69d4e820659cab64d2c5.js:6:866865)
    at Loader.import (https://node-pmddnq.w.staticblitz.com/blitz.bc2b78560fa0e6097e7f69d4e820659cab64d2c5.js:6:865920)
    at Jasmine._loadFiles (/home/projects/node-pmddnq/node_modules/jasmine/lib/jasmine.js:215:5)
    at Jasmine.loadSpecs (/home/projects/node-pmddnq/node_modules/jasmine/lib/jasmine.js:206:3)
    at Jasmine.execute (/home/projects/node-pmddnq/node_modules/jasmine/lib/jasmine.js:502:3)
    at runJasmine (/home/projects/node-pmddnq/node_modules/jasmine/lib/command.js:158:5)
    at Command.run (/home/projects/node-pmddnq/node_modules/jasmine/lib/command.js:57:9) {
  code: 'ERR_UNKNOWN_FILE_EXTENSION'

Possible Solution

Not sure. This wasn't a problem in jasmine@3.99, so maybe the new ESM changes in jasmine@4 are causing it?

Suite that reproduces the behavior (for bugs)

https://stackblitz.com/edit/node-pmddnq?file=README.md

Context

Makes v4 somewhat un-useable for React projects.

Your Environment

Version used: 4.0.0
Environment name and version (e.g. Chrome 39, node.js 5.4): Node 16.13.1
Operating System and version (desktop or mobile): MacOS
Link to your project: https://stackblitz.com/edit/node-pmddnq?file=README.md

sgravrock commented 2 years ago

Well, it didn't take long at all to get the answer to "do we still need the jsLoader setting, and why?". One of the ways in which dynamic import isn't quite a drop-in replacement for require is that it only accepts paths that use a small predefined list of extensions, which doesn't include .jsx.

I'm not sure how best to reconcile the conflict between providing good support for ES modules and supporting nonstandard (but very common) file extensions. But as a quick fix you can get around the problem by adding jsLoader": "require" to your jasmine.json file.

EvHaus commented 2 years ago

@sgravrock Darn, that sucks. I can confirm that jsLoader: "require" fixes the problem.

Thanks for updating the docs in 1e133d6bebd6c51b9ebb4b91807db85a2fb4fdd4. Can I suggest updating the React documentation page here as well? Given that most React users will be following that guide I think the .jsx info will be relevant to them there.

sgravrock commented 2 years ago

Done.

But I also think Jasmine can probably handle this transparently, by falling back to require() when it gets that particular error code. The drawback I see is that it'd lead to more confusing errors if someone tries to use ES module syntax in a JSX file without transpiling, but hopefully that's a rare scenario.

EvHaus commented 2 years ago

Thanks! Going to close this issue as this addresses my initial issue.

ch1c0t commented 2 years ago

Thanks to you both for handling this issue promptly. It resolved the same issue for .coffee files in coffeelib.

sgravrock commented 2 years ago

I've also just released 4.0.1, which handles this situation without the need for a configuration change.

EvHaus commented 2 years ago

Confirmed. With 4.0.1 jsx files work without jsLoader: "require". Thanks!

jasmine / jasmine-npm