diff --git a/client/src/components/settings/certification.tsx b/client/src/components/settings/certification.tsx index c3f97a5443e..f2c597f9b49 100644 --- a/client/src/components/settings/certification.tsx +++ b/client/src/components/settings/certification.tsx @@ -231,7 +231,21 @@ const LegacyFullStack = (props: CertificationSettingsProps) => { onClick={createClickHandler(certSlug)} target='_blank' > - {isFullStackCert ? t('buttons.show-cert') : t('buttons.claim-cert')} + {isFullStackCert ? ( + <> + {t('buttons.show-cert')}{' '} + + {t('certification.title.Legacy Full Stack')} + + + ) : ( + <> + {t('buttons.claim-cert')}{' '} + + {t('certification.title.Legacy Full Stack')} + + + )} ) : ( )} diff --git a/e2e/settings.spec.ts b/e2e/settings.spec.ts index 07704de39ba..14fc31830ba 100644 --- a/e2e/settings.spec.ts +++ b/e2e/settings.spec.ts @@ -1,6 +1,8 @@ +import { execSync } from 'child_process'; import { test, expect } from '@playwright/test'; + import translations from '../client/i18n/locales/english/translations.json'; -test.use({ storageState: 'playwright/.auth/certified-user.json' }); +import { alertToBeVisible } from './utils/alerts'; const settingsTestIds = { settingsHeading: 'settings-heading', @@ -46,7 +48,9 @@ const legacyCertifications = [ ] ]; -test.describe('Settings', () => { +test.describe('Settings - Certified User', () => { + test.use({ storageState: 'playwright/.auth/certified-user.json' }); + test.beforeEach(async ({ page }) => { await page.goto('/settings'); }); @@ -349,3 +353,70 @@ test.describe('Settings', () => { await expect(aboutInput).toHaveValue(''); }); }); + +// In order to claim the Full Stack cert, the user needs to complete 6 certs. +// Instead of simulating 6 cert claim flows, +// we use the data of Certified User but remove the Full Stack cert. +test.describe('Settings - Certified User without Full Stack Certification', () => { + test.use({ storageState: 'playwright/.auth/certified-user.json' }); + + test.beforeEach(async ({ page }) => { + execSync( + 'node ./tools/scripts/seed/seed-demo-user --certified-user --set-false isFullStackCert' + ); + await page.goto('/settings'); + }); + + test.afterAll(() => { + execSync('node ./tools/scripts/seed/seed-demo-user --certified-user'); + }); + + test('should allow claiming Full Stack cert if the user has completed all requirements', async ({ + page + }) => { + const claimButton = page.getByRole('link', { + name: 'Claim Certification Legacy Full Stack' + }); + const showButton = page.getByRole('link', { + name: 'Show Certification Legacy Full Stack' + }); + + await expect(claimButton).toBeVisible(); + await expect(claimButton).toBeEnabled(); + await claimButton.click(); + + await alertToBeVisible( + page, + '@certifieduser, you have successfully claimed the Legacy Full Stack Certification! Congratulations on behalf of the freeCodeCamp.org team!' + ); + await expect(claimButton).toBeHidden(); + await expect(showButton).toBeVisible(); + await expect(showButton).toHaveAttribute( + 'href', + '/certification/certifieduser/full-stack' + ); + }); +}); + +test.describe('Settings - New User', () => { + test.use({ storageState: 'playwright/.auth/development-user.json' }); + + test.beforeEach(async ({ page }) => { + execSync('node ./tools/scripts/seed/seed-demo-user'); + await page.goto('/settings'); + }); + + test.afterAll(() => { + execSync('node ./tools/scripts/seed/seed-demo-user --certified-user'); + }); + + test('should not allow claiming Full Stack cert if the user has not completed all the required certs', async ({ + page + }) => { + const claimButton = page.getByRole('button', { + name: 'Claim Certification Legacy Full Stack' + }); + await expect(claimButton).toBeVisible(); + await expect(claimButton).toBeDisabled(); + }); +});