Mocha tests for React (jsx) aren't parsed as jsx if test filename has .js extension

[yairEO]

Repo - https://github.com/yairEO/swc-js-extension-fails-with-jsx-content

Describe the bug

Hi, I am trying to convert a large project from Mocha + babel to Mocha + SWC, but get errors if the test file extension ends with .js and not .jsx. I have hundreds of files like this.

Renaming one of them makes SWC compile it correctly, but I really prefer keeping the tests files with the .js extension.

the project is based on React v16, so every component and its test file has the React import:

import React from 'react';

I would assume SWC would be smart enough to automatically know the content of the file is JSX...

Input code

No response

Config

{
    "$schema": "https://json.schemastore.org/swcrc",
    "jsc": {
      "parser": {
        "syntax": "ecmascript",
        "jsx": true,
        "dynamicImport": false,
        "privateMethod": true,
        "functionBind": false,
        "exportDefaultFrom": true,
        "exportNamespaceFrom": false,
        "decorators": true,
        "decoratorsBeforeExport": true,
        "topLevelAwait": false,
        "importMeta": false
      },
      "transform": {
        "legacyDecorator": true,
        "react": {
          "pragma": "React.createElement",
          "pragmaFrag": "React.Fragment",
          "throwIfNamespace": true,
          "development": false,
          "useBuiltins": false
        },
        "optimizer": {
          "globals": {
            "vars": {
              "__DEBUG__": "true"
            }
          }
        }
      },
      "target": "es5",
      "loose": false,
      "externalHelpers": false,
      // Requires v1.2.50 or upper and requires target to be es2016 or upper.
      "keepClassNames": false
    },
    "minify": false
}

Expected behavior

Should transpile JSX for .js files automatically

Actual behavior

No response

Version

1.5.5

Additional context

Am using these packages:

"@swc-node/register": "1.5.5",
"swc": "1.0.11",
"mocha": "9.2.2",

Running the tests with this .mocharc:

{
  "exit": true,
  "color": true,
  "require": ["@swc-node/register", "test/register.js", "test/setup.js"],
  "ignore": "node_modules"
}

[kdy1]

Use @swc/ore instead

[yairEO]

Hi @kdy1, thank you for your answer but may I ask why would that make any difference using @swc/core?

Should I uninstall @swc or keep it?

---

Update - replaced @swc with @swc/core. It doesn't change anything.

[kdy1]

This can't be fixed without a repro

[yairEO]

Repo - https://github.com/yairEO/swc-js-extension-fails-with-jsx-content

[kdy1]

@yairEO Remove https://github.com/yairEO/swc-js-extension-fails-with-jsx-content/blob/8b9df6322aa5ef3a5220cd62f565d72e9a3e1e93/.swcrc#L3
This makes swc not compile .js files

[yairEO]

@kdy1 - no, it's not that.

Makes no sense it is related, and also just tried and it makes no difference..
Still SWC doesn't auto-detect jsx content within .js file extension

[kdy1]

Okay I tested it and it's not an issue of swc.

It's problem of your mocha config. swc is not called at all

[kdy1]

I did `npm i @swc/cli` and verified that it's compiling jsx

[yairEO]

Thanks for the help, but how is it possible swc isn't used by mocha if it's required by it:

https://github.com/yairEO/swc-js-extension-fails-with-jsx-content/blob/master/.mocharc.json#L4

"require": ["@swc-node/register", "setup.js"],

I've just verified "@swc-node/register" 100% getting called.

[kdy1]

I don't know well about mocha

[yairEO]

I've just verified @swc-node/register 100% getting called from Mocha.

Without it it cannot compile any tests, not even .jsx files.

If you remove it from the .mocharc file, you will see mocha will be unable to understand jsx and it won't pass through SWC.

I don't think this is a Mocha-related issue, because the same setup with Babel works well, for js files...

With Babel:

.mocharc.json - "require": ["@babel/register", "setup.js"],

With SWC:

.mocharc.json - "require": ["@swc-node/register", "setup.js"],

[yairEO]

Any news?

I really really want to switch the company's huge codebase from Babel to SWC :)

Babel is super-slow in our case with too many files

[swc-bot]

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.