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

Storybook: Restore ability to boot stories only from packages/components #76794

Merged
merged 3 commits into from
May 13, 2023

Conversation

jsnmoon
Copy link
Contributor

@jsnmoon jsnmoon commented May 10, 2023

Related to #76007.

Proposed Changes

  • Updates repository storybook configuration to include JS & JSX stories from the components package.
  • Updates story titles for JS/JSX stories from the components package.
  • Restores standalone storybook functionality for @automattic/components.

My reason for restoring the components package's storybook functionality is simple: It boots much more quickly than the repository-wide storybook. @Automattic/red frequently works on components within @automattic/components and would benefit from this quicker boot time. See these two screenshots:

Repository-wide Components Package
SCR-20230510-m1w SCR-20230510-m23
215s to boot 15.7s to boot

Testing Instructions

Repository-wide Storybook

  • Boot the repo-wide storybook via yarn storybook:start.
  • Ensure that all stories, including previously excluded ones like the "Component swapper", work as expected.

Components Package Storybook

  • Boot the components package storybook via yarn workspace @automattic/components run start-storybook
  • Ensure that all stories for the components package work as expected.

Pre-merge Checklist

  • Has the general commit checklist been followed? (PCYsg-hS-p2)
  • Have you written new tests for your changes?
  • Have you tested the feature in Simple (P9HQHe-k8-p2), Atomic (P9HQHe-jW-p2), and self-hosted Jetpack sites (PCYsg-g6b-p2)?
  • Have you checked for TypeScript, React or other console errors?
  • Have you used memoizing on expensive computations? More info in Memoizing with create-selector and Using memoizing selectors and Our Approach to Data
  • Have we added the "[Status] String Freeze" label as soon as any new strings were ready for translation (p4TIVU-5Jq-p2)?
  • For changes affecting Jetpack: Have we added the "[Status] Needs Privacy Updates" label if this pull request changes what data or activity we track or use (p4TIVU-ajp-p2)?

@jsnmoon jsnmoon added [Status] Needs Review The PR is ready for review. This also triggers e2e canary tests and wp-desktop tests automatically. Components labels May 10, 2023
@jsnmoon jsnmoon requested review from okmttdhr and a team May 10, 2023 23:16
@jsnmoon jsnmoon self-assigned this May 10, 2023
@matticbot
Copy link
Contributor

This PR does not affect the size of JS and CSS bundles shipped to the user's browser.

Generated by performance advisor bot at iscalypsofastyet.com.

Copy link
Member

@okmttdhr okmttdhr left a comment

Choose a reason for hiding this comment

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

Makes sense and looks good to me! Thank you 👍

https://github.com/orgs/Automattic/teams/red frequently works on components within @automattic/components and would benefit from this quicker boot time

I had mentioned in the description of #75676 about the start-up time.
This could be better with the incremental build. https://storybook.js.org/blog/storybook-on-demand-architecture/ CC: @Automattic/team-calypso

Copy link
Member

@tyxla tyxla left a comment

Choose a reason for hiding this comment

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

Nice, thank you @jsnmoon 🙌

@jsnmoon jsnmoon merged commit 7323a4e into trunk May 13, 2023
@jsnmoon jsnmoon deleted the restore/components-storybook branch May 13, 2023 00:45
@github-actions github-actions bot removed the [Status] Needs Review The PR is ready for review. This also triggers e2e canary tests and wp-desktop tests automatically. label May 13, 2023
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.

4 participants