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.

Sign up for GitHub

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

Update test-project codemods for stories #9172

Merged
merged 2 commits into from
Sep 14, 2023
Merged

Update test-project codemods for stories #9172

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
86ecbcf
Update test-project codemods for stories
Tobbe Sep 14, 2023
3385f32
Update test project
Tobbe Sep 14, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions __fixtures__/test-project/web/src/components/Author/Author.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
// Pass props to your component by passing an `args` object to your story
//
// ```jsx
// ```tsx
// export const Primary: Story = {
// args: {
// propName: propValue
Expand Down Expand Up @@ -30,5 +30,5 @@ const author = {
export const Primary: Story = {
render: () => {
return <Author author={author} />
}
},
}
2 changes: 1 addition & 1 deletion __fixtures__/test-project/web/src/components/BlogPost/BlogPost.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
// Pass props to your component by passing an `args` object to your story
//
// ```jsx
// ```tsx
// export const Primary: Story = {
// args: {
// propName: propValue
Expand Down
2 changes: 1 addition & 1 deletion __fixtures__/test-project/web/src/pages/BlogPostPage/BlogPostPage.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,5 +13,5 @@ type Story = StoryObj<typeof BlogPostPage>
export const Primary: Story = {
render: (args) => {
return <BlogPostPage id={42} {...args} />
}
},
}
4 changes: 3 additions & 1 deletion __fixtures__/test-project/web/src/pages/WaterfallPage/WaterfallPage.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,5 +11,7 @@ export default meta
type Story = StoryObj<typeof WaterfallPage>

export const Primary: Story = {
render: (args) => <WaterfallPage id={42} {...args} />,
render: (args) => {
return <WaterfallPage id={42} {...args} />
},
}
2 changes: 1 addition & 1 deletion packages/cli/src/commands/generate/component/templates/stories.tsx.template
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
// Pass props to your component by passing an `args` object to your story
//
// ```jsx
// ```tsx
// export const Primary: Story = {
// args: {
// propName: propValue
Expand Down
92 changes: 76 additions & 16 deletions tasks/test-project/codemods/updateAuthorStories.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,26 @@ export default (file, api) => {
const j = api.jscodeshift
const root = j(file.source)

// Find `export const Primary: Story = {}`
const exportStatement = root.find(j.ExportNamedDeclaration, {
declaration: {
type: 'VariableDeclaration',
declarations: [
{
type: 'VariableDeclarator',
id: {
type: 'Identifier',
name: 'Primary',
},
init: {
type: 'ObjectExpression',
properties: [],
},
},
],
},
})

// const author = {
// email: '[email protected]',
// fullName: 'Story User',
Expand All @@ -10,28 +30,68 @@ export default (file, api) => {
j.variableDeclarator(
j.identifier('author'),
j.objectExpression([
j.property('init', j.identifier('email'), j.literal('[email protected]')),
j.property(
'init',
j.identifier('email'),
j.literal('[email protected]')
),
j.property('init', j.identifier('fullName'), j.literal('Story User')),
])
)
),
])

root.find(j.ExportNamedDeclaration).insertBefore(authorDeclaration)
// export const Primary: Story = {
// render: () => {
// return <Author author={author} />
// }
// }
const primaryIdentifier = j.identifier('Primary')
primaryIdentifier.typeAnnotation = j.tsTypeAnnotation(
j.tsTypeReference(j.identifier('Story'), null)
)

// Change `<Author />` to `<Author author={author} />`
root
.find(j.JSXOpeningElement, { name: { name: 'Author' } } )
.replaceWith((nodePath) => {
const { node } = nodePath
node.attributes.push(
j.jsxAttribute(
j.jsxIdentifier('author'),
j.jsxExpressionContainer(j.identifier('author'))
)
)
const primaryWithRender = j.exportNamedDeclaration(
j.variableDeclaration('const', [
j.variableDeclarator(
primaryIdentifier,
j.objectExpression([
j.property(
'init',
j.identifier('render'),
j.arrowFunctionExpression(
[],
j.blockStatement([
j.returnStatement(
j.jsxElement(
j.jsxOpeningElement(
j.jsxIdentifier('Author'),
[
j.jsxAttribute(
j.jsxIdentifier('author'),
j.jsxExpressionContainer(j.identifier('author'))
),
],
true
),
null,
[],
true
)
),
])
)
),
])
),
])
)

return node
})
if (exportStatement.length > 0) {
exportStatement.insertBefore(authorDeclaration)
exportStatement.replaceWith(primaryWithRender)
} else {
throw new Error('Could not find export statement in author story')
}

return root.toSource()
}
83 changes: 83 additions & 0 deletions tasks/test-project/codemods/updateBlogPostPageStories.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
export default (file, api) => {
const j = api.jscodeshift
const root = j(file.source)

// Find `export const Primary: Story = {}`
const exportStatement = root.find(j.ExportNamedDeclaration, {
declaration: {
type: 'VariableDeclaration',
declarations: [
{
type: 'VariableDeclarator',
id: {
type: 'Identifier',
name: 'Primary',
},
init: {
type: 'ObjectExpression',
properties: [],
},
},
],
},
})

// Create the `Primary` identifier
const primaryIdentifier = j.identifier('Primary')
// Add the `Story` type annotation
primaryIdentifier.typeAnnotation = j.tsTypeAnnotation(
j.tsTypeReference(j.identifier('Story'), null)
)

// export const Primary: Story = {
// render: (args) => {
// return <BlogPostPage id={42} {...args} />
// }
// }
const primaryWithRender = j.exportNamedDeclaration(
j.variableDeclaration('const', [
j.variableDeclarator(
primaryIdentifier,
j.objectExpression([
j.property(
'init',
j.identifier('render'),
j.arrowFunctionExpression(
[j.identifier('args')],
j.blockStatement([
j.returnStatement(
j.jsxElement(
j.jsxOpeningElement(
j.jsxIdentifier('BlogPostPage'),
[
j.jsxAttribute(
j.jsxIdentifier('id'),
j.jsxExpressionContainer(j.numericLiteral(42))
),
j.jsxSpreadAttribute(j.identifier('args')),
],
true
),
null,
[],
true
)
),
])
)
),
])
),
])
)

if (exportStatement.length > 0) {
// Replace the empty object export with the object with the `render`
// property
exportStatement.replaceWith(primaryWithRender)
} else {
throw new Error('Could not find export statement in author story')
}

return root.toSource()
}
83 changes: 83 additions & 0 deletions tasks/test-project/codemods/updateWaterfallPageStories.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
export default (file, api) => {
const j = api.jscodeshift
const root = j(file.source)

// Find `export const Primary: Story = {}`
const exportStatement = root.find(j.ExportNamedDeclaration, {
declaration: {
type: 'VariableDeclaration',
declarations: [
{
type: 'VariableDeclarator',
id: {
type: 'Identifier',
name: 'Primary',
},
init: {
type: 'ObjectExpression',
properties: [],
},
},
],
},
})

// Create the `Primary` identifier
const primaryIdentifier = j.identifier('Primary')
// Add the `Story` type annotation
primaryIdentifier.typeAnnotation = j.tsTypeAnnotation(
j.tsTypeReference(j.identifier('Story'), null)
)

// export const Primary: Story = {
// render: (args) => {
// return <WaterfallPage id={42} {...args} />
// }
// }
const primaryWithRender = j.exportNamedDeclaration(
j.variableDeclaration('const', [
j.variableDeclarator(
primaryIdentifier,
j.objectExpression([
j.property(
'init',
j.identifier('render'),
j.arrowFunctionExpression(
[j.identifier('args')],
j.blockStatement([
j.returnStatement(
j.jsxElement(
j.jsxOpeningElement(
j.jsxIdentifier('WaterfallPage'),
[
j.jsxAttribute(
j.jsxIdentifier('id'),
j.jsxExpressionContainer(j.numericLiteral(42))
),
j.jsxSpreadAttribute(j.identifier('args')),
],
true
),
null,
[],
true
)
),
])
)
),
])
),
])
)

if (exportStatement.length > 0) {
// Replace the empty object export with the object with the `render`
// property
exportStatement.replaceWith(primaryWithRender)
} else {
throw new Error('Could not find export statement in author story')
}

return root.toSource()
}
2 changes: 1 addition & 1 deletion tasks/test-project/rebuild-test-project-fixture.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -441,7 +441,7 @@ async function runCommand() {
if (
e instanceof ExecaError &&
!e.stderr &&
e.stdout.includes('15 problems (15 errors, 0 warnings)')
e.stdout.includes('14 problems (14 errors, 0 warnings)')
) {
// This is unfortunate, but linting is expected to fail.
// This is the expected error message, so we just fall through
Expand Down
12 changes: 11 additions & 1 deletion tasks/test-project/tui-tasks.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -122,10 +122,15 @@ async function webTasks(outputPath, { linkWithLatestFwBuild }) {
task: async () => {
await createPage('blogPost /blog-post/{id:Int}')

return applyCodemod(
await applyCodemod(
'blogPostPage.js',
fullPath('web/src/pages/BlogPostPage/BlogPostPage')
)

return applyCodemod(
'updateBlogPostPageStories.js',
fullPath('web/src/pages/BlogPostPage/BlogPostPage.stories')
)
},
},
{
Expand Down Expand Up @@ -192,6 +197,11 @@ async function webTasks(outputPath, { linkWithLatestFwBuild }) {
'waterfallPage.js',
fullPath('web/src/pages/WaterfallPage/WaterfallPage')
)

await applyCodemod(
'updateWaterfallPageStories.js',
fullPath('web/src/pages/WaterfallPage/WaterfallPage.stories')
)
},
},
]
Expand Down