diff --git a/packages/atomic/src/components/recommendations/atomic-recs-list/e2e/atomic-recs-list.e2e.ts b/packages/atomic/src/components/recommendations/atomic-recs-list/e2e/atomic-recs-list.e2e.ts index bc5b2bda157..9511e10b607 100644 --- a/packages/atomic/src/components/recommendations/atomic-recs-list/e2e/atomic-recs-list.e2e.ts +++ b/packages/atomic/src/components/recommendations/atomic-recs-list/e2e/atomic-recs-list.e2e.ts @@ -84,3 +84,15 @@ test.describe('with a carousel', () => { ); }); }); + +test('with no recommendations returned by the API, should render placeholders', async ({ + recsList, + page, +}) => { + await recsList.noRecommendations(); + await recsList.load({story: 'default'}); + await recsList.hydrated.waitFor(); + + await page.waitForLoadState('networkidle'); + await expect(recsList.placeholder.first()).toBeVisible(); +}); diff --git a/packages/atomic/src/components/recommendations/atomic-recs-list/e2e/page-object.ts b/packages/atomic/src/components/recommendations/atomic-recs-list/e2e/page-object.ts index 16a9cc7c17e..dd3406a8674 100644 --- a/packages/atomic/src/components/recommendations/atomic-recs-list/e2e/page-object.ts +++ b/packages/atomic/src/components/recommendations/atomic-recs-list/e2e/page-object.ts @@ -27,4 +27,21 @@ export class AtomicCommerceRecsListPageObject extends BasePageObject<'atomic-rec get prevButton() { return this.page.getByLabel('Previous'); } + + async noRecommendations() { + await this.page.route( + '**/search/v2?organizationId=searchuisamples', + async (route) => { + const response = await route.fetch(); + const body = await response.json(); + body.results = []; + await route.fulfill({ + response, + json: body, + }); + } + ); + + return this; + } } diff --git a/packages/atomic/src/components/search/atomic-external/atomic-external.new.stories.tsx b/packages/atomic/src/components/search/atomic-external/atomic-external.new.stories.tsx index 871e3c28f51..a3dee05375a 100644 --- a/packages/atomic/src/components/search/atomic-external/atomic-external.new.stories.tsx +++ b/packages/atomic/src/components/search/atomic-external/atomic-external.new.stories.tsx @@ -27,7 +27,7 @@ const meta: Meta = {