Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

CSF Stories with MDX Docs does not take decorators from csf stories #9584

Closed
aizerin opened this issue Jan 21, 2020 · 4 comments
Closed

CSF Stories with MDX Docs does not take decorators from csf stories #9584

aizerin opened this issue Jan 21, 2020 · 4 comments

Comments

@aizerin
Copy link

aizerin commented Jan 21, 2020

Describe the bug
When defining decorators in CSF stories then they are not applied in MDX. Which is wrong according to

https://github.com/storybookjs/storybook/blob/next/addons/docs/docs/recipes.md#csf-stories-with-mdx-docs

To Reproduce
Steps to reproduce the behaviour:

  1. Create story by recipe mentioned above and add decorator
  2. tart storybook
  3. See the docs tabs

Expected behaviour
Decorator will be applied when using story in MDX.

Screenshots
image

Code snippets

import React from "react";
import { Button } from "@storybook/react/demo";

export default {
  title: "a/mix",
  includeStories: []
};

export const basic = () => <Button>Hello Button</Button>;

basic.story = {
  decorators: [storyFn => <div>I'm decorated {storyFn()}</div>]
};
import { Meta, Story, Preview } from "@storybook/addon-docs/blocks";
import * as stories from "./mix.stories.js";

<Meta title="a/mix" />

# Button

<Preview>
  <Story name="basic">{stories.basic()}</Story>
</Preview>

System:

  System:
    OS: macOS 10.15.2
    CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
  Binaries:
    Node: 12.13.1 - ~/.nvm/versions/node/v12.13.1/bin/node
    Yarn: 1.21.1 - /usr/local/bin/yarn
    npm: 6.12.1 - ~/.nvm/versions/node/v12.13.1/bin/npm
  Browsers:
    Chrome: 79.0.3945.130
    Firefox: 70.0.1
    Safari: 13.0.4
  npmPackages:
    @storybook/addon-actions: ^5.3.7 => 5.3.7
    @storybook/addon-docs: ^5.3.7 => 5.3.7
    @storybook/addon-links: ^5.3.7 => 5.3.7
    @storybook/addons: ^5.3.7 => 5.3.7
    @storybook/react: ^5.3.7 => 5.3.7
@shilman
Copy link
Member

shilman commented Jan 21, 2020

Yeah, you'll need to add those decorators yourself in MDX.

@aizerin
Copy link
Author

aizerin commented Jan 21, 2020

Ok, so this sentence from docs is no longer valid? I can update it.

The MDX loader is using story metadata from CSF, such as name, decorators, parameters, but will give giving preference to anything defined in the MDX file.

@shilman
Copy link
Member

shilman commented Jan 21, 2020

Ouch. That section is wrong. 🙈 I'll update it now, can you review the PR for me?

@aizerin
Copy link
Author

aizerin commented Jan 21, 2020

Sure

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants