jprdonnelly/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-05-14 19:01:05 -04:00
Code Issues Projects Releases Wiki Activity

test: improve project preview modal spec (#54528)

Browse Source 
Co-authored-by: Naomi <nhcarrigan@gmail.com>
This commit is contained in:
Oliver Eyton-Williams
2024-04-25 23:11:39 +02:00
committed by GitHub
parent cf2485f3d4
commit 0fa65def5a
1 changed files with 13 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
e2e/project-preview-modal.spec.ts
View File

@@ -2,50 +2,26 @@ import { test, expect } from '@playwright/test';
import translations from '../client/i18n/locales/english/translations.json';
const currentUrlPath =
'/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-1';
test.beforeEach(async ({ page }) => {
await page.goto(currentUrlPath);
});
test.describe('Exit Project Preview Modal E2E Test Suite', () => {
test('Verifies the Correct Rendering of the Project Preview Modal', async ({
page
}) => {
await expect(
page.getByRole('button', {
name: translations.buttons.close
})
).toBeVisible();
test.describe('When it renders', () => {
test.beforeEach(async ({ page }) => {
const urlWithProjectPreview =
'/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-1';
await page.goto(urlWithProjectPreview);
});
test('it can be closed by the Start Coding! button', async ({ page }) => {
const dialog = page.getByRole('dialog', {
name: translations.learn['project-preview-title']
});
await expect(dialog).toBeVisible();
await expect(dialog.getByTitle('CatPhotoApp preview')).toBeVisible();
await expect(
page.getByRole('button', { name: 'Start Coding!' })
).toBeVisible();
});
test('Closes the Project Preview Modal When the User clicks on the close Button', async ({
page
}) => {
const dialog = page.getByRole('dialog', {
name: translations.learn['project-preview-title']
});
await expect(dialog).toBeVisible();
await page.getByRole('button', { name: 'Start Coding!' }).click();
await expect(dialog).not.toBeVisible();
});
test('Closes the Project Preview Modal when the User clicks on X button', async ({
page
}) => {
test('it can be closed by the close button', async ({ page }) => {
const dialog = page.getByRole('dialog', {
name: translations.learn['project-preview-title']
});
@@ -60,26 +36,24 @@ test.describe('Exit Project Preview Modal E2E Test Suite', () => {
});
});
test.describe('Project Preview Modal Conditional Rendering', () => {
test('Does not render on second step of a project', async ({ page }) => {
test.describe('It should on appear', () => {
test('on the second step of a project', async ({ page }) => {
await page.goto(
'/learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-2'
);
const dialog = page.getByRole('dialog', {
name: translations.learn['project-preview-title']
});
await expect(dialog).toHaveCount(0);
await expect(dialog).not.toBeVisible();
});
test('Does not render on first step of a project without a preview', async ({
page
}) => {
test('on first step of a project without a preview', async ({ page }) => {
await page.goto(
'/learn/javascript-algorithms-and-data-structures-v8/learn-introductory-javascript-by-building-a-pyramid-generator/step-1'
);
const dialog = page.getByRole('dialog', {
name: translations.learn['project-preview-title']
});
await expect(dialog).toHaveCount(0);
await expect(dialog).not.toBeVisible();
});
});