Storybook: Changing the typescript props does not trigger updates

Created on 13 Aug 2020  路  10Comments  路  Source: storybookjs/storybook

When editing the typescript props of a component, the changes does not get applied until I edit something else in the file that is not related to typescript.

// button.tsx
// ==========

// changing this does not update the props table
export interface Props {
  label?: string 
}

// changing this updates the component
function Button({ label }: Props) {
  return <button>{label}</button> // changing this updates the component
}

export default Button
// button.stories.tsx
// ==================

import { Story, Meta } from '@storybook/react'
import React from 'react'

import Button, { Props } from './button'

export default {
  title: 'Button',
  component: Button,
} as Meta

export const Template: Story<Props> = args => <Button {...args} />

Template.args = {
  label: 'Button',
}
react question / support typescript

Most helpful comment

Booked for friday!

All 10 comments

@hipstersmoothie @gaetanmaisse @ndelangen any ideas about this one?

Things i've found so far.

  1. In a CRA + typescript setup the typescript docgen plugin is loaded twice. Since the framework-preset-react-docgen preset is loaded anyway it seems like we don't need the code in the CRA preset
  2. The docgen plugin seems to be generating the right docs but storybook isn't updating with the changes

Here I changed the size prop to include the string literal 2222.

Screen Shot 2020-08-13 at 9 26 36 AM

But storybook doesn't update with that.

If there is someone with more knowledge about what webpack is doing here I would be happy to pair to find the issue. The webpack plugin is pretty simple.

It taps into webpack's seal hook and appends the docgen info to the end of the module. You can find the relevant file in node_modules/react-docgen-typescript-plugin/dist/plugin.js

@ndelangen is our resident webpack expert 馃槈

@hipstersmoothie would be happy to pair program on this some time, if you'd be too, let's schedule something!

https://calendly.com/ndelangen/storybook

Booked for friday!

I have the same issue. If I edit the component itself I see the new docgen changes popup.
So please if you find anything, update this ticket 馃憤

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

Hey there, it's me again! I am going close this issue to help our maintainers focus on the current development roadmap instead. If the issue mentioned is still a concern, please open a new ticket and mention this old one. Cheers and thanks for using Storybook!

I believe this is still an issue?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

sakulstra picture sakulstra  路  3Comments

arunoda picture arunoda  路  3Comments

miljan-aleksic picture miljan-aleksic  路  3Comments

shilman picture shilman  路  3Comments

Jonovono picture Jonovono  路  3Comments