diff --git a/e2e/editor.spec.ts b/e2e/editor.spec.ts index 6daffa92ac57b67..d8d78acf86bacb6 100644 --- a/e2e/editor.spec.ts +++ b/e2e/editor.spec.ts @@ -2,7 +2,7 @@ import { expect, test } from '@playwright/test'; test.beforeEach(async ({ page }) => { await page.goto( - '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-2' + '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-3' ); }); diff --git a/e2e/lower-jaw.spec.ts b/e2e/lower-jaw.spec.ts index 232490a14d51d23..86423cc8a44198a 100644 --- a/e2e/lower-jaw.spec.ts +++ b/e2e/lower-jaw.spec.ts @@ -2,7 +2,7 @@ import { test, expect } from '@playwright/test'; test.beforeEach(async ({ page }) => { await page.goto( - '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-2' + '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-3' ); }); diff --git a/e2e/preview.spec.ts b/e2e/preview.spec.ts index de1e8033691dac5..7a55af398b604d9 100644 --- a/e2e/preview.spec.ts +++ b/e2e/preview.spec.ts @@ -3,7 +3,7 @@ import translations from '../client/i18n/locales/english/translations.json'; test.beforeEach(async ({ page }) => { await page.goto( - '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-2' + '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-3' ); }); diff --git a/e2e/progress-bar.spec.ts b/e2e/progress-bar.spec.ts index 4fea790c405f65a..1334f3cae678cb3 100644 --- a/e2e/progress-bar.spec.ts +++ b/e2e/progress-bar.spec.ts @@ -1,31 +1,18 @@ -import { expect, test, type Page } from '@playwright/test'; - -let page: Page; - -test.beforeAll(async ({ browser }) => { - page = await browser.newPage(); - await page.goto( - '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-2' - ); -}); +import { expect, test } from '@playwright/test'; test.describe('Progress bar component', () => { test('Should appear with the correct content after the user has submitted their code', async ({ - isMobile, - browserName + page }) => { - const monacoEditor = page.getByLabel('Editor content'); + await page.goto( + '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-2' + ); - // The editor has an overlay div, which prevents the click event from bubbling up in iOS Safari. - // This is a quirk in this browser-OS combination, and the workaround here is to use `.focus()` - // in place of `.click()` to focus on the editor. - // Ref: https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html - if (isMobile && browserName === 'webkit') { - await monacoEditor.focus(); - } else { - await monacoEditor.click(); - } + const monacoEditor = page.getByLabel('Editor content'); + // Using focus instead of click since we're not testing if the editor + // behaves correctly, we're using it to complete the challenge. + await monacoEditor.focus(); await page.keyboard.press('Control+A'); //Meta + A works in webkit await page.keyboard.press('Meta+A'); diff --git a/e2e/reset-modal.spec.ts b/e2e/reset-modal.spec.ts index bc93f33bfae0778..838304d2974499f 100644 --- a/e2e/reset-modal.spec.ts +++ b/e2e/reset-modal.spec.ts @@ -4,7 +4,7 @@ import translations from '../client/i18n/locales/english/translations.json'; test('should render the modal content correctly', async ({ page }) => { await page.goto( - '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-2' + '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-3' ); await page.getByRole('button', { name: translations.buttons.reset }).click(); @@ -48,7 +48,7 @@ test('User can reset challenge', async ({ page }) => { .getByText(updatedText); await page.goto( - '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-2' + '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-3' ); // Building the preview can take a while @@ -137,7 +137,7 @@ test('User can reset classic challenge', async ({ page, isMobile }) => { test('should close when the user clicks the close button', async ({ page }) => { await page.goto( - '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-2' + '/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-3' ); await page.getByRole('button', { name: translations.buttons.reset }).click();