Intro To Storybook - Tests Fail after 'Single Component/Automated Testing' steps

Tests are expected to pass after pasting the code from the guide in the project. The output on yarn jest:

yarn run v1.19.0
$ /Users/jnevitt/git/taskbox/node_modules/.bin/jest
 FAIL  src/storybook.test.js
  ● Test suite failed to run

    /Users/jnevitt/git/taskbox/src/storybook.test.js:2
    import initStoryshots from "@storybook/addon-storyshots";
           ^^^^^^^^^^^^^^

    SyntaxError: Unexpected identifier

      at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
      at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:579:25)

 FAIL  src/App.test.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:

    SyntaxError: /Users/jnevitt/git/taskbox/src/App.test.js: Unexpected token (6:31)

      4 |
      5 | test('renders learn react link', () => {
    > 6 |   const { getByText } = render(<App />);
        |                                ^
      7 |   const linkElement = getByText(/learn react/i);
      8 |   expect(linkElement).toBeInTheDocument();
      9 | });

      at Parser.raise (node_modules/@babel/parser/lib/index.js:6975:17)
      at Parser.unexpected (node_modules/@babel/parser/lib/index.js:8368:16)
      at Parser.parseExprAtom (node_modules/@babel/parser/lib/index.js:9627:20)
      at Parser.parseExprSubscripts (node_modules/@babel/parser/lib/index.js:9210:23)
      at Parser.parseMaybeUnary (node_modules/@babel/parser/lib/index.js:9190:21)
      at Parser.parseExprOps (node_modules/@babel/parser/lib/index.js:9056:23)
      at Parser.parseMaybeConditional (node_modules/@babel/parser/lib/index.js:9029:23)
      at Parser.parseMaybeAssign (node_modules/@babel/parser/lib/index.js:8975:21)
      at Parser.parseExprListItem (node_modules/@babel/parser/lib/index.js:10297:18)
      at Parser.parseCallExpressionArguments (node_modules/@babel/parser/lib/index.js:9407:22)

Test Suites: 2 failed, 2 total
Tests:       0 total
Snapshots:   0 total
Time:        1.126s
Ran all test suites.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

[jonniebigodes]

@jacknevitt sorry for the issue you’re experiencing. I think i have a solution for it… Going to make some more tests and report back, do you mind waiting a bit longer?

[jonniebigodes]

@domyen and @jacknevitt if you both don’t mind i’m going to close this now as it’s answered.

@jacknevitt If you have further questions, re-open it and leave a comment or try the Discord chat or the Storybook issue tracker. Thanks!