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();
+ });
+});