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

tests: add missing snapshot and axe coverage for ActionMenu #4538

Merged
merged 6 commits into from
May 1, 2024

Conversation

khiga8
Copy link
Contributor

@khiga8 khiga8 commented Apr 26, 2024

Fixes: #4530

Changelog

I noticed that most of the snapshots test and axe scan coverage for ActionMenu are for the default closed state, which is just a button.

This PR adds an action to open the ActionMenu to ensure we're getting adequate visual regression and axe testing coverage, and regenerates the snapshots.

Rollout strategy

  • Patch release
  • Minor release
  • Major release; if selected, include a written rollout or migration plan
  • None; if selected, include a brief description as to why

Testing & Reviewing

Merge checklist

Copy link

changeset-bot bot commented Apr 26, 2024

⚠️ No Changeset found

Latest commit: c15d0f9

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

Copy link
Contributor

github-actions bot commented Apr 26, 2024

size-limit report 📦

Path Size
packages/react/dist/browser.esm.js 87.98 KB (0%)
packages/react/dist/browser.umd.js 88.28 KB (0%)

@github-actions github-actions bot temporarily deployed to storybook-preview-4538 April 26, 2024 20:16 Inactive
@khiga8 khiga8 force-pushed the kh-increase-axe-coverage-to-states branch from fdf4f7d to 08e63e1 Compare April 26, 2024 20:22
@@ -36,30 +37,29 @@ test.describe('ActionMenu', () => {
test.describe(theme, () => {
Copy link
Contributor Author

@khiga8 khiga8 Apr 26, 2024

Choose a reason for hiding this comment

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

I noticed that this test is under Inactive items but it's visiting the wrong ID, -links-and-actions which is actually a duplicate of another test. Updated!

@github-actions github-actions bot temporarily deployed to storybook-preview-4538 April 26, 2024 20:25 Inactive
@primer primer bot temporarily deployed to github-pages April 26, 2024 20:34 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-4538 April 26, 2024 20:35 Inactive
@khiga8 khiga8 changed the title tests: add missing snapshot and axe coverage for open component tests: add missing snapshot and axe coverage for ActionMenu Apr 29, 2024
@khiga8 khiga8 force-pushed the kh-increase-axe-coverage-to-states branch from c5cda68 to 65e5b1e Compare April 29, 2024 12:50
@github-actions github-actions bot temporarily deployed to storybook-preview-4538 April 29, 2024 12:53 Inactive
@khiga8 khiga8 added the skip changeset This change does not need a changelog label Apr 29, 2024
@primer primer bot temporarily deployed to github-pages April 29, 2024 13:04 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-4538 April 29, 2024 13:04 Inactive
@primer primer bot temporarily deployed to github-pages April 29, 2024 13:17 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-4538 April 29, 2024 13:17 Inactive
@primer primer bot temporarily deployed to github-pages April 29, 2024 13:31 Inactive
Copy link
Contributor Author

Choose a reason for hiding this comment

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

The snapshots changed for ActionList bcuz Jonathan's profile picture changed 😅

@github-actions github-actions bot temporarily deployed to storybook-preview-4538 April 29, 2024 13:32 Inactive
@khiga8 khiga8 marked this pull request as ready for review April 29, 2024 13:34
@khiga8 khiga8 requested review from a team as code owners April 29, 2024 13:34
@khiga8 khiga8 requested a review from mperrotti April 29, 2024 13:34
@khiga8
Copy link
Contributor Author

khiga8 commented Apr 29, 2024

I'm assuming the failing tests are expected because the snapshots changed, and will need to be merged in for it to pass.

@joshblack
Copy link
Member

@khiga8 that's a great point about the CI failing, ideally with update snapshots it should go green before merging since it is checking in the correct images. It may be that there is something flakey going on here, will take a look tomorrow if that's okay 👀 Typically this comes up with animations but I think you have animation: 'disabled' when taking screenshots so I'm not sure what would be causing it here 🤔

@@ -46,7 +46,9 @@ test.describe('ActionMenu', () => {
// Open state
await page.locator('button', {hasText: 'Open menu'}).waitFor()
await page.getByRole('button', {name: 'Open menu'}).click()
expect(await page.screenshot()).toMatchSnapshot(`ActionMenu.Inactive Items.${theme}.png`)
expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Aha! Thank you @joshblack! 🌟

@github-actions github-actions bot temporarily deployed to storybook-preview-4538 April 30, 2024 18:33 Inactive
@joshblack
Copy link
Member

bump @mperrotti when you have a sec to review 👀

@khiga8 khiga8 added this pull request to the merge queue May 1, 2024
Merged via the queue into main with commit c860b70 May 1, 2024
30 checks passed
@khiga8 khiga8 deleted the kh-increase-axe-coverage-to-states branch May 1, 2024 21:04
lukasoppermann pushed a commit that referenced this pull request May 3, 2024
* tests: add missing axe coverage for open ActionMenu

* Update test

* test(vrt): update snapshots

* test(vrt): update snapshots

* test(vrt): update snapshots

* test(ActionMenu): disable animations for snapshot test

---------

Co-authored-by: khiga8 <[email protected]>
Co-authored-by: Josh Black <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
skip changeset This change does not need a changelog update snapshots
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Tests] Ensure that axe calls are made on open state of the component
3 participants