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

[addon-docs] breaks if components feature dynamic title #7932

Closed
thebuilder opened this issue Aug 30, 2019 · 5 comments
Closed

[addon-docs] breaks if components feature dynamic title #7932

thebuilder opened this issue Aug 30, 2019 · 5 comments

Comments

@thebuilder
Copy link
Contributor

Describe the bug
Using addon-docs with CSF components, that feature a dynamic title fails to load, throwing an error instead.

This happens if the title is using a function or a tagged template string.

Stacktrace

Module build failed (from ./node_modules/@storybook/source-loader/dist/server/index.js):
TypeError: Cannot read property 'toLowerCase' of undefined
  at sanitize (./node_modules/@storybook/router/dist/utils.js:64:17)
  at sanitizeSafe (./node_modules/@storybook/router/dist/utils.js:72:19)
  at toId (./node_modules/@storybook/router/dist/utils.js:82:20)
  at handleExportedName (./node_modules/@storybook/source-loader/dist/server/abstract-syntax-tree/parse-helpers.js:87:6)
  at Controller.enter (./node_modules/@storybook/source-loader/dist/server/abstract-syntax-tree/traverse-helpers.js:109:60)
  at Controller.__execute (./node_modules/estraverse/estraverse.js:330:31)
  at Controller.traverse (./node_modules/estraverse/estraverse.js:434:28)
  at Object.traverse (./node_modules/estraverse/estraverse.js:646:27)
  at findExportsMap (./node_modules/@storybook/source-loader/dist/server/abstract-syntax-tree/traverse-helpers.js:101:14)
  at generateStoriesLocationsMap (./node_modules/@storybook/source-loader/dist/server/abstract-syntax-tree/generate-helpers.js:138:63)
  at inject (./node_modules/@storybook/source-loader/dist/server/abstract-syntax-tree/inject-decorator.js:74:56)
  at readAsObject (./node_modules/@storybook/source-loader/dist/server/dependencies-lookup/readAsObject.js:45:47)
  at readStory (./node_modules/@storybook/source-loader/dist/server/dependencies-lookup/readAsObject.js:100:10)
  at Object.transform (./node_modules/@storybook/source-loader/dist/server/build.js:15:38)

Expected behavior
Docs should be able to load files with dynamic title

Code snippets

import * as React from 'react'
import base from 'paths.macro'

export default {
  title: `Modules|${base}`
}

export const example = () => <div />

or

import * as React from 'react'
import base from 'paths.macro'

export default {
  title: `${base}` // Template strings causes the same issue
}

export const example = () => <div />

System:

Environment Info:

  System:
    OS: macOS 10.14.6
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
  Binaries:
    Node: 12.9.1 - ~/.config/nvm/12.9.1/bin/node
    Yarn: 1.17.3 - /usr/local/bin/yarn
    npm: 6.10.2 - ~/.config/nvm/12.9.1/bin/npm
  Browsers:
    Chrome: 76.0.3809.132
    Firefox: 68.0.2
    Safari: 12.1.2
  npmPackages:
    @storybook/addon-a11y: ^5.2.0-rc.0 => 5.2.0-rc.0 
    @storybook/addon-actions: ^5.2.0-rc.0 => 5.2.0-rc.0 
    @storybook/addon-docs: ^5.2.0-rc.0 => 5.2.0-rc.0 
    @storybook/addon-links: ^5.2.0-rc.0 => 5.2.0-rc.0 
    @storybook/addon-viewport: ^5.2.0-rc.0 => 5.2.0-rc.0 
    @storybook/addons: ^5.2.0-rc.0 => 5.2.0-rc.0 
    @storybook/react: ^5.2.0-rc.0 => 5.2.0-rc.0 
    @storybook/source-loader: ^5.2.0-rc.0 => 5.2.0-rc.0 
    @storybook/theming: ^5.2.0-rc.0 => 5.2.0-rc.0 

Additional context
This is based on the documented approach to generating path names use babel macros:
https://github.com/storybookjs/storybook/blob/next/docs/src/pages/basics/writing-stories/index.md#generating-nesting-path-based-on-__dirname

@shilman shilman added this to the 5.2.0 milestone Aug 30, 2019
@thebuilder
Copy link
Contributor Author

Is it possible for the source-loader to lazy evaluate the title?

@shilman shilman modified the milestones: 5.2.0, 5.2.x Sep 23, 2019
@stale
Copy link

stale bot commented Oct 14, 2019

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!

@stale
Copy link

stale bot commented Nov 4, 2019

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!

@stale stale bot added the inactive label Nov 4, 2019
@shilman shilman modified the milestones: 5.2.x, 5.4.0 Nov 7, 2019
@stale stale bot removed the inactive label Nov 7, 2019
@stale
Copy link

stale bot commented Nov 28, 2019

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!

@shilman
Copy link
Member

shilman commented Dec 2, 2019

Yippee!! I just released https://github.com/storybookjs/storybook/releases/tag/v5.3.0-beta.14 containing PR #8995 that references this issue. Upgrade today to try it out!

You can find this prerelease on the @next NPM tag.

Closing this issue. Please re-open if you think there's still more to do.

@shilman shilman closed this as completed Dec 2, 2019
@shilman shilman modified the milestones: 5.4.0, 5.3.0 Dec 2, 2019
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

3 participants