[Bug]: TypeError: Cannot read properties of undefined (reading 'count') with onClick action

[magic-m-johnson]

Describe the bug

To Reproduce

just setup a react app with webpack or vite, then install storybook and create a story for a single button component

System

Environment Info:

  System:
    OS: macOS 13.5
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
  Binaries:
    Node: 18.13.0 - ~/.nodenv/versions/18.13.0/bin/node
    Yarn: 1.22.19 - ~/.nodenv/versions/18.13.0/bin/yarn
    npm: 9.6.7 - ~/.nodenv/versions/18.13.0/bin/npm
  Browsers:
    Chrome: 115.0.5790.170
    Safari: 16.6
  npmPackages:
    @storybook/addon-essentials: ^7.2.1 => 7.2.1
    @storybook/addon-interactions: ^7.2.1 => 7.2.1
    @storybook/addon-links: ^7.2.1 => 7.2.1
    @storybook/addon-onboarding: ^1.0.8 => 1.0.8
    @storybook/blocks: ^7.2.1 => 7.2.1
    @storybook/react: ^7.2.1 => 7.2.1
    @storybook/react-webpack5: ^7.2.1 => 7.2.1
    @storybook/testing-library: ^0.2.0 => 0.2.0

Additional context

No response

[sthiepaan]

I have the same error, here are my remarks:

• When I reload page at Story1 and click button on it, the error occur and Actions are not collected
• When I change from Story1 to Story2 and click button on it, the error is gone and Actions are collected
• When I change back from Story2 to Story1 and click button on it, the error is not appearing anymore
  and Actions are collected

So - from my understanding - it means, the error happens when clicking button right after on page load
and not when we re-render 🤔

[magic-m-johnson]

I have the same error, here are my remarks:

• When I reload page at Story1, the error occur and Actions are not collected
• When I change from Story1 to Story2, the error is gone and Actions are collected
• When I change back from Story2 to Story1, the error is not appearing anymore and Actions are collected

So - from my understanding - it means, the error happens on page load and not when we re-render 🤔

for me it happens whenever I trigger the assigned action, e.g. click the button.

[austinm911]

I get this error as well

import type { Meta, StoryObj } from '@storybook/react'
import { Loader2, Mail } from 'lucide-react'

import { Button } from './button'

const meta: Meta<typeof Button> = {
    component: Button,
    tags: ['autodocs'],
    parameters: {
        layout: 'centered',
    },
    argTypes: { onClick: { action: 'clicked' } },
}
export default meta

type Story = StoryObj<typeof Button>

export const Base: Story = {
	render: args => <Button {...args}>Button</Button>,
	args: {},
}

This is the component: https://github.com/shadcn-ui/ui/blob/3c9f7ca0e20638bf75833ef920f9b23f5d97bc71/apps/www/registry/default/ui/button.tsx

Error

Doesn't help using argTypes: { onClick: { control: false } },

[chloe-spendesk]

We're facing the same issue : Cannot read properties of undefined (reading 'count') when we click on a checkbox before clicking in any other field on the page.

[janarvaezkng]

I have a custom event fired, and using

argTypes: {
    onValueChange: { action: 'onvaluechange' },
  },

or even

import { actions } from '@storybook/addon-actions';
const eventsFromNames = actions('onValueChange');

args: { ...eventsFromNames }

triggers this error

[laverdet]

Same, downgrading @storybook/addon-essentials to 7.1.1 fixes it.

[Spielboerg]

Related/duplicate: #23741

[jasosims]

Same, downgrading @storybook/addon-essentials to 7.1.1 fixes it.

Yeah, that works for now. Unfortunately it's necessary to downgrade all of Storybook to 7.1.1 and not just this addon. Using Storybook 7.2.0 or newer with @storybook/addon-essentials 7.1.1 causes a different error instead (the one described in #23782).

[kasperpeulen]

Fixed in latest alpha release by #23804

[jasosims]

Just updated to Storybook 7.4.0 and I'm still seeing this error. After a manual reload of Storybook, any action that's tracked by the Actions addon starts throwing this error again, until I switch to a different story. Exact same problem as before.

[herzaso]

This is still happening in 7.4.1 as well

[bennylame]

Can confirm that it is still happening in 7.4.1

[IanVS]

@kasperpeulen looks like this is still broken, I'm observing it in my project as well.

[ndelangen]

Is there a reproduction repo anyone could share?

[IanVS]

@ndelangen here's what I learned when trying to reproduce:

• Still occurs in 7.5.0-alpha.2
• Only happens when the interactions tab is focused, and the page is reloaded

Here's a repro: https://stackblitz.com/edit/github-iz1qiv?file=src%2Fstories%2FButton.stories.ts

Because you can't reload the page in stackblitz, you'll need to download the project and run locally.

[ndelangen]

@IanVS I'm investigating.
Why does this repo mix yarn and npm?
It has a yarn config file, a yarn resolution field but a npm lockfile?

[ndelangen]

@IanVS

• I downloaded the template
• I unzipped it
• I deleted the npm lockfile
• I used yarn to install
• I used yarn to start storybook in dev mode
• I navigated to the second page story (logged-in).
• I observed the play function working
• I observed the interaction tab updating, showing 1 step
• I opened the browser console
• I refresh the page
• I'm not seeing the error anywhere.
• I refresh again, still no error.

When I look at the lockfile I removed it does have multiple versions of storybook for some reason!:

Am I doing anything wrong reproducing this?

[IanVS]

@ndelangen, I think the package-lock.json was created by storybook.new / stackblitz, which runs npm install && yarn storybook when it starts up. I'm not sure how to configure that...

So, I tried this again as well on a fresh laptop after re-downloading the zip file.

• I deleted the package-lock.json
• yarn install
• yarn storybook
• visit the button primary story
• there are no errors in console, and there is one logged action
• 
• view the interactions tab
• refresh the page
• no actions are logged, and there's an error in the console
• 

Maybe the difference is that my button story uses the actions addon, and the logged-in page story does not (onLogin is not an arg of the page, it's handled in the Header component).

[ndelangen]

I navigated to the second page story (logged-in).

I guess i should navigate to the button story instead.. I didn't know it had a play function.

[IanVS]

I added one for this reproduction. Sorry, should have made that clearer.