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

Use css style on component testing #2701

Merged
merged 3 commits into from
Jun 21, 2024
Merged

Use css style on component testing #2701

merged 3 commits into from
Jun 21, 2024

Conversation

balanza
Copy link
Member

@balanza balanza commented Jun 18, 2024

Description

Some component tests rely on css class in order to determine the component properties. For example in 56a978b the toBeVisible() matcher look for style display: none to be applied to the element or one of its parents.

This PR proposes the <WithStyle> test utility. <WithStyle> is a higher-order component that prepends the application css to the component to be rendered. It's meant to be used only on tests that require such ability (for keeping the test footprint small).

In order to work the application css must be built already, thus a pretest script is added to package.json.
Furthermore, the package.json has been refactored a bit to make use of npm variables (not required, it can be reverted).

@balanza
Copy link
Member Author

balanza commented Jun 18, 2024

A quick thought on performance based on my laptop

# running command
time npm run test js/common/Tooltip/Tooltip.test.jsx

# without style
3.43s user 0.76s system 180% cpu 2.325 total

# with style, generated just in time (first run)
5.33s user 0.96s system 168% cpu 3.727 total

# with style, already generated
3.48s user 0.73s system 173% cpu 2.419 total

@balanza
Copy link
Member Author

balanza commented Jun 19, 2024

Addendum: with @jamie-suse we investigated a bit around the possibility to load CSS once for all JSDOM instances. It seems there is no this possibility: furthermore, it seems this feature is considered out-of-scope by JSDOM itself (see testing-library/jest-dom#70).

@balanza balanza requested review from a team, dottorblaster and janvhs and removed request for a team June 19, 2024 15:49
Copy link
Member

@nelsonkopliku nelsonkopliku left a comment

Choose a reason for hiding this comment

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

LGTM

@balanza balanza enabled auto-merge (squash) June 21, 2024 15:23
balanza added 3 commits June 21, 2024 19:04
Signed-off-by: balanza <emanuele.decupis@suse.com>
Signed-off-by: balanza <emanuele.decupis@suse.com>
Signed-off-by: balanza <emanuele.decupis@suse.com>
@balanza balanza merged commit 566b856 into main Jun 21, 2024
8 checks passed
@balanza balanza deleted the test-with-style branch June 21, 2024 17:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Development

Successfully merging this pull request may close these issues.

2 participants