Skip to content

[knobs] Knobs don't appear on refresh when a decorator includes a suspense boundary #10

Open
Open
[knobs] Knobs don't appear on refresh when a decorator includes a suspense boundary#10

Description

@andyrichardson
andyrichardson
opened on Nov 16, 2020

Describe the bug

When hittin

Note: May also apply to stories with suspense boundaries. Not tested.

To Reproduce

Consider the following application code

const Child = lazy(() => import("./Child"));

export const SomeComponent = ({ children }) => {
  return (
    <Suspense fallback={null}>
      <Child>
        {children}
      </Child>
    </Suspense>
  )
};

Consider the following decorator

const lazyDecorator = (Story, context) => {
  const someknob = Select("Something", ["A", "B"], "A");

  return (
    <SomeComponent>
      <Story {...context} />
    </SomeComponent>
  )
};

addDecorator(lazyDecorator);

Expected behavior

A decorator with a suspense boundary has no impact on how knobs work.

Screenshots

Kapture 2020-11-16 at 13 18 08

System

6.1.0-rc.3

Activity

  1. shilman commented on Nov 16, 2020

    @shilman
    shilman
    on Nov 16, 2020
    Contributor

    FYI, we’ve released addon-controls in Storybook 6.0. Controls are portable, auto-generated knobs that are intended to replace addon-knobs long term.

    Please upgrade and try them out today!

  2. andyrichardson commented on Nov 16, 2020

    @andyrichardson
    andyrichardson
    on Nov 16, 2020
    Author

    Hey @shilman, thanks for the suggestion!

    Unfortunately controls can't be used because they can't be declared by decorators (#12836, storybookjs/storybook#11984)

  3. stale commented on Dec 25, 2020

    @stale
    stalebot
    on Dec 25, 2020

    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!

  4. shilman commented on Mar 2, 2021

    @shilman
    shilman
    on Mar 2, 2021
    Contributor

    @andyrichardson sorry for the slow reply. what's the use case for adding controls via decorator?

  5. andyrichardson commented on Mar 2, 2021

    @andyrichardson
    andyrichardson
    on Mar 2, 2021
    Author

    what's the use case for adding controls via decorator?

    @shilman no worries!

    Any application-wide context (e.g. language, region)

  6. shilman commented on Mar 2, 2021

    @shilman
    shilman
    on Mar 2, 2021
    Contributor

    Have you looked at toolbars/globals for that?

    https://storybook.js.org/docs/react/essentials/toolbars-and-globals

    It's the controls/args analog for global variables. We'll probably be building more on top of that in the future (e.g. a way to show global controls side by side with story controls in the addon panel instead of only on the toolbar). But data-wise, it's the recommended way forward for this kind of stuff. And if it doesn't quite fit your use case, I'd love to discuss why and figure out how to make it work.

  7. shilman
    transferred this issue fromstorybookjs/storybookon May 10, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions