opensource/freeCodeCamp
3
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-08-31 01:14:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

test: move quincy email sign-up rendering coverage to client (#68389)

Browse Source 
Co-authored-by: sembauke <sembauke@users.noreply.github.com>
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Sem Bauke
2026-08-21 17:09:54 +02:00
committed by GitHub
parent c28ced9c2d
commit 68c93b3339
2 changed files with 48 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/email-options.test.tsx
+48
View File
@@ -0,0 +1,48 @@
import React from 'react';
import { render, screen } from '@testing-library/react';
import { describe, it, expect, vi } from 'vitest';
import EmailOptions from './email-options';
function renderEmailOptions(isSignedIn: boolean) {
return render(
<EmailOptions
isSignedIn={isSignedIn}
updateQuincyEmail={vi.fn()}
isPage={true}
/>
);
}
describe('<EmailOptions />', () => {
it('renders the signed-out state with heading, copy, and sign-in button', () => {
renderEmailOptions(false);
expect(
screen.getByRole('heading', { level: 1, name: 'misc.email-signup' })
).toBeInTheDocument();
expect(screen.getByText('misc.email-blast')).toBeInTheDocument();
expect(
screen.getByText('misc.email-signup-not-signed-in')
).toBeInTheDocument();
expect(
screen.getByRole('link', { name: 'buttons.sign-in' })
).toHaveAttribute('href', 'http://localhost:3000/signin');
});
it('renders the signed-in state with heading, copy, and yes/no buttons', () => {
renderEmailOptions(true);
expect(
screen.getByRole('heading', { level: 1, name: 'misc.email-signup' })
).toBeInTheDocument();
expect(screen.getByText('misc.email-blast')).toBeInTheDocument();
expect(screen.getByText('misc.quincy')).toBeInTheDocument();
expect(
screen.getByRole('button', { name: 'buttons.yes-please' })
).toBeInTheDocument();
expect(
screen.getByRole('button', { name: 'buttons.no-thanks' })
).toBeInTheDocument();
});
});
e2e/quincy-email-sign-up.spec.ts
-58
View File
@@ -15,38 +15,14 @@ test.describe('Email sign-up page when user is not signed in', () => {
await page.goto('/email-sign-up');
});
test('should display the content correctly', async ({ page }) => {
await expect(
page.getByRole('heading', {
level: 1,
name: translations.misc['email-signup']
})
).toBeVisible();
await expect(
page.getByText(translations.misc['email-blast'])
).toBeVisible();
await expect(
page.getByText(translations.misc['email-signup-not-signed-in'])
).toBeVisible();
await expect(page.getByTestId('email-signup-sign-in-btn')).toBeVisible();
});
test("should not enable Quincy's weekly newsletter when the user clicks the sign up button", async ({
page
}) => {
await expect(page).toHaveTitle('Email Sign Up | freeCodeCamp.org');
await expect(
page.getByText(translations.misc['email-blast'])
).toBeVisible();
const signupLink = page.getByTestId('email-signup-sign-in-btn');
await expect(signupLink).toBeVisible();
await expect(signupLink).toHaveAttribute('href', `${apiLocation}/signin`);
await signupLink.click();
// The user is signed in and automatically redirected to /learn after clicking the button.
// We wait for this navigation to complete before moving onto the next.
await page.waitForURL(allowTrailingSlash('/learn'));
await expect(
page.getByRole('heading', { name: 'Welcome back, Full Stack User' })
@@ -67,45 +43,19 @@ test.describe('Email sign-up page when user is not signed in', () => {
test.describe('Email sign-up page when user is signed in', () => {
test.beforeEach(async ({ page }) => {
// It's necessary to seed with a user that has not selected an email newsletter option.
execSync('node ../tools/scripts/seed/seed-demo-user --certified-user');
await page.goto('/email-sign-up');
});
test('should display the content correctly', async ({ page }) => {
await expect(
page.getByText(translations.misc['email-signup'])
).toBeVisible();
await expect(
page.getByText(translations.misc['email-blast'])
).toBeVisible();
await expect(page.getByText(translations.misc['quincy'])).toBeVisible();
await expect(
page.getByRole('button', { name: translations.buttons['yes-please'] })
).toBeVisible();
await expect(
page.getByRole('button', { name: translations.buttons['no-thanks'] })
).toBeVisible();
});
test("should disable Quincy's weekly newsletter if the user clicks No", async ({
page
}) => {
await expect(page).toHaveTitle('Email Sign Up | freeCodeCamp.org');
await expect(
page.getByText(translations.misc['email-blast'])
).toBeVisible();
const noThanksButton = page.getByRole('button', {
name: translations.buttons['no-thanks']
});
await expect(noThanksButton).toBeVisible();
await noThanksButton.click();
// The user is signed in and automatically redirected to /learn after clicking the button.
// We wait for the navigation to complete.
await page.waitForURL('/learn');
await expect(
page.getByRole('heading', { name: 'Welcome back, Full Stack User' })
@@ -126,20 +76,12 @@ test.describe('Email sign-up page when user is signed in', () => {
test("should enable Quincy's weekly newsletter if the user clicks Yes", async ({
page
}) => {
await expect(page).toHaveTitle('Email Sign Up | freeCodeCamp.org');
await expect(
page.getByText(translations.misc['email-blast'])
).toBeVisible();
const signupButton = page.getByRole('button', {
name: translations.buttons['yes-please']
});
await expect(signupButton).toBeVisible();
await signupButton.click();
// The user is signed in and automatically redirected to /learn after clicking the button.
// We wait for the navigation to complete.
await page.waitForURL('/learn');
await expect(
page.getByRole('heading', { name: 'Welcome back, Full Stack User' })