feat/ab test landing google auth (#62538)

This commit is contained in:
Ahmad Abdolsaheb
2025-10-29 16:55:08 +03:00
committed by GitHub
parent 2bd3ec1db8
commit 03c775ac2d
14 changed files with 464 additions and 240 deletions
+62 -68
View File
@@ -6,13 +6,15 @@ import { addGrowthbookCookie } from './utils/add-growthbook-cookie';
const landingPageElements = {
heading: 'landing-header',
callToAction: 'landing-big-cta',
certifications: 'certifications',
curriculumBtns: 'curriculum-map-button',
testimonials: 'testimonial-card',
landingPageImage: 'landing-page-figure',
faq: 'landing-page-faq',
jobs: 'More than <strong>100,000</strong> freeCodeCamp.org graduates have gotten <strong>jobs</strong> at tech companies including:'
jobs: 'More than <strong>100,000</strong> freeCodeCamp.org graduates have gotten <strong>jobs</strong> at tech companies including:',
googleCTA: 'landing-google-cta',
moreWaysCTA: 'landing-more-ways-cta',
landingTopCta: 'landing-top-big-cta'
} as const;
const nonArchivedSuperBlocks = [
@@ -30,11 +32,68 @@ async function goToLandingPage(page: Page) {
await page.goto('/');
}
test.describe('Landing Top - Variation B', () => {
test.describe('Main CTA - Variation A', () => {
test.beforeEach(async ({ context, page }) => {
await addGrowthbookCookie({ context, variation: 'A' });
await goToLandingPage(page);
});
test('Five main CTAs render correctly', async ({ page }) => {
const landingTopCta = page.getByTestId(landingPageElements.landingTopCta);
const googleCTA = page.getByTestId(landingPageElements.googleCTA);
const moreWaysCTA = page.getByTestId(landingPageElements.moreWaysCTA);
const ctas = page.getByRole('link', {
name: translations.buttons['logged-in-cta-btn']
});
const benefitsCtas = page.getByRole('link', {
name: translations.landing.benefits.cta
});
await expect(benefitsCtas).toHaveCount(1);
await expect(landingTopCta).toHaveText(
translations.buttons['logged-in-cta-btn']
);
await expect(ctas).toHaveCount(4);
for (const cta of await ctas.all()) {
await expect(cta).toBeVisible();
}
await expect(googleCTA).toBeHidden();
await expect(moreWaysCTA).toBeHidden();
});
});
test.describe('Main CTA - Variation B', () => {
test.beforeEach(async ({ context, page }) => {
await addGrowthbookCookie({ context, variation: 'B' });
await goToLandingPage(page);
});
test('Four main and two stacked CTAs render correctly', async ({ page }) => {
const landingTopCta = page.getByTestId(landingPageElements.landingTopCta);
const googleCTA = page.getByTestId(landingPageElements.googleCTA);
const moreWaysCTA = page.getByTestId(landingPageElements.moreWaysCTA);
const ctas = page.getByRole('link', {
name: translations.buttons['logged-in-cta-btn']
});
const benefitsCtas = page.getByRole('link', {
name: translations.landing.benefits.cta
});
await expect(benefitsCtas).toHaveCount(1);
await expect(landingTopCta).toBeHidden();
await expect(ctas).toHaveCount(3);
for (const cta of await ctas.all()) {
await expect(cta).toBeVisible();
}
await expect(googleCTA).toHaveText(
translations.buttons['sign-in-with-google']
);
await expect(moreWaysCTA).toHaveText(
translations.buttons['more-ways-to-sign-in']
);
});
});
test.describe('Landing Page', () => {
test.beforeEach(async ({ page }) => {
await goToLandingPage(page);
});
test('Main heading copy renders correctly', async ({ page }) => {
const bigHeading = page.getByTestId('big-heading-1-b');
@@ -54,61 +113,6 @@ test.describe('Landing Top - Variation B', () => {
translations.landing['graduates-work'].replace(/<\/?strong>/g, '')
);
});
});
/*
*
* not currently in use after https://github.com/freeCodeCamp/freeCodeCamp/pull/61359
* bring back after we fix GB
*/
// test.describe('Landing Top - Variation A', () => {
// test.beforeEach(async ({ context, page }) => {
// await addGrowthbookCookie({ context, variation: 'newA' });
// await goToLandingPage(page);
// });
// test('The headline renders correctly', async ({ page }) => {
// const landingHeading1 = page.getByTestId('landing-big-heading-1');
// await expect(landingHeading1).toHaveText(
// translations.landing['big-heading-1']
// );
// const landingHeading2 = page.getByTestId('landing-big-heading-2');
// await expect(landingHeading2).toHaveText(
// translations.landing['big-heading-2']
// );
// const landingHeading3 = page.getByTestId('landing-big-heading-3');
// await expect(landingHeading3).toHaveText(
// translations.landing['big-heading-3']
// );
// });
// test('Logo row copy renders correctly', async ({ page }) => {
// const landingH2Heading = page.getByTestId('h2-heading');
// await expect(landingH2Heading).toHaveText(
// translations.landing['h2-heading'].replace(/<\/?strong>/g, '')
// );
// });
// test('Hero image should have a description', async ({ isMobile, page }) => {
// const captionText = page.getByText(
// translations.landing['hero-img-description']
// );
// if (isMobile) {
// await expect(captionText).toBeHidden();
// } else {
// await expect(captionText).toBeVisible();
// }
// });
// });
test.describe('Landing Page', () => {
test.beforeEach(async ({ page }) => {
await goToLandingPage(page);
});
test('The component Why learn with freeCodeCamp renders correctly', async ({
context,
@@ -123,16 +127,6 @@ test.describe('Landing Page', () => {
await expect(h2Element).toBeVisible();
});
test('Call to action buttons should render correctly', async ({ page }) => {
const ctas = page.getByRole('link', {
name: translations.buttons['logged-in-cta-btn']
});
await expect(ctas).toHaveCount(4);
for (const cta of await ctas.all()) {
await expect(cta).toBeVisible();
}
});
test('Hero image should have an alt', async ({ isMobile, page }) => {
const campersImage = page.getByAltText(
translations.landing['hero-img-alt']