diff --git a/client/src/assets/icons/algorithm.tsx b/client/src/assets/icons/algorithm.tsx index 7c92581ecb4f89..b89f0e1c2b3497 100644 --- a/client/src/assets/icons/algorithm.tsx +++ b/client/src/assets/icons/algorithm.tsx @@ -6,6 +6,7 @@ function Algorithm( return ( <>

+

{i18nSuperBlock}

- {generateIconComponent(superBlock, 'cert-header-icon')} +
+ {generateIconComponent(superBlock, 'cert-header-icon')} +
- {superBlockIntroText.map((str, i) => ( -

{str}

- ))} +
+ {superBlockIntroText.map((str, i) => ( +

{str}

+ ))} +
{superBlockNoteText && ( -
+
{superBlockNoteText}
)} diff --git a/e2e/coding-interview-prep-intro-page.spec.ts b/e2e/coding-interview-prep-intro-page.spec.ts index 3a90fea4177118..94cc457c85c6a6 100644 --- a/e2e/coding-interview-prep-intro-page.spec.ts +++ b/e2e/coding-interview-prep-intro-page.spec.ts @@ -1,4 +1,5 @@ import { test, expect, type Page } from '@playwright/test'; +import superblockTexts from '../client/i18n/locales/english/intro.json'; test.describe('Certification intro page', () => { let page: Page; @@ -12,15 +13,47 @@ test.describe('Certification intro page', () => { await page.close(); }); - test('Should have a relevant page title', async () => { + test('Should have a relevant page title ', async () => { await expect(page).toHaveTitle('Coding Interview Prep | freeCodeCamp.org'); }); - test('Should render', async () => { - await expect( - page.locator( - "text=If you're looking for free coding exercises to prepare for your next job interview, we've got you covered." - ) - ).toBeVisible(); + test('Should have course heading and relevant icon image in the superblock', async () => { + const heading = page.getByTestId('superblock-heading'); + await expect(heading).toBeVisible(); + await expect(heading).toContainText('Coding Interview Prep'); + + const superblockIcon = page.getByTestId('superblock-icon'); + await expect(superblockIcon).toBeVisible(); + + const algorithmIcon = superblockIcon.getByTestId('algorithm-icon'); + await expect(algorithmIcon).toBeVisible(); + }); + + test('Should have relevant course description in the superblock', async () => { + const description = page.getByTestId('superblock-description-box'); + const childParagraphs = description.getByTestId( + 'superblock-description-para' + ); + + // container should be visible + await expect(description).toBeVisible(); + + // container should have 2 paragraphs + await expect(childParagraphs).toHaveCount(2); + + // checks if received content is equal to the expected content + const receivedTexts = await childParagraphs.allInnerTexts(); + expect(receivedTexts).toEqual( + superblockTexts['coding-interview-prep'].intro + ); + }); + + test('Should display the note if it exists', async () => { + const noteText = page.getByTestId('superblock-note'); + + await expect(noteText).toBeVisible(); + await expect(noteText).toContainText( + superblockTexts['coding-interview-prep'].note + ); }); });