diff --git a/apps/browser/src/platform/popup/layout/popup-layout.stories.ts b/apps/browser/src/platform/popup/layout/popup-layout.stories.ts index 7498d3395e..64ce49be8a 100644 --- a/apps/browser/src/platform/popup/layout/popup-layout.stories.ts +++ b/apps/browser/src/platform/popup/layout/popup-layout.stories.ts @@ -4,7 +4,6 @@ import { CommonModule } from "@angular/common"; import { Component, importProvidersFrom } from "@angular/core"; import { RouterModule } from "@angular/router"; import { Meta, StoryObj, applicationConfig, moduleMetadata } from "@storybook/angular"; -import { expect, waitFor, within } from "@storybook/test"; import { PolicyService } from "@bitwarden/common/admin-console/abstractions/policy/policy.service.abstraction"; import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service"; @@ -302,6 +301,11 @@ class MockVaultSubpageComponent {} export default { title: "Browser/Popup Layout", component: PopupPageComponent, + parameters: { + // Chromatic has been reporting diffs on these stories where the item rows are not all fully loaded. + // Trying this out to test the theory that it's taking a screenshot too quickly. + chromatic: { delay: 1000 }, + }, decorators: [ moduleMetadata({ imports: [ @@ -465,20 +469,6 @@ export const CompactMode: Story = { }; updateLabel("compact-example"); updateLabel("regular-example"); - - await waitFor(async () => { - const canvas = within(canvasEl); - const allBadges = canvas.getAllByTitle("Fill"); - - // Chromatic has been reporting diffs on this story where the item rows are not all fully loaded. - // Trying this out to test the theory that it's taking a screenshot too quickly. - - // Ensure that all bit-items have rendered before chromatic screenshot by awaiting - // all the "Fill" badges rendering. There are 20 rows in each vault "view" and 2 "views" - // rendered per story (relaxed and compact). There may be double the amount if light & dark - // mode are rendered together. - await expect(allBadges.length).toBeGreaterThanOrEqual(40); - }); }, }; @@ -583,21 +573,4 @@ export const WidthOptions: Story = { `, }), - play: async (context) => { - const canvasEl = context.canvasElement; - - await waitFor(async () => { - const canvas = within(canvasEl); - const allBadges = canvas.getAllByTitle("Fill"); - - // Chromatic has been reporting diffs on this story where the item rows are not all fully loaded. - // Trying this out to test the theory that it's taking a screenshot too quickly. - - // Ensure that all bit-items have rendered before chromatic screenshot by awaiting - // all the "Fill" badges rendering. There are 20 rows in each vault "view" and 3 "views" - // rendered per story (default, wide, exra wide). There may be double the amount if light & dark - // mode are rendered together. - await expect(allBadges.length).toBeGreaterThanOrEqual(60); - }); - }, };