Repository: freeCodeCamp/freeCodeCamp
File: e2e/help-button.spec.ts (TypeScript)

Code before:
  }) => {
    // visit the page without the video link
    await page.goto(
      '/learn/front-end-development-libraries/bootstrap/apply-the-default-bootstrap-button-style'
    );
    //The button is visible
    const helpButton = page.getByTestId('get-help-dropdown');
    await expect(helpButton).toBeVisible();
    //The button is clickable
    await helpButton.click();
    //The menu items are visible
    await expect(page.getByTestId('get-hint')).toBeVisible();
    await expect(page.getByTestId('ask-for-help')).toBeVisible();
    //The video link is hidden
    await expect(page.getByTestId('watch-a-video')).toBeHidden();
  });
});

test.describe('help-button tests for a page with a reset and help button', () => {
  test('should not be present before the user checks their code three times', async ({
    page
  }) => {
    await page.goto(
      'learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-8'
    );
    await expect(page.getByTestId('get-help-button')).toBeHidden();
  });

  test('should be present after the user checks their code three times', async ({
    page
  }) => {
    await page.goto(
      'learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-8'
    );
    const checkButton = page.getByTestId('lowerJaw-check-button');
    await checkButton.click();
    await checkButton.click();
    await checkButton.click();
    await expect(page.getByText(translations.buttons.help)).toBeVisible();
  });
  test('icon should be invisible to screen-reader', async ({ page }) => {
    await page.goto(
      'learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-8'
    );
    const checkButton = page.getByTestId('lowerJaw-check-button');
    await checkButton.click();
    await checkButton.click();
    await checkButton.click();
    const helpButton = page.getByText(translations.buttons.help);
    const helpIconGroup = helpButton.getByRole('group', {
      includeHidden: false

Review comment (suggestion):
```suggestion
    await expect(page.getByRole('button', { name: 'Help' })).toBeHidden();
```

Code after:
    // visit the page without the video link
    await page.goto(
      '/learn/front-end-development-libraries/bootstrap/apply-the-default-bootstrap-button-style'
    );
    //The button is visible
    const helpButton = page.getByTestId('get-help-dropdown');
    await expect(helpButton).toBeVisible();
    //The button is clickable
    await helpButton.click();
    //The menu items are visible
    await expect(page.getByTestId('get-hint')).toBeVisible();
    await expect(page.getByTestId('ask-for-help')).toBeVisible();
    //The video link is hidden
    await expect(page.getByTestId('watch-a-video')).toBeHidden();
  });
});

test.describe('help-button tests for a page with a reset and help button', () => {
  test('should not be present before the user checks their code three times', async ({
    page
  }) => {
    await page.goto(
      'learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-8'
    );
    await expect(page.getByRole('button', { name: 'Help' })).toBeHidden();
  });

  test('should be present after the user checks their code three times', async ({
    page
  }) => {
    await page.goto(
      'learn/2022/responsive-web-design/learn-html-by-building-a-cat-photo-app/step-8'
    );
    const checkButton = page.getByTestId('lowerJaw-check-button');
    await checkButton.click();
    await checkButton.click();
    await checkButton.click();
    const helpButton = page.getByRole('button', { name: 'Help' });
    await expect(helpButton).toBeVisible();
    const helpIconGroup = helpButton.getByRole('group', {
      includeHidden: false
    });
    await expect(helpIconGroup).toBeHidden();
  });
});