Skip to content

Conversation

@paulrobinson88
Copy link
Contributor

Proposed behaviour

Removes a number of Playwright tests which are duplicated elsewhere in the testing suite and adds more detail to one of the interaction tests in Chromatic for the Action Popover component

Current behaviour

There are a number of tests which exist in more than one testing suite along with flaky tests which can cause the test to fail or take a significant amount of time.

Checklist

  • Commits follow our style guide
  • Related issues linked in commit messages if required
  • Screenshots are included in the PR if useful
  • All themes are supported if required
  • Unit tests added or updated if required
  • Playwright automation tests added or updated if required
  • Storybook added or updated if required
  • Translations added or updated (including creating or amending translation keys table in storybook) if required
  • Typescript d.ts file added or updated if required
  • Related docs have been updated if required

QA

  • Tested in provided StackBlitz sandbox/Storybook
  • Add new Playwright test coverage if required
  • Carbon implementation matches Design System/designs
  • UI Tests GitHub check reviewed if required

Additional context

This should significantly reduce the amount of time taken for Playwright test to run in the Action Popover component without losing any coverage in Jest.

Testing instructions

Ensure the Playwright tests pass and Chromatic snapshots are correct.

const iconPosition = await icon.boundingBox();
const textPosition = await text.boundingBox();

if (!iconPosition) throw new Error("Icon isn't visible");
Copy link
Contributor

Choose a reason for hiding this comment

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

question (non-blocking): boundingBox() method returns either an object or null. Could we use expect(iconPosition).not.toBeNull() instead of if (!iconPosition) throw new Error("Icon isn't visible"); to avoid any CI / Lint warnings?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Thanks for pointing this one out Mihai, I've attempted to workaround this but it appears to cause issues with the expect(iconPosition.x).toBeGreaterThan(textPosition.x); and the linter has an issue when we try to ignore it potentially being null with if (iconPosition && textPosition) { expect(iconPosition.x).toBeLessThan(textPosition.x); }
Seems we're doing similar in other areas of the codebase like in the Dialog component so may leave this as is for now.

ActionPopoverCustom,
ActionPopoverMenuWithProps,
ActionPopoverPropsComponent,
ActionPopoverWithIconsAndNoSubmenus,
Copy link
Contributor

@tomdavies73 tomdavies73 Feb 10, 2026

Choose a reason for hiding this comment

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

suggetion: I know we've removed a fair bulk of test components here which is super positive, but I think a manual review of the remaining test components could be beneficial, especially:

  1. ActionPopoverWithIconsAndNoSubmenus
  2. ActionPopoverWithProps
  3. ActionPopoverWithSubmenusAndIcons
  4. ActionPopoverWithDownloadButton

Might be worth seeing where these are used, if the tests are useful etc. It may also be worth seeing if these different variations are captured in a chromatic snapshot, if they aren't, this could be worth exploring too 👍

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.

3 participants