STOP logging with Storybook Actions

  Рет қаралды 3,161

Chromatic

Chromatic

Күн бұрын

Пікірлер: 8
@rabinpradhan5603
@rabinpradhan5603 6 ай бұрын
What else can be actions can be used for except displaying the userEvent? Is this one is just use to replace the log or alert in the usecase story and show same value in action instead of the log or alert or there is also other use of this actions? Is it possible to get more than just the console. What I mean by this is is let's say that when I clicked in the button, then the new component get rendered. Is there a way to show something more useful in the action tab in such situation except just: onClick: () => action('Button Clicked')(),
@RicardoQBazan
@RicardoQBazan Жыл бұрын
Hey, great video! thanks for sharing. I have a little problem here: what about nested props? My component is like: interface HeaderProps { title: string // etc whateverProps: { onClick: () => void } } I tried: argTypes: { whateverProps: { onClick: { action: 'whatever clicked' }, }, }, but it doesn't work 😥
@chromaticui
@chromaticui Жыл бұрын
Thanks Ricardo! Unfortunately, controls does not yet support nested objects (other than JS objects). So you won't get the same experience for event handlers that are nested. Would you be open to sharing what the component interface looks like? I'd be interested to see the practical use case. Thanks! Chan
@alexmachin1785
@alexmachin1785 Жыл бұрын
Hey, Great video as usual 😉 I've always struggled to get actions working especially with custom events Are there any full examples of getting actions working with custom events like the onLogin event ?
@chromaticui
@chromaticui Жыл бұрын
Thanks! I totally get the confusion. I really didn't understand actions before researching this video. Check out storybook.new and spin up a new sandbox (with your preferred framework). There you'll see the examples that we cover in the video. But, by default, they use a configuration option that will be deprecated in the next major version of Storybook. So, it might be worth spinning that up and then running thru this tutorial in that cloud environment. Chan
@igorbeaver4692
@igorbeaver4692 8 ай бұрын
Great! But still don't get why writing action is better than just write console log
@AlexanderGee
@AlexanderGee 4 ай бұрын
I request a comma in the title of this video
Component Testing IRL (with testing-library and jest)
8:07
Chromatic
Рет қаралды 13 М.
Storybook Theming
3:29
Chromatic
Рет қаралды 6 М.
MAGIC TIME ​⁠@Whoispelagheya
00:28
MasomkaMagic
Рет қаралды 37 МЛН
Your Storybook EVERYWHERE | Embeds with Chromatic
6:30
Chromatic
Рет қаралды 4,6 М.
storybook vs cypress component testing
7:13
Murat Ozcan
Рет қаралды 1,3 М.
Beginner's Guide to the Bash Terminal
1:14:37
Joe Collins (EzeeLinux)
Рет қаралды 2,3 МЛН
Storybook for Design Systems
3:29
Chromatic
Рет қаралды 11 М.
Redux For Beginners | React Redux Tutorial
39:43
developedbyed
Рет қаралды 1,2 МЛН
Get started with Storybook Test
7:59
Chromatic
Рет қаралды 253
New Storybook
3:03
Chromatic
Рет қаралды 8 М.
MAGIC TIME ​⁠@Whoispelagheya
00:28
MasomkaMagic
Рет қаралды 37 МЛН