Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Babel ignored when running tests #417

Open
JamesCoyle opened this issue Jan 11, 2019 · 1 comment

Comments

@JamesCoyle
Copy link

commented Jan 11, 2019

Environment

  1. node -v: [v10.13.0]

  2. npm -v: [6.4.1]

  3. npm ls jest: [23.6.0]

  4. your vscode-jest settings if customized:

    • jest.pathToJest? [yarn test]
  5. Operating system: [Windows 7]

Prerequisite

  • are you able to run jest test from command line? [Yes]
  • how do you run your tests from command line? [yarn test]

Steps to Reproduce

Run tests in console -> tests pass correctly

>yarn test
yarn run v1.12.1
$ jest
 PASS  tests/element.test.js
  √ El : Creates element (8ms)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        2.156s
Ran all test suites.
Done in 3.02s.

View autorun result in output -> test fails as babel not run for some reason

FAIL tests/element.test.js

  ● Test suite failed to run

    C:\Users\jcoyle\Documents\Repositories\Personal\element-js\tests\element.test.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import El from '../element';
                                                                                                    ^^

    SyntaxError: Unexpected identifier

      at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        0.457s
Ran all test suites related to changed files.

Relevant Debug Info

package.json details

{	
        "devDependencies": {
		"@babel/core": "^7.2.2",
		"@babel/preset-env": "^7.2.3",
		"babel-core": "7.0.0-bridge.0",
		"babel-jest": "^23.6.0",
		"jest": "^23.6.0"
	},
	"scripts": {
		"test": "jest"
	},
	"babel": {
		"presets": [
			"@babel/preset-env"
		]
	}
}

I doubt this is a configuration issue as there are several other issues open with very similar issues. #395 #408 #415

I did have issues getting the new babel version working from @babel/core rather than babel-core which is why I'm also using babel-core@7.0.0-bridge.0. Not sure if this is related and perhaps we need to wait for Jest to support @babel/core natively without needing the bridge.

@steven87vt

This comment has been minimized.

Copy link

commented Feb 27, 2019

I have a similar problem with vscode-jest and vue-jest. The configuration seems right because the tests are being found and run however they all fail on import Vue from 'vue'.

FAIL src/XXX.Web/ClientApp/components/auth/__tests__/login.spec.js

  ● Test suite failed to run

    Jest encountered an unexpected token

    This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

    By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

    Here's what you can do:
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/en/configuration.html

    Details:

    F:\dev\win\Workspaces\trunk\src\XXX.Web\test-setup.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import Vue from 'vue';
                                                                                             ^^^^^^

    SyntaxError: Unexpected token import

      at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/ScriptTransformer.js:440:17)

I tried providing a babel config directly in vue-jest config babel section but it is not run prior to the tests executing, or it if is the debug option isnt printing anything. The verbose flag also seems to be ignored.

module.exports = {
  verbose: true,
  modulePaths: ['<rootdir>/ClientApp'],
  moduleFileExtensions: ['js', 'json', 'vue'],
  moduleNameMapper: {
    '\\.(css|styl|less|sass|scss|jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': '<rootDir>/JestConfig/assetTransformer.js'
  },
  modulePathIgnorePatterns: ['bin/*', 'coverage/*', 'logs/*', 'obj/*', 'wwwroot/*'],
  globals: {
    NODE_ENV: 'test',
    'vue-jest': {
      babelConfig: {
        presets: [
          [
            '@babel/env',
            {
              targets: 'current node',
              useBuiltIns: 'usage',
              modules: 'commonjs',
              debug: true
            }
          ]
        ],
        plugins: ['transform-es2015-modules-commonjs', 'babel-plugin-dynamic-import-node']
      }
    }
  },
  transform: {
    '^.+\\.js$': 'babel-jest',
    '^.+\\.vue$': 'vue-jest'
  },
  setupFiles: ['./test-setup.js'],
  transformIgnorePatterns: ['node_modules/(?!(vue-full-calendar)/)']
}

In my case my src files are several directories under the opened workspace folder in vs code. This is because its an enterprise application with multiple project modules. I am providing absolute paths to both jest.pathToConfig and jest.pathToJest. These paths are on a different partition (F:)/dual boot shared drive then the installed vs code (C:). I dont think this should have an impact though.

"jest.autoEnable": true,
"jest.debugMode": true,
"jest.pathToConfig": "F:/dev/win/Workspaces/trunk/src/DCATS.Web/jest.config.js",
"jest.pathToJest": "F:/dev/win/Workspaces/trunk/src/DCATS.Web/node_modules/.bin/jest"

Interesting that after the --watch fails to start manually starting the jest runner clicking debug on an individual test breaks inside my custom babel config.js even with the above vue-jest babel config.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
2 participants
You can’t perform that action at this time.