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
CustomSelectControlV2: Match v1 stories to test legacy component #60182
Conversation
@@ -43,45 +44,23 @@ const meta: Meta< typeof CustomSelect > = { | |||
export default meta; | |||
|
|||
const Template: StoryFn< typeof CustomSelect > = ( props ) => { | |||
const [ fontSize, setFontSize ] = useState( props.options[ 0 ] ); | |||
const [ value, setValue ] = useState( props.options[ 0 ] ); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Changing these names to be more generic.
@@ -18,7 +23,7 @@ export default { | |||
}, | |||
}; | |||
|
|||
export const Default = CustomSelectControl.bind( {} ); | |||
export const Default: StoryFn = CustomSelectControl.bind( {} ); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just adding this generic TS type annotation so this (formerly non-TS) file can be read by the other story file (TS) without erroring.
CustomSelectControl (v1) was never converted to TS, and it's going to be superseded by CustomSelectControlV2 Legacy soon, so it's ok.
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.
To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
Size Change: 0 B Total Size: 1.72 MB ℹ️ View Unchanged
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM! 🚀
I've just left one suggestion that should resolve the problem with displaying hints in v2.
WithLongLabels.args = V1Story.WithLongLabels.args; | ||
|
||
export const WithHints = Template.bind( {} ); | ||
WithHints.args = V1Story.WithHints.args; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
In order to actually display the hints, we'll need the __experimentalShowSelectedHint
prop:
WithHints.args = V1Story.WithHints.args; | |
WithHints.args = { | |
...V1Story.WithHints.args, | |
__experimentalShowSelectedHint: true, | |
}; |
Here are some before/after screenshots:
Without the __experimentalShowSelectedHint
prop:
With the __experimentalShowSelectedHint
prop:
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just saw #60183, lol. Feel free to disregard!
…dPress#60182) Co-authored-by: mirka <0mirka00@git.wordpress.org> Co-authored-by: tyxla <tyxla@git.wordpress.org>
…dPress#60182) Co-authored-by: mirka <0mirka00@git.wordpress.org> Co-authored-by: tyxla <tyxla@git.wordpress.org>
Part of #55023
What?
Reuse the Storybook story props for CustomSelectControl (v1) in the stories for CustomSelectControlV2 legacy so we can more accurately test how styles and functionality match up.
Why?
Although CustomSelectControlV2 legacy will soon completely replace CustomSelectControl (v1), we need this duplicated testing ground right now so we can brush things up and bring it up to parity.
Testing Instructions
The stories for CustomSelectControlV2 Legacy should match the story settings for CustomSelectControl (v1). You may notice styling and functional differences at this point, but that's ok. We will start fixing them in separate PRs.