question-mark
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.

Can't set callback arg to `null` on @storybook/react 6.3.0

See original GitHub issue

Describe the bug As of @storybook/react 6.3.0 can’t seem to set a callback arg to null, the argTypesRegex seems to over zealously create an actionHandler when manually setting an arg callback to null. This wasn’t happening with @storybook/react 6.2.9

To Reproduce Please create a reproduction by running npx sb@next repro and following the instructions. Read our documentation to learn more about creating reproductions. Paste your repository and deployed reproduction here. We prioritize issues with reproductions over those without.

https://github.com/quangv/storybook_bug-null-callback

specifically: https://github.com/quangv/storybook_bug-null-callback/commit/4f5a1e898999158ff10221bb11dc2db525399145

export const Primary = Template.bind({});
Primary.args = {
  primary: true,
  label: 'Button',
  onClick: null // can't seem to set this to null
};

Only way I can figure out how to keep it null is tweaking the argsTypesRegex

parameters: { actions: { argTypesRegex: '^on(?!Click).*' } }

System

`ᐅ npx sb@next info

Environment Info:

System: OS: macOS 11.4 CPU: (16) x64 Intel® Core™ i9-9980HK CPU @ 2.40GHz Binaries: Node: 12.22.1 - ~/.nvm/versions/node/v12.22.1/bin/node Yarn: 2.4.2 - ~/.nvm/versions/node/v12.22.1/bin/yarn npm: 6.14.13 - ~/.nvm/versions/node/v12.22.1/bin/npm Browsers: Chrome: 91.0.4472.114 Safari: 14.1.1 npmPackages: @storybook/addon-actions: ^6.4.0-alpha.2 => 6.4.0-alpha.2 @storybook/addon-docs: ^6.4.0-alpha.2 => 6.4.0-alpha.2 @storybook/addon-essentials: ^6.4.0-alpha.2 => 6.4.0-alpha.2 @storybook/addon-links: ^6.4.0-alpha.2 => 6.4.0-alpha.2 @storybook/react: ^6.4.0-alpha.2 => 6.4.0-alpha.2`

Additional context n/a

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:1
  • Comments:6 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
shilmancommented, Jun 28, 2021

Jiminy cricket!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.3.1 containing PR #15394 that references this issue. Upgrade today to the @latest NPM tag to try it out!

npx sb upgrade
0reactions
brandonthomascommented, Sep 12, 2022

@brandonthomas can you please share a reproduction? i just tried it in the original repro & it demonstrates the bug, but upgraded to 6.5 and the bug is fixed (for that example, at least)

Just did more digging and looks like we had an erroneous argTypesRegex so I think we’re good now. It was pulling in a bunch of on* render functions. Removal of argTypesRegex fixed the issue.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Can't set callback arg to `null` on @storybook/react 6.3.0 #15370
Describe the bug As of @storybook/react 6.3.0 can't seem to set a callback arg to null , the argTypesRegex seems to over zealously...
Read more >
Addon Actions is not handling React events properly #6471
Attempting to use action from @storybook/addon-actions causes console errors and the output doesn't match the docs, possibly due to how the ...
Read more >
Args - Storybook - JS.ORG
It is a JSON serializable object composed of string keys with matching valid value types that can be passed into a component for...
Read more >
I can't install react using npx create-react-app? - Stack Overflow
It's possible that a firewall or such is blocking node from carrying out a function, hence why it's throwing a callback() never called...
Read more >
@storybook/react | Yarn - Package Manager
Storybook for React: Develop React Component in isolation with Hot Reloading. storybook. readme. Storybook. Build bulletproof UI components faster. Build Status ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found