gitadmin/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-05-28 18:26:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: convert hotkeys tests to Playwright (#54938)

Browse Source 
Co-authored-by: Huyen Nguyen <25715018+huyenltnguyen@users.noreply.github.com>
This commit is contained in:
Sem Bauke
2024-05-31 23:58:48 +02:00
committed by GitHub
parent 6ffbbed526
commit 9f41feb40d
2 changed files with 74 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files
e2e/hotkeys.spec.ts
+74 -13
View File
@@ -7,6 +7,21 @@ import { getEditors } from './utils/editor';
const course =
'/learn/javascript-algorithms-and-data-structures/basic-javascript/comment-your-javascript-code';
const links = {
frontEnd1:
'/learn/front-end-development-libraries/front-end-development-libraries-projects/build-a-random-quote-machine',
frontEnd2:
'/learn/front-end-development-libraries/front-end-development-libraries-projects/build-a-markdown-previewer',
backEnd1:
'/learn/back-end-development-and-apis/back-end-development-and-apis-projects/timestamp-microservice',
backEnd2:
'learn/back-end-development-and-apis/back-end-development-and-apis-projects/request-header-parser-microservice',
video1:
'/learn/python-for-everybody/python-for-everybody/introduction-why-program',
video2:
'/learn/python-for-everybody/python-for-everybody/introduction-hardware-architecture'
};
test.use({ storageState: 'playwright/.auth/certified-user.json' });
test.beforeAll(async ({ request }) => {
@@ -20,6 +35,16 @@ test.beforeAll(async ({ request }) => {
});
});
test.beforeEach(async ({ page }) => {
await page.goto('/settings');
const keyboardShortcutGroup = page.getByRole('group', {
name: translations.settings.labels['keyboard-shortcuts']
});
await keyboardShortcutGroup
.getByRole('button', { name: translations.buttons.on, exact: true })
.click();
});
test.afterEach(
async ({ request }) =>
await authedRequest({
@@ -32,15 +57,7 @@ test.afterEach(
})
);
test('User can interact with the app using the keyboard', async ({ page }) => {
// Enable keyboard shortcuts
await page.goto('/settings');
const keyboardShortcutGroup = page.getByRole('group', {
name: translations.settings.labels['keyboard-shortcuts']
});
await keyboardShortcutGroup
.getByRole('button', { name: translations.buttons.on, exact: true })
.click();
test('User can use shortcuts in and around the editor', async ({ page }) => {
// TODO: getByRole('alert', name:
// translations.flash['keyboard-shortcut-updated']) did not find the alert.
// Should it a) be an alert and b) have a name?
@@ -73,8 +90,52 @@ test('User can interact with the app using the keyboard', async ({ page }) => {
await page.keyboard.press('e');
await expect(getEditors(page)).toBeFocused();
await page.keyboard.press('Control+Enter');
await expect(page.getByText('running test')).toBeVisible();
// Show shortcuts (shift+/) is covered by the shortcuts-modal tests
await getEditors(page).press('Escape');
await page.keyboard.press('r');
await expect(page.locator('.instructions-panel')).toBeFocused();
});
test('User can use shortcuts to navigate between frontend projects', async ({
page
}) => {
await page.goto(links.frontEnd1);
await expect(page.locator('#editor-layout')).toBeFocused();
await page.keyboard.press('Escape');
await page.keyboard.press('n');
await page.waitForURL(links.frontEnd2);
await expect(page.locator('#editor-layout')).toBeFocused();
await page.keyboard.press('p');
await page.keyboard.press('Escape');
await page.waitForURL(links.frontEnd1);
});
test('User can use shortcuts to navigate between backend projects', async ({
page
}) => {
await page.goto(links.backEnd1);
await expect(page.locator('#editor-layout')).toBeFocused();
await page.keyboard.press('Escape');
await page.keyboard.press('n');
await page.waitForURL(links.backEnd2);
await expect(page.locator('#editor-layout')).toBeFocused();
await page.keyboard.press('p');
await page.keyboard.press('Escape');
await page.waitForURL(links.backEnd1);
});
test('User can use shortcuts to navigate between video-based challenges', async ({
page
}) => {
await page.goto(links.video1);
await expect(page.locator('#editor-layout')).toBeFocused();
await page.keyboard.press('Escape');
await page.keyboard.press('n');
await page.waitForURL(links.video2);
await expect(page.locator('#editor-layout')).toBeFocused();
await page.keyboard.press('p');
await page.keyboard.press('Escape');
await page.waitForURL(links.video1);
});