Add storybook story for Disabled component #20514
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
brentswisher
added
[Package] Components
brentswisher
requested review from
ajitbohra,
chrisvanpatten,
jorgefilipecosta and
youknowriad
as code owners
8 tasks
|
Size Change: 0 B Total Size: 856 kB ℹ️ View Unchanged
|
|
As discussed on Slack yesterday, we will need to upgrade Jest to use the latest version of JSDom which supports |
|
I updated jest, jsdom and storybook to the most recent versions locally and am still getting this error without the setup/teardown methods: `● Storyshots › Components/Disabled › Default The js configuration for Gutenberg is a bit more complex than I am used to working with, so it's possible I am not updating what I think I am or in the correct place. |
|
I opened #20766 which tries to upgrade Jest and JSDom to the more recent versions. |
6 tasks
gziolo
reviewed
Mar 12, 2020
|
|
||
| export const _default = () => { | ||
| return ( | ||
| <Disabled> |
There was a problem hiding this comment.
Do we need all those components to include in here? Can we use the most representative 3? I don't have answers, I'm thinking whether it's enough to cover those that use input, select and textarea.
There was a problem hiding this comment.
I questioned that too, and nearly added just a single input. I would be fine with making it just the top three, maybe @ItsJonQ might have an opinion?
There was a problem hiding this comment.
Hai! 👋
I think max 3 would be okay. Let's go with that 👍
brentswisher
force-pushed
the
add/disabled-component-story
branch
from
76c27f1
to
52571a4
Compare
…onObserver, which the Disabled component needs
brentswisher
force-pushed
the
add/disabled-component-story
branch
from
52571a4
to
0e8b251
Compare
ItsJonQ
approved these changes
Mar 18, 2020
|
Will merge once Travis is 💚 ! |
ciampo
added a commit
that referenced
this pull request
Aug 23, 2022
* refactor storybook * convert to typescript * fix ComponentProps * add changelog. * fix imports order * use WordPressComponentProps. * add example * Update packages/components/src/disabled/types.ts Co-authored-by: Marco Ciampini <[email protected]> * Update packages/components/src/disabled/index.tsx Co-authored-by: Marco Ciampini <[email protected]> * Update packages/components/src/disabled/index.tsx Co-authored-by: Petter Walbø Johnsgård <[email protected]> * Update packages/components/src/disabled/index.tsx Co-authored-by: Petter Walbø Johnsgård <[email protected]> * Remove unused imports. * Rewrite to Testing-library `will disable all fields` * Rewrite to Testing-library `should cleanly un-disable via reconciliation` * use rerender * refactor test. * replace react-dom/test-utils to testing-library. * remove unnecessary MutationObserver stab. @see #20766 #20514 * Convert to typescript. * add story for contentEditable * add control settings. * fix changelog * Update packages/components/CHANGELOG.md Co-authored-by: Marco Ciampini <[email protected]> * Omit ref. * avoid querying * rename div. * test before rerender * Simplify * Update packages/components/src/disabled/test/index.tsx Co-authored-by: Marco Ciampini <[email protected]> * test for sneaky DOM manipulation * Fix `isDisabled` so that it keeps its value even if it is changed. * add default args * Revert "Fix `isDisabled` so that it keeps its value even if it is changed." This reverts commit 28820f0. * Update packages/components/src/disabled/test/index.tsx * Update packages/components/CHANGELOG.md Co-authored-by: Marco Ciampini <[email protected]> Co-authored-by: Petter Walbø Johnsgård <[email protected]>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
Adds a storybook story for the Disabled component as part of #17973
I had to make a decision on this story regarding what/how much to put in the component to show as disabled. I included all the "basic" form controls as well as a few of the more complex ones. I don't have a strong feeling on what should be shown, so if anyone has feedback on more/less child components just let me know.
Concerns
I also ran into a few things with the storyshot integration I want to call out:
I am pretty sure this is intentional but didn't see it documented everywhere so I just wanted to double-check.
How has this been tested?
npm run storybook:devScreenshots
Types of changes
New feature (non-breaking change which adds functionality)
Checklist: