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

with-jest results in jest syntax / unexpected token while testing react mounts #4776

Closed
xzilja opened this issue Jul 13, 2018 · 3 comments
Closed
Labels
good first issue Easy to fix issues, good for newcomers

Comments

@xzilja
Copy link

xzilja commented Jul 13, 2018

Examples bug report

Example name

with-jest

Describe the bug

with-jest example implementation results in following error

SyntaxError: /Users/ilja/Documents/Repositories/alacrity-frontend/packages/oasis/tests/index.test.js: Unexpected token (6:20)

  4 | 
  5 | it('App renders correctly', () => {
> 6 |   const app = mount(<App />);
    |                     ^
  7 |   expect(app).toMatchSnapshot();
  8 | });
  9 | 

To Reproduce

.babelrc

{
  "env": {
    "test": {
      "presets": [["next/babel", { "preset-env": { "modules": "commonjs" } }]],
      "plugins": ["@babel/plugin-transform-flow-strip-types"]
    },
    "development": {
      "presets": ["next/babel"],
      "plugins": ["@babel/plugin-transform-flow-strip-types"]
    },
    "production": {
      "presets": ["next/babel"],
      "plugins": ["@babel/plugin-transform-flow-strip-types"]
    }
  }
}

jest.config.js

module.exports = {
  testPathIgnorePatterns: ['.next/', 'node_modules/'],
  setupFiles: ['<rootDir>/enzyme.config.js'],
  moduleNameMapper: {
    '\\.(css|less)$': 'identity-obj-proxy',
    '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$':
      '<rootDir>/__mocks__/file.js',
  },
  snapshotSerializers: ['enzyme-to-json/serializer'],
};

enzyme.config.js

import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

Enzyme.configure({ adapter: new Adapter() });

package.json

  "devDependencies": {
    "@babel/core": "7.0.0-beta.53",
    "@babel/plugin-transform-flow-strip-types": "7.0.0-beta.53",
    "babel-core": "^7.0.0-0",
    "babel-eslint": "8.2.6",
    "babel-jest": "23.4.0",
    "enzyme": "3.3.0",
    "enzyme-adapter-react-16": "1.1.1",
    "enzyme-to-json": "3.3.4",
    "flow-bin": "0.76.0",
    "jest": "23.4.0",
    "jest-styled-components": "5.0.1"
  }

Expected behavior

Should pass, as babel is set up to handle react components properly?

System information

  • OS: macOS
  • Version of Next.js: 6.1.1
@timneutkens timneutkens added help wanted good first issue Easy to fix issues, good for newcomers labels Jul 13, 2018
@dbrudner
Copy link
Contributor

Any update on this? I'm getting a similar error on my own project.

timneutkens pushed a commit that referenced this issue Aug 17, 2018
Running the [with-jest](https://github.com/zeit/next.js/tree/canary/examples/with-jest) example  results in the following error:

```log
 FAIL  __tests__/index.test.js
  ● Test suite failed to run

    SecurityError: localStorage is not available for opaque origins
      
      at Window.get localStorage [as localStorage] (node_modules/jsdom/lib/jsdom/browser/Window.js:257:15)
          at Array.forEach (<anonymous>)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        0.943s
Ran all test suites.
error Command failed with exit code 1.
```

Upgrading the dependencies (jest) to the latest version helps!

[More info](jsdom/jsdom#2304)

Related #4776
@alehatsman
Copy link

alehatsman commented Sep 14, 2018

@timneutkens
Can this one be closed?

@timneutkens
Copy link
Member

Thanks 👍

@lock lock bot locked as resolved and limited conversation to collaborators Sep 14, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
good first issue Easy to fix issues, good for newcomers
Projects
None yet
Development

No branches or pull requests

4 participants