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

Addons: Scaffold Addon Vitest #28810

Merged
merged 37 commits into from
Aug 7, 2024

Conversation

yannbf
Copy link
Member

@yannbf yannbf commented Aug 5, 2024

Closes #

What I did

This PR bases on the work from #28749 and does the following:

  • Introduce the base for the Vitest addon
  • Set up the Vitest addon in sandboxes
  • Set up the Vitest plugin in the monorepo UI Storybook, but only for minimal stories for now. It will be part of unit tests CI checks

The work in #28749 will be revisited later once we introduce UI coming from the addon. Fow now we are focusin on the CLI aspect of it.

Checklist for Contributors

Testing

The changes in this PR are covered in the following automated tests:

  • stories
  • unit tests
  • integration tests
  • end-to-end tests

Manual testing

This section is mandatory for all contributions. If you believe no manual test is necessary, please state so explicitly. Thanks!

Documentation

  • Add or update documentation reflecting your changes
  • If you are deprecating/removing a feature, make sure to update
    MIGRATION.MD

Checklist for Maintainers

  • When this PR is ready for testing, make sure to add ci:normal, ci:merged or ci:daily GH label to it to run a specific set of sandboxes. The particular set of sandboxes can be found in code/lib/cli/src/sandbox-templates.ts

  • Make sure this PR contains one of the labels below:

    Available labels
    • bug: Internal changes that fixes incorrect behavior.
    • maintenance: User-facing maintenance tasks.
    • dependencies: Upgrading (sometimes downgrading) dependencies.
    • build: Internal-facing build tooling & test updates. Will not show up in release changelog.
    • cleanup: Minor cleanup style change. Will not show up in release changelog.
    • documentation: Documentation only changes. Will not show up in release changelog.
    • feature request: Introducing a new feature.
    • BREAKING CHANGE: Changes that break compatibility in some way with current major version.
    • other: Changes that don't fit in the above categories.

🦋 Canary release

This PR does not have a canary release associated. You can request a canary release of this pull request by mentioning the @storybookjs/core team here.

core team members can create a canary release here or locally with gh workflow run --repo storybookjs/storybook canary-release-pr.yml --field pr=<PR_NUMBER>

name before after diff z %
createSize 0 B 0 B 0 B - -
generateSize 76.3 MB 76.3 MB 0 B -0.02 0%
initSize 171 MB 171 MB 18.9 kB -1.41 0%
diffSize 94.6 MB 94.6 MB 18.9 kB -1.41 0%
buildSize 7.43 MB 7.43 MB 51 B -1.41 0%
buildSbAddonsSize 1.61 MB 1.61 MB 0 B -1.37 0%
buildSbCommonSize 195 kB 195 kB 0 B - 0%
buildSbManagerSize 2.3 MB 2.3 MB 51 B -1.17 0%
buildSbPreviewSize 350 kB 350 kB 0 B 0.66 0%
buildStaticSize 0 B 0 B 0 B - -
buildPrebuildSize 4.46 MB 4.46 MB 51 B -1.32 0%
buildPreviewSize 2.97 MB 2.97 MB 0 B -1.41 0%
testBuildSize 0 B 0 B 0 B - -
testBuildSbAddonsSize 0 B 0 B 0 B - -
testBuildSbCommonSize 0 B 0 B 0 B - -
testBuildSbManagerSize 0 B 0 B 0 B - -
testBuildSbPreviewSize 0 B 0 B 0 B - -
testBuildStaticSize 0 B 0 B 0 B - -
testBuildPrebuildSize 0 B 0 B 0 B - -
testBuildPreviewSize 0 B 0 B 0 B - -
name before after diff z %
createTime 22.9s 23.4s 516ms 1.65 2.2%
generateTime 21.6s 21.8s 219ms -0.6 1%
initTime 21.6s 19.3s -2s -325ms -1.21 -12%
buildTime 12.4s 14.3s 1.9s 0.49 13.5%
testBuildTime 0ms 0ms 0ms - -
devPreviewResponsive 9.1s 8.3s -784ms -0.48 -9.4%
devManagerResponsive 5.3s 4.8s -438ms -1.41 🔰-9%
devManagerHeaderVisible 758ms 824ms 66ms -0.14 8%
devManagerIndexVisible 762ms 854ms 92ms -0.14 10.8%
devStoryVisibleUncached 1.1s 1.1s -63ms -1.59 🔰-5.7%
devStoryVisible 804ms 878ms 74ms -0.17 8.4%
devAutodocsVisible 1s 771ms -236ms -0.27 -30.6%
devMDXVisible 672ms 778ms 106ms -0.14 13.6%
buildManagerHeaderVisible 828ms 772ms -56ms -0.29 -7.3%
buildManagerIndexVisible 829ms 811ms -18ms 0.08 -2.2%
buildStoryVisible 875ms 822ms -53ms -0.29 -6.4%
buildAutodocsVisible 755ms 646ms -109ms -0.98 -16.9%
buildMDXVisible 826ms 679ms -147ms -0.69 -21.6%

Greptile Summary

Introduced a new Vitest addon for Storybook, integrating Vitest test results with Storybook stories.

  • Added code/.storybook/main.ts to include the Vitest addon.
  • Created code/.storybook/storybook.setup.ts for Vitest setup.
  • Added code/addons/vitest/src/plugin/index.ts to configure the Vitest plugin.
  • Updated code/core/src/manager-api/modules/stories.ts to enhance experimental_updateStatus.
  • Modified code/package.json to include @storybook/experimental-addon-vitest and @vitest/browser dependencies.

Copy link
Contributor

@greptile-apps greptile-apps bot left a comment

Choose a reason for hiding this comment

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

29 file(s) reviewed, 5 comment(s)
Edit PR Review Bot Settings

) => {
return async ({ task, skip }: TaskContext) => {
const Story = (await getStories(modulePath, composeStoriesFn))[exportName];
if (Story === undefined || shouldSkip(Story.tags, tagsFilter)) {
Copy link
Contributor

Choose a reason for hiding this comment

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

logic: Potential issue if Story.tags is undefined. Consider adding a check.

};
_task.meta.storyId = Story.id;
_task.meta.hasPlayFunction = !!Story.play;
await setViewport(Story.parameters.viewport);
Copy link
Contributor

Choose a reason for hiding this comment

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

logic: Potential issue if Story.parameters.viewport is undefined. Consider adding a check.

code/addons/vitest/src/plugin/test-utils.ts Show resolved Hide resolved

let page: BrowserPage;
try {
const importPath = '/@id/__x00__@vitest/browser/context';
Copy link
Contributor

Choose a reason for hiding this comment

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

style: Consider handling the case where importPath fails more gracefully.

code/addons/vitest/src/plugin/viewports.ts Show resolved Hide resolved
Copy link

nx-cloud bot commented Aug 5, 2024

☁️ Nx Cloud Report

CI is running/has finished running commands for commit 12e0350. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this CI Pipeline Execution


✅ Successfully ran 1 target

Sent with 💌 from NxCloud.

@yannbf yannbf force-pushed the yann/addon-vitest-barebones-with-plugin branch from ee720ec to 52aa6fd Compare August 6, 2024 08:18
"exports": {
".": {
"types": "./dist/index.d.ts",
"node": "./dist/index.cjs",
Copy link
Contributor

Choose a reason for hiding this comment

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

Do we need a cjs bundle?

@yannbf yannbf merged commit f4bf860 into vitest-integration Aug 7, 2024
46 of 50 checks passed
@yannbf yannbf deleted the yann/addon-vitest-barebones-with-plugin branch August 7, 2024 08:40
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants