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

Open canvas in new tab url has empty args query param. #17902

Closed
hasanirogersvmlyr opened this issue Apr 6, 2022 · 5 comments
Closed

Open canvas in new tab url has empty args query param. #17902

hasanirogersvmlyr opened this issue Apr 6, 2022 · 5 comments

Comments

@hasanirogersvmlyr
Copy link

Describe the bug
The URL generated in the "open canvas in new tab" button has an empty args query param. This only seems to happen when the user has not used any controls on the original canvas and thus no args has been generated. The empty args query param seems to set the args to some kind of undefined value rather than falling back to default args defined in the story. This makes our stories display incorrectly. The story displays correctly when &args= is removed from the url.

To Reproduce
Unfortunately I'm behind a private corporate repo and I can't share it's reproduction.

System
Environment Info:

System:
OS: macOS 11.6
CPU: (12) x64 Intel(R) Core(TM) i9-8950HK CPU @ 2.90GHz
Binaries:
Node: 14.17.6 - ~/.nvm/versions/node/v14.17.6/bin/node
Yarn: 1.15.2 - /usr/local/bin/yarn
npm: 6.14.15 - ~/.nvm/versions/node/v14.17.6/bin/npm
Browsers:
Chrome: 99.0.4844.84
Firefox: 97.0
Safari: 14.1.2
npmPackages:
@storybook/addon-a11y: ^6.4.18 => 6.4.18
@storybook/addon-actions: ^6.4.18 => 6.4.18
@storybook/addon-essentials: ^6.4.18 => 6.4.18
@storybook/addon-links: ^6.4.18 => 6.4.18
@storybook/addon-postcss: ^2.0.0 => 2.0.0
@storybook/components: ^6.4.18 => 6.4.18
@storybook/preset-scss: ^1.0.3 => 1.0.3
@storybook/web-components: ^6.4.18 => 6.4.18

Additional context
I'll share images to try and help explain the issue.

This is the url before clicking the open canvas in new tab button. Notice how it has no args query params. It is using the default args.

canvas

After clicking the open canvas in new tab button, &args= appears in the url. This is causing the args to be misconfigured. Notice the text is gray instead of white.

empty-args

Once &args= is removed from the url, the default args are correctly applied and the text is white like it was in the original canvas url.

args-removed

@ArinzeJeffrey-droid
Copy link

Currently having the same issue 😢 at the moment.

@ArinzeJeffrey-droid
Copy link

ArinzeJeffrey-droid commented Apr 20, 2022

@hasanirogersvmlyr A friend of mine was able to resolve this by adding this to your storybook main.js file

typescript: {
  check: false,
  reactDocgen: "react-docgen",
}

Here's a reference for more info https://gist.github.com/shilman/036313ffa3af52ca986b375d90ea46b0

@hasanirogersvmlyr
Copy link
Author

Thanks for the assist! I tried that code and restarted. Doesn't solve our issue though. Does it matter that we're using Storybook for Web Components?

@toli444
Copy link

toli444 commented Apr 22, 2022

Can be connected with these:
#17517
#17413

@shilman
Copy link
Member

shilman commented Jun 8, 2023

We’re cleaning house! Storybook has changed a lot since this issue was created and we don’t know if it’s still valid. Please open a new issue referencing this one if:

@shilman shilman closed this as completed Jun 8, 2023
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

4 participants