Repository: freeCodeCamp/freeCodeCamp
File: e2e/settings.spec.ts (TypeScript)

Code before:
  });

  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
  }) => {
    test.setTimeout(20000);

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

    // For some reason, clicking the claim button results a server error,
    // but the request does seem to be successful
    // as the claim button is replaced by the show button after a page refresh.
    await page.reload();
    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', {

Review comment (suggestion):
I'm not sure if this is a known issue.

I got the error both with Playwright and when I was manually testing the action.

<img width="927" alt="Screenshot 2024-07-16 at 01 35 52" src="https://github.com/user-attachments/assets/ff649dfc-5eff-413d-9841-0735fa8b2e62">


Code after:
    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'