diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index d67b163b..8a104834 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -16,6 +16,9 @@ jobs: - name: Install dependencies run: yarn install + - name: Install playwright dependencies + run: yarn exec playwright install chromium --with-deps + - name: Run tests run: | yarn test:ci diff --git a/src/components/RestaurantCard/RestaurantCard.test.tsx b/src/components/RestaurantCard/RestaurantCard.test.tsx index d63a660d..6497dc77 100644 --- a/src/components/RestaurantCard/RestaurantCard.test.tsx +++ b/src/components/RestaurantCard/RestaurantCard.test.tsx @@ -9,24 +9,24 @@ const { Default, Loading, New, Closed } = composeStories(stories) describe('RestaurantCard', () => { test('should render correctly', async () => { - await Default.play() + await Default.run() expect(screen.getByText('Burger Kingdom')).toBeInTheDocument() }) test('should provide a loading skeleton', async () => { - await Loading.play() + await Loading.run() expect(screen.getByTestId('loading')).toBeInTheDocument() }) test('should show a "new" tag', async () => { - await New.play() + await New.run() expect(screen.getByText('new')).toBeInTheDocument() }) test('should not trigger onclick when restaurant is closed', async () => { const onClickSpy = vi.fn() - await Closed.play({ args: { ...Closed.args, onClick: onClickSpy } }) + await Closed.run({ args: { ...Closed.args, onClick: onClickSpy } }) // display closed message expect(screen.getByText('This restaurant is closed.')).toBeInTheDocument() @@ -46,7 +46,7 @@ const testCases = Object.values(composeStories(stories)).map((Story) => [ // Go through all test cases to batch test accessibility test.each(testCases)('%s story should be accessible', async (_storyName, Story) => { - await (Story as any).play() + await (Story as any).run() // @ts-ignore TODO fix Property 'toHaveNoViolations' does not exist on type 'Assertion expect(await axe(document.body.firstChild)).toHaveNoViolations() }) diff --git a/src/pages/RestaurantDetailPage/RestaurantDetailPage.test.tsx b/src/pages/RestaurantDetailPage/RestaurantDetailPage.test.tsx index d00ecef6..1010b9dd 100644 --- a/src/pages/RestaurantDetailPage/RestaurantDetailPage.test.tsx +++ b/src/pages/RestaurantDetailPage/RestaurantDetailPage.test.tsx @@ -8,7 +8,7 @@ const { Success, Loading, Error, NotFound, WithModalOpen } = composeStories(stor describe('RestaurantDetailPage', () => { test('Should add an item to cart', async () => { - await Success.play() + await Success.run() const foodItem = await screen.findByText(/Cheeseburger/i) userEvent.click(foodItem) @@ -20,19 +20,19 @@ describe('RestaurantDetailPage', () => { expect(foodQuantity.textContent).toEqual('1') }) test('Should display an error screen', async () => { - await Error.play() + await Error.run() await waitFor(() => expect(screen.getByText('Something went wrong!')).toBeInTheDocument()) }) test('Should display a loading screen', async () => { - await Loading.play() + await Loading.run() await waitFor(() => expect(screen.getByText('Looking for some food...')).toBeInTheDocument()) }) test('Should display a 404 screen', async () => { - await NotFound.play() + await NotFound.run() await waitFor(() => expect(screen.getByText("We can't find this page")).toBeInTheDocument()) }) test('Should execute story tests', async () => { - await WithModalOpen.play() + await WithModalOpen.run() }) })