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

Storyshots Jest example configuration throws error on Import #910

Closed
flanamacca opened this issue Apr 17, 2017 · 2 comments
Closed

Storyshots Jest example configuration throws error on Import #910

flanamacca opened this issue Apr 17, 2017 · 2 comments

Comments

@flanamacca
Copy link

Went through the details on https://github.com/storybooks/storybook/tree/master/packages/storyshots and followed it through.

No love with the configuration it details.

`Configure your app for Jest

Usually, you might already have completed this step. If not, here are some resources for you.

If you are using Create React App, it's already configured for Jest. You just need to create a filename with the extension .test.js.
Otherwise check this Egghead lesson.
Configure Storyshots

Create a new test file with the name Storyshots.test.js. (Or whatever the name you prefer). Then add following content to it:

import initStoryshots from 'storyshots';
initStoryshots();
That's all.

Now run your Jest test command. (Usually, npm test.) Then you can see all of your stories are converted as Jest snapshot tests.`

FAIL .\Storyshots.test.js
● Test suite failed to run

evalmachine.<anonymous>:1
(function (exports, require, module, __filename, __dirname) { import { configure } from '@kadira/storybook';
                                                              ^^^^^^
SyntaxError: Unexpected token import

  at createScript (vm.js:56:10)
  at Object.runInThisContext (vm.js:97:10)
  at runWithRequireContext (node_modules\storyshots\dist\require_context.js:103:37)
  at testStorySnapshots (node_modules\storyshots\dist\index.js:72:35)
  at Object.<anonymous> (Storyshots.test.js:2:52)

Test Suites: 1 failed, 1 passed, 2 total
Tests: 1 passed, 1 total
Snapshots: 0 total
Time: 3.412s
Ran all test suites.

@xavxyz
Copy link
Member

xavxyz commented Apr 17, 2017

You can fix this by creating a .babelrc file in .storybook folder with the same presets create-react-app uses:

{
  "presets": ["es2015", "react"]
}

Should this kind of babel config become the kind of default? If not, we should definitely document it.

Edit: closing it, duplicate of #880.

@xavxyz xavxyz closed this as completed Apr 17, 2017
@xogeny
Copy link
Contributor

xogeny commented Jun 29, 2017

I'm running into exactly this issue. For the record, I'm not using CRA. I created a .babelrc file in .storybook with exactly what was suggested. It made no difference. Is there some other thing I need to do to get babel to pay attention to that file?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants