Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

TypeError: require(...) is not a function in initStoryshots()

See original GitHub issue

Describe the bug

I’m using storybook/vue and trying to run jest tests and generate snapshots with Storyshots but I’m getting TypeError: require(...) is not a function when initStoryshots() is called.

TypeError: require(...) is not a function

      1 | import initStoryshots from '@storybook/addon-storyshots'
      2 | 
    > 3 | initStoryshots()
        | ^
      4 | 

      at Object.<anonymous> (node_modules/iconv-lite/lib/index.js:144:29)
      at Object.<anonymous> (node_modules/raw-body/index.js:17:13)
      at Object.<anonymous> (node_modules/body-parser/lib/read.js:15:15)
      at Object.<anonymous> (node_modules/body-parser/lib/types/json.js:19:12)
      at loadParser (node_modules/body-parser/index.js:142:16)
      at Function.get [as json] (node_modules/body-parser/index.js:123:12)
      at Object.<anonymous> (node_modules/express/lib/express.js:78:27)
      at Object.<anonymous> (node_modules/express/index.js:11:18)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/node_modules/@storybook/core/dist/server/build-dev.js:13:39)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/node_modules/@storybook/core/server.js:4:18)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/dist/frameworks/configure.js:8:16)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/dist/frameworks/angular/loader.js:20:35)
      at node_modules/@storybook/addon-storyshots/dist/frameworks/frameworkLoader.js:18:41
          at Array.map (<anonymous>)
      at getLoaders (node_modules/@storybook/addon-storyshots/dist/frameworks/frameworkLoader.js:18:10)
      at Object.loadFramework [as default] (node_modules/@storybook/addon-storyshots/dist/frameworks/frameworkLoader.js:21:19)
      at testStorySnapshots (node_modules/@storybook/addon-storyshots/dist/api/index.js:48:39)
      at Object.<anonymous> (tests/jest/vue/Storyshots.test.js:3:1)

To Reproduce Follow the instructions on using Storyshots with storybook/vue

Code snippets This is the jest config that i’m using:

  "jest": {
    "browser": true,
    "globalSetup": "./tests/jest/global-setup.js",
    "testURL": "xxx",
    "testMatch": [
      "**/tests/jest/**/*.test.js"
    ],
    "moduleFileExtensions": [
      "ts",
      "vue",
      "js",
      "jsx",
      "json",
      "node"
    ],
    "moduleNameMapper": {
      "^vue$": "vue/dist/vue.common.js",
      "^vuex$": "vuex/dist/vuex.common.js",
      "^v-runtime-template$": "v-runtime-template/dist/v-runtime-template.js"
    },
    "testPathIgnorePatterns": [
      "/node_modules/",
      "/vendor/"
    ],
    "transform": {
    "^.+\\.tsx?$": "ts-jest",
    "^.+\\.js$": "./node_modules/babel-jest",
    "^.+\\.vue$": "./node_modules/vue-jest"
  },
  "transformIgnorePatterns": [
      "<rootDir>/node_modules/(?!(@storybook/.*\\.vue$))"
    ]
  },

System:

System: OS: macOS 10.15.4 CPU: (12) x64 Intel® Core™ i7-8850H CPU @ 2.60GHz Binaries: Node: 10.15.1 - /usr/local/bin/node Yarn: 1.13.0 - /usr/local/bin/yarn npm: 6.4.1 - /usr/local/bin/npm Browsers: Chrome: 80.0.3987.163 Firefox: 74.0 Safari: 13.1 npmPackages: @storybook/addon-actions: ^5.3.14 => 5.3.14 @storybook/addon-docs: ^5.3.14 => 5.3.14 @storybook/addon-knobs: ^5.3.14 => 5.3.14 @storybook/addon-links: ^5.3.14 => 5.3.14 @storybook/addon-storyshots: ^5.3.18 => 5.3.18 @storybook/addon-storysource: ^5.3.14 => 5.3.14 @storybook/vue: ^5.3.14 => 5.3.14

Issue Analytics

State:
Created 3 years ago
Reactions:20
Comments:35 (14 by maintainers)

Top GitHub Comments

7reactions

prtksxnacommented, May 15, 2020

I was able to fix this on my install. It was happening because I had jest@26.0.0. installed when storybook only supports up to 25.0.0 as pointed out in https://stackoverflow.com/questions/61706963/typeerror-require-requireactual-is-not-a-function.

While this is fixed in #10642 and part of a beta release for now I downgraded my jest — npm install jest@25.0.0 --save-dev — and everything is working fine.

6reactions

vdhcommented, Oct 7, 2020

@shilman It sure is a great feature GitHub added to help reduce issue noise… which unfortunately is completely undone when people use stale bot, which doesn’t notice or care about them at all and forces users to focus on making comments to shoo it away, instead of just using the reactions… 😞

Top Results From Across the Web

TypeError: require.requireActual is not a function

I'm not using requireActual anywhere in my code. It looks like Storybook does, though. A Google search turned up only one (since deleted) ......

TypeError: require(...) is not a function in initStoryshots() #10351

I'm using storybook/vue and trying to run jest tests and generate snapshots with Storyshots but I'm getting TypeError: require(...) is not a function...

TypeError: require(...) is not a function in Node.js | bobbyhadz

Calling the result of require() when the imported file doesn't have a default export of a function. Having cyclic dependencies (imports and exports...

Node.js – TypeError: require.requireActual is not a function – iTecNote

I'm getting an error on my Jest tests: FAIL test/storyshots.test.ts ○ Test suite failed to run TypeError: require.requireActual is not a function 1 ......

Storyshots Addon | Storybook: Frontend workshop for UI ...

import initStoryshots from '@storybook/addon-storyshots'; initStoryshots();. That's all. ... Configure Jest to work with Webpack's require.context().