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

[Emotion] Pre-emptively fix/regression test form components with tricky className/css locations #6254

Merged
merged 4 commits into from
Sep 21, 2022

Conversation

cee-chen
Copy link
Contributor

@cee-chen cee-chen commented Sep 20, 2022

Summary

Related PRs: #6239, #6248, #6253, #6255

Several of our form components (note: with nested childProps, I didn't look for any others) have somewhat tricky DOM structure in that the wrapper their classNames go on is not the same as the location that ...rest is spread to. This means that to accurately shouldRenderCustomStyles test these components, I had to create a fake Emotion CSS className to merge with a custom/passed css prop.

I thought this worth doing now rather than later (i.e. during the actual Emotion conversion of the components) to ensure that:

  1. The css array merge approach is in place and not forgotten when converted to Emotion
  2. The regression test is in place and not forgotten when it's converted to Emotion

also CC @miukimiu and @thompsongl since IIRC y'all are working on EuiDualRange currently - not sure if this conflicts with your work or compliments it.

Checklist

  • Added or updated jest and cypress tests
  • [ ] A changelog entry exists and is marked appropriately N/A, in theory not a bugfix

This adds an unused Emotion className, but I wanted to ensure

1. The css merging approach is in place and not forgotten when converted to EUI (since ...rest) is not passed to the className wrapper
2. the test is in place and not forgetten when it's converted to Emotion
See previous commit message for EuiCheckbox
see previous EuiCheckbox commit message for rationale
@kibanamachine
Copy link

Preview documentation changes for this PR: https://eui.elastic.co/pr_6254/

@thompsongl
Copy link
Contributor

since IIRC y'all are working on EuiDualRange currently - not sure if this conflicts with your work or compliments it.

Looks complimentary. Probably just a single merge conflict that will be easy to sort out.

Copy link
Contributor

@thompsongl thompsongl left a comment

Choose a reason for hiding this comment

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

LGTM!

@cee-chen
Copy link
Contributor Author

Thanks for the confirmation Greg!

@cee-chen cee-chen merged commit 01f68ab into elastic:main Sep 21, 2022
@cee-chen cee-chen deleted the more-css-props-3 branch September 21, 2022 19:09
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.

3 participants