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

Server: Fix string escaping in CSF compiler #14615

Merged
merged 2 commits into from Apr 16, 2021

Conversation

jonspalmer
Copy link
Contributor

@jonspalmer jonspalmer commented Apr 15, 2021

Consumers of Storybook Server declaring stories with single quotes in the names or control args result in syntax errors in the generated CSF stories. For example: jonspalmer/view_component-storybook#31

What I did

Changed the CSF compiler to output double quote strings vs single quote strings.

Discussion

While perhaps we'd like to generate a more "pure" version of the CSF and only use double quotes when necessary in practice this is super hard to organize.
Also the source of Server stories is JSON, which uses double quotes, it's very natural to just use the same encoding.

How to test

Curious as to others thoughts here.

We have snapshot tests and they might be good enough.
I wonder if we could/should evaluate the generated CSF and at least prove it's valid javascript?

@@ -5,7 +5,7 @@ const { identifier } = require('safe-identifier');

export function stringifyObject(object: any, level = 0, excludeOuterParams = false): string {
if (typeof object === 'string') {
return `'${object}'`;
return `"${object}"`;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Won't this version have the same problem as the original but in the case of double quotes? I suggest you use JSON.stringify (or something similar) that handles string escaping for you. WDYT?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great suggestion. Updated to do that.

app/server/src/lib/compiler/stringifier.ts Outdated Show resolved Hide resolved
@jonspalmer
Copy link
Contributor Author

@shilman Thoughts on the right tests here? I could add examples with single and double quotes into the snapshot tests.

@shilman
Copy link
Member

shilman commented Apr 15, 2021

Works for me. If you've seen our test coverage you'll know this isn't our strong suit 😭

Copy link
Member

@shilman shilman left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!!!

@jonspalmer
Copy link
Contributor Author

Release vehicle for this one? 6.2.9?

@shilman shilman added the patch:yes Bugfix & documentation PR that need to be picked to main branch label Apr 16, 2021
@shilman
Copy link
Member

shilman commented Apr 16, 2021

@jonspalmer sure. i'll release in an alpha then patch it back to 6.2.9

@shilman shilman changed the title App:Server CSF compiler generates double quote vs single quote strings Server: Fix string escaping in CSF compiler Apr 16, 2021
@shilman shilman merged commit 742f102 into storybookjs:next Apr 16, 2021
@shilman shilman added the patch:done Patch/release PRs already cherry-picked to main/release branch label Apr 23, 2021
shilman added a commit that referenced this pull request Apr 23, 2021
Server:  Fix string escaping in CSF compiler
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug patch:done Patch/release PRs already cherry-picked to main/release branch patch:yes Bugfix & documentation PR that need to be picked to main branch server
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants