Questions tagged [storybook-addon]

58 questions
4
votes
2 answers

Storybook not calling angular component functions on event

I'm using Storybook to display a angular component. The angular component has a function that is called on click. But storybook doesn't call this function. It just logs an event in the actions tab and leaves it at…
4
votes
2 answers

How to get storybook addon options

When we load a storybook addon we can pass some options: // .storybook/main.js module.exports = { addons: [ 'a-storybook-addon-without-options', { name: 'a-storybook-addon-with-options', options: { mainColor:…
tzi
  • 8,719
  • 2
  • 25
  • 45
3
votes
2 answers

How to save localStorage per story in storybook

Is it possible to save something to localStorage/sessionStorage per story and/or per stories file? Is there any addon for this, I can't find any I would expect something like Default.parameters = { sessionStorage: { userId: '123' …
Israel kusayev
  • 833
  • 8
  • 20
3
votes
1 answer

Problem getting global styles includes in storybook with Nx and Angular 12

I am trying to get an Nx 12 workspace running storybook for some angular components I am authoring. I am facing an issue when trying to include global scss files, I keep getting the following error. SassError: SassError: expected "{". ╷ 2 │ …
mindparse
  • 6,115
  • 27
  • 90
  • 191
2
votes
0 answers

Get a HTML report from coverage JSON generated from storybook coverage add on

I am trying to get a HTML coverage report produced with the JSON output from the @storybook/addon-coverage plugin. I am using Angular, and have been following this recipe I have checked as per the guide that I am getting coverage generated as per…
mindparse
  • 6,115
  • 27
  • 90
  • 191
2
votes
0 answers

Storybook JS how to trigger the dark mode "channel" from my Vue component

I've installed the Storybook Js addon, "storybook-dark-mode-vue" (I'm not sure if it makes any difference whether or not I just used the default "storybook-dark-mode" addon) but I'm not sure how to trigger the "channels" from my vue component…
rugbert
  • 11,603
  • 9
  • 39
  • 68
2
votes
0 answers

Storybook: Does not document Angular components (No code available)

I have a Nx, Strorybook with Angular set up. The Storybook docs does not documenting my angular components. This is my webpack configuration: main.js const TerserPlugin = require('terser-webpack-plugin'); module.exports = { stories: [], addons:…
2
votes
0 answers

Switching npm theme in Storybook

I have a brand pulled in via storybook and installed the theme switcher, plugin, https://storybook.js.org/addons/storybook-addon-themes What I am trying to do it update and dynamically set the brand (either main or subBrand) when the brand is…
TommyD
  • 913
  • 3
  • 17
  • 32
1
vote
0 answers

Storybook: how do I add controls for subcomponent?

I building a FE library using Storybook, and I need to know how to use controls for subcomponent. I even read this article without success. As you can see from my screenshow, the DrawerHeader doesn't show the control option, so that I can change its…
spark1713
  • 31
  • 2
1
vote
0 answers

How do I integrate vuetify into storybook in a NUXT 3 application?

I have vuetify ^3.1.6 installed and functional in the app Installed storybook using the command npx -p @storybook/cli sb init --type vue3 My .storybook/preview.js content is as follows import { withVuetify } from…
Fru Boris
  • 11
  • 1
1
vote
1 answer

How do I use { text } in Storybook?

I am trying to use Storybooks `import { text } from '@storybook/addon-knobs', to allow my users to enter there own text in a particular story. I've tried going through the docs, and actually they aren't very helpful. Would someone be able to show me…
Takuhii
  • 819
  • 2
  • 8
  • 26
1
vote
2 answers

Storybook play function doesn't show interactions in the bottom panel

I am using storybook interactions addon and the play functionality. This is my code: export default { component: MyComponent, title: "My Component", args: { someId: "someId", }, decorators: [ (Story) => (
Andi Keikha
  • 1,246
  • 2
  • 16
  • 37
1
vote
0 answers

Storybook v6 with storybook-readme

So I have a app created with create react app with typescript. I have some components in a component folder and they have a file called .readme.md. Now when I run storybook I se the readme part in the sidebar, but it says it can not find the readme…
ComCool
  • 773
  • 4
  • 15
  • 28
1
vote
0 answers

How can I mock `networkError` vs `graphQLErrors` in storybook with apollo?

I'm using Storybook with an Apollo graphql frontend. The component I'm creating stories for treats the graphql networkError differently from graphQLErrors. In the Storybook apollo client add-on documentation there is an example of mocking an…
ACPrice
  • 667
  • 2
  • 10
  • 25
1
vote
0 answers

Disable storybook interactions plugin for specific stories

I'm currently integrating this plugin in our component library: https://storybook.js.org/docs/react/essentials/interactions Is it possible to disable this plugin via parameters or any sort of configuration? I have a few stories for which I intend to…
BorisL91
  • 13
  • 1
  • 3
1
2 3 4