[Bug]: Cannot read properties of undefined (reading 'location') #22142

Muhammad-Magomedov · 2023-04-18T12:49:13Z

Describe the bug

I installed storyshots and followed the instructions in the documentation, but when running the npm test script (test:jest), I'm getting the error "TypeError: Cannot read properties of undefined (reading 'location')."

To Reproduce

No response

System

No response

Additional context

No response

The text was updated successfully, but these errors were encountered:

Chandan9898Kumar · 2023-04-20T17:04:21Z

@Muhammad-Magomedov please mock the location

shilman · 2023-04-23T10:36:58Z

Storyshots executes in node, so window.location is undefined. As mentioned by @Chandan9898Kumar you need to mock it.

FTWinston · 2023-06-16T16:38:54Z

I'm getting this same error after upgrading many packages.

I thought I'd worked around it by setting the test environment to jsdom, but that just led to additional problems.

If mocking is required, could that be mentioned here?
https://storybook.js.org/addons/@storybook/addon-storyshots-puppeteer

Possibly it's worth clarifying that it's not a crash in my code, or with any particular story, but that it happens within the call to initStoryshots:

TypeError: Cannot read properties of undefined (reading 'location')
      at getSelectionSpecifierFromPath (node_modules/@storybook/preview-api/dist/index.js:70:1115)
      at new UrlStore (node_modules/@storybook/preview-api/dist/index.js:70:1627)
      at new PreviewWeb (node_modules/@storybook/preview-api/dist/index.js:73:1158)
      at Object.start (node_modules/@storybook/preview-api/dist/index.js:94:2133)
      at start (node_modules/@storybook/addon-storyshots/dist/frameworks/react/loader.js:18:45)
      at Object.<anonymous> (node_modules/@storybook/react/dist/index.js:1:3027)
      at node_modules/@storybook/addon-storyshots/dist/frameworks/react/loader.js:24:32
      at Object.load (node_modules/@storybook/addon-storyshots/dist/frameworks/react/loader.js:30:23)
      at loadFramework (node_modules/@storybook/addon-storyshots/dist/frameworks/frameworkLoader.js:36:19)
      at testStorySnapshots (node_modules/@storybook/addon-storyshots/dist/api/index.js:28:99)

I'm on storybook 7.0.21, jest 29.5.0, puppeteer 20.7.2, and vite 4.3.2.

FTWinston · 2023-06-19T11:41:30Z

I can bypass the above error by running the following in setupFilesAfterEnv:

global = {
    location: {
        search: '',
    }
}

But that just brings me to an error in jest-specific-snapshot:

Cannot destructure property 'currentDescribeBlock' of 'state' as it is undefined.
      at eventHandler (node_modules/jest-circus/build/eventHandler.js:86:14)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/node_modules/jest-specific-snapshot/dist/index.js:33:1)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/dist/test-bodies.js:4:1)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/dist/api/ensureOptionsDefaults.js:3:23)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/dist/api/index.js:8:49)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/dist/index.js:21:31)

Chandan9898Kumar · 2023-06-19T16:42:40Z

@FTWinston > I can bypass the above error by running the following in setupFilesAfterEnv:

global = {
    location: {
        search: '',
    }
}

But that just brings me to an error in jest-specific-snapshot:

Cannot destructure property 'currentDescribeBlock' of 'state' as it is undefined.
      at eventHandler (node_modules/jest-circus/build/eventHandler.js:86:14)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/node_modules/jest-specific-snapshot/dist/index.js:33:1)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/dist/test-bodies.js:4:1)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/dist/api/ensureOptionsDefaults.js:3:23)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/dist/api/index.js:8:49)
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/dist/index.js:21:31)

Just pass the condition there,as it is undefined

FTWinston · 2023-06-19T17:36:35Z

Just pass the condition there,as it is undefined

Sorry, I don't follow.

This isn't in my code, it's still within the call to initStoryshots, before it's started testing my stories.

FTWinston · 2023-06-29T10:10:56Z

I get this error on a new vite repo, running storyshots against storybook 7.0.24. I've attached a reproduction:
22142-reproduction.zip

I also made an attempt at a stackblitz reproduction, though that hits a stack overflow rather than the above error.

Please advise on any additional configuration that may be required to get addon-storyshots-puppeteer to run its axeTest function.

joriswitteman · 2023-07-05T09:16:50Z

I get the same currentDescribeBlock error as OP after mocking location through jest.config.js.

Storybook 7.0.25 against Next.js.

Also OP please edit the title to include StoryShots

FTWinston · 2023-07-06T09:31:42Z

This comment suggests that Storyshots won't get any further updates. As it doesn't currently run, this potentially means it isn't actually currently supported, and that the docs "just" need updated to state this?

jonniebigodes · 2023-11-28T18:19:15Z

The Storyshots addon is officially deprecated and will be removed in a future release of Storybook. To help with the transition process, we've created a migration guide for the available options and common use cases.

kasir-barati · 2023-12-03T14:05:41Z

UPDATE in 21.12.2023

Resolved it, you can find more info here

Original comment

For me it is happening with this .storybook/main.ts:

import type { StorybookConfig } from '@storybook/nextjs';
import path from 'path';

export default {
    stories: [
        '../app/**/*.mdx',
        '../libs/**/*.mdx',
        '../app/**/*.stories.@(js|jsx|mjs|ts|tsx)',
        '../libs/**/*.stories.@(js|jsx|mjs|ts|tsx)',
    ],
    addons: [
        '@storybook/jest',
        '@storybook/addon-links',
        '@storybook/addon-essentials',
        '@storybook/addon-onboarding',
        '@storybook/addon-interactions',
    ],
    framework: {
        name: '@storybook/nextjs',
        options: {
            nextConfigPath: path.resolve(
                __dirname,
                '../next.config.js',
            ),
        },
    },
    docs: {
        autodocs: 'tag',
    },
    typescript: {
        check: true,
        skipCompiler: false,
    },
} satisfies StorybookConfig;

and here is my .storybook/preview.ts:

import type { Preview } from '@storybook/react';

export default {
    parameters: {
        actions: { argTypesRegex: '^on[A-Z].*' },
        controls: {
            matchers: {
                color: /(background|color)$/i,
                date: /Date$/i,
            },
        },
    },
} satisfies Preview;

and here is my preview-head.html:

<script>
    document.cookie = 'access_token=' + 'jwtToken';
</script>

But I am still getting this error msg:

 pnpm storybook

> my-project@0.1.0 storybook /Users/kasir.barati/projects/nextjs-playground
> storybook dev -p 6006

@storybook/cli v7.6.3

TypeError: Cannot read properties of undefined (reading 'location')
    at instrument (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/@storybook+jest@0.2.3_jest@29.7.0/node_modules/@storybook/jest/dist/index.js:385:38)
    at Object.<anonymous> (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/@storybook+jest@0.2.3_jest@29.7.0/node_modules/@storybook/jest/dist/index.js:392:121)
    at Module._compile (node:internal/modules/cjs/loader:1257:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1311:10)
    at Object.newLoader (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/esbuild-register@3.5.0_esbuild@0.18.20/node_modules/esbuild-register/dist/node.js:2262:9)
    at extensions..js (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/esbuild-register@3.5.0_esbuild@0.18.20/node_modules/esbuild-register/dist/node.js:4838:24)
    at Module.load (node:internal/modules/cjs/loader:1115:32)
    at Module._load (node:internal/modules/cjs/loader:962:12)
    at Module.require (node:internal/modules/cjs/loader:1139:19)
    at require (node:internal/modules/helpers:121:18)
TypeError: Cannot read properties of undefined (reading 'location')
    at instrument (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/@storybook+jest@0.2.3_jest@29.7.0/node_modules/@storybook/jest/dist/index.js:385:38)
    at Object.<anonymous> (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/@storybook+jest@0.2.3_jest@29.7.0/node_modules/@storybook/jest/dist/index.js:392:158)
    at Module._compile (node:internal/modules/cjs/loader:1257:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1311:10)
    at Object.newLoader (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/esbuild-register@3.5.0_esbuild@0.18.20/node_modules/esbuild-register/dist/node.js:2262:9)
    at extensions..js (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/esbuild-register@3.5.0_esbuild@0.18.20/node_modules/esbuild-register/dist/node.js:4838:24)
    at Module.load (node:internal/modules/cjs/loader:1115:32)
    at Module._load (node:internal/modules/cjs/loader:962:12)
    at Module.require (node:internal/modules/cjs/loader:1139:19)
    at require (node:internal/modules/helpers:121:18)
info => Starting manager..
WARN No story files found for the specified pattern: app/**/*.mdx
WARN No story files found for the specified pattern: libs/**/*.mdx
info => Starting preview..
info Using Babel compiler
info Addon-docs: using MDX2
info => Using implicit CSS loaders
info => Using default Webpack5 setup
<i> [webpack-dev-middleware] wait until bundle finished
<i> [webpack-dev-middleware] wait until bundle finished: /mockServiceWorker.js
╭─────────────────────────────────────────────────────╮
│                                                     │
│   Storybook 7.6.3 for nextjs started                │
│   273 ms for manager and 5.34 s for preview         │
│                                                     │
│    Local:            http://localhost:6006/         │
│    On your network:  http://192.168.178.49:6006/    │
│                                                     │
╰─────────────────────────────────────────────────────╯
No errors found.
No errors found.

Any idea? I do not have storyshot but why is this error still occuring?

Chandan9898Kumar · 2023-12-21T17:41:47Z

For me it is happening with this .storybook/main.ts:

import type { StorybookConfig } from '@storybook/nextjs';
import path from 'path';

export default {
    stories: [
        '../app/**/*.mdx',
        '../libs/**/*.mdx',
        '../app/**/*.stories.@(js|jsx|mjs|ts|tsx)',
        '../libs/**/*.stories.@(js|jsx|mjs|ts|tsx)',
    ],
    addons: [
        '@storybook/jest',
        '@storybook/addon-links',
        '@storybook/addon-essentials',
        '@storybook/addon-onboarding',
        '@storybook/addon-interactions',
    ],
    framework: {
        name: '@storybook/nextjs',
        options: {
            nextConfigPath: path.resolve(
                __dirname,
                '../next.config.js',
            ),
        },
    },
    docs: {
        autodocs: 'tag',
    },
    typescript: {
        check: true,
        skipCompiler: false,
    },
} satisfies StorybookConfig;

and here is my .storybook/preview.ts:

import type { Preview } from '@storybook/react';

export default {
    parameters: {
        actions: { argTypesRegex: '^on[A-Z].*' },
        controls: {
            matchers: {
                color: /(background|color)$/i,
                date: /Date$/i,
            },
        },
    },
} satisfies Preview;

and here is my preview-head.html:

<script>
    document.cookie = 'access_token=' + 'jwtToken';
</script>

But I am still getting this error msg:

 pnpm storybook

> my-project@0.1.0 storybook /Users/kasir.barati/projects/nextjs-playground
> storybook dev -p 6006

@storybook/cli v7.6.3

TypeError: Cannot read properties of undefined (reading 'location')
    at instrument (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/@storybook+jest@0.2.3_jest@29.7.0/node_modules/@storybook/jest/dist/index.js:385:38)
    at Object.<anonymous> (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/@storybook+jest@0.2.3_jest@29.7.0/node_modules/@storybook/jest/dist/index.js:392:121)
    at Module._compile (node:internal/modules/cjs/loader:1257:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1311:10)
    at Object.newLoader (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/esbuild-register@3.5.0_esbuild@0.18.20/node_modules/esbuild-register/dist/node.js:2262:9)
    at extensions..js (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/esbuild-register@3.5.0_esbuild@0.18.20/node_modules/esbuild-register/dist/node.js:4838:24)
    at Module.load (node:internal/modules/cjs/loader:1115:32)
    at Module._load (node:internal/modules/cjs/loader:962:12)
    at Module.require (node:internal/modules/cjs/loader:1139:19)
    at require (node:internal/modules/helpers:121:18)
TypeError: Cannot read properties of undefined (reading 'location')
    at instrument (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/@storybook+jest@0.2.3_jest@29.7.0/node_modules/@storybook/jest/dist/index.js:385:38)
    at Object.<anonymous> (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/@storybook+jest@0.2.3_jest@29.7.0/node_modules/@storybook/jest/dist/index.js:392:158)
    at Module._compile (node:internal/modules/cjs/loader:1257:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1311:10)
    at Object.newLoader (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/esbuild-register@3.5.0_esbuild@0.18.20/node_modules/esbuild-register/dist/node.js:2262:9)
    at extensions..js (/Users/kasir.barati/projects/nextjs-playground/node_modules/.pnpm/esbuild-register@3.5.0_esbuild@0.18.20/node_modules/esbuild-register/dist/node.js:4838:24)
    at Module.load (node:internal/modules/cjs/loader:1115:32)
    at Module._load (node:internal/modules/cjs/loader:962:12)
    at Module.require (node:internal/modules/cjs/loader:1139:19)
    at require (node:internal/modules/helpers:121:18)
info => Starting manager..
WARN No story files found for the specified pattern: app/**/*.mdx
WARN No story files found for the specified pattern: libs/**/*.mdx
info => Starting preview..
info Using Babel compiler
info Addon-docs: using MDX2
info => Using implicit CSS loaders
info => Using default Webpack5 setup
<i> [webpack-dev-middleware] wait until bundle finished
<i> [webpack-dev-middleware] wait until bundle finished: /mockServiceWorker.js
╭─────────────────────────────────────────────────────╮
│                                                     │
│   Storybook 7.6.3 for nextjs started                │
│   273 ms for manager and 5.34 s for preview         │
│                                                     │
│    Local:            http://localhost:6006/         │
│    On your network:  http://192.168.178.49:6006/    │
│                                                     │
╰─────────────────────────────────────────────────────╯
No errors found.
No errors found.

Any idea? I do not have storyshot but why is this error still occuring?

Why don't mock the location ? it will fix it.

kasir-barati · 2023-12-21T21:06:45Z

@Chandan9898Kumar I updated my original comment. Read it again. It has been resolved

Muhammad-Magomedov added bug needs triage labels Apr 18, 2023

shilman added question / support addon: storyshots and removed bug needs triage labels Apr 23, 2023

joriswitteman mentioned this issue Jul 5, 2023

Provide configuration option to set which stories apply to which storyshots test runs #14525

Closed

jonniebigodes closed this as completed Nov 28, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Bug]: Cannot read properties of undefined (reading 'location') #22142

[Bug]: Cannot read properties of undefined (reading 'location') #22142

Muhammad-Magomedov commented Apr 18, 2023

Chandan9898Kumar commented Apr 20, 2023

shilman commented Apr 23, 2023

FTWinston commented Jun 16, 2023 •

edited

Loading

FTWinston commented Jun 19, 2023

Chandan9898Kumar commented Jun 19, 2023 •

edited

Loading

FTWinston commented Jun 19, 2023

FTWinston commented Jun 29, 2023 •

edited

Loading

joriswitteman commented Jul 5, 2023 •

edited

Loading

FTWinston commented Jul 6, 2023

jonniebigodes commented Nov 28, 2023

kasir-barati commented Dec 3, 2023 •

edited

Loading

Chandan9898Kumar commented Dec 21, 2023

kasir-barati commented Dec 21, 2023

[Bug]: Cannot read properties of undefined (reading 'location') #22142

[Bug]: Cannot read properties of undefined (reading 'location') #22142

Comments

Muhammad-Magomedov commented Apr 18, 2023

Describe the bug

To Reproduce

System

Additional context

Chandan9898Kumar commented Apr 20, 2023

shilman commented Apr 23, 2023

FTWinston commented Jun 16, 2023 • edited Loading

FTWinston commented Jun 19, 2023

Chandan9898Kumar commented Jun 19, 2023 • edited Loading

FTWinston commented Jun 19, 2023

FTWinston commented Jun 29, 2023 • edited Loading

joriswitteman commented Jul 5, 2023 • edited Loading

FTWinston commented Jul 6, 2023

jonniebigodes commented Nov 28, 2023

kasir-barati commented Dec 3, 2023 • edited Loading

UPDATE in 21.12.2023

Original comment

Chandan9898Kumar commented Dec 21, 2023

kasir-barati commented Dec 21, 2023

FTWinston commented Jun 16, 2023 •

edited

Loading

Chandan9898Kumar commented Jun 19, 2023 •

edited

Loading

FTWinston commented Jun 29, 2023 •

edited

Loading

joriswitteman commented Jul 5, 2023 •

edited

Loading

kasir-barati commented Dec 3, 2023 •

edited

Loading