jprdonnelly/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-03-14 04:00:42 -04:00
Code Issues Projects Releases Wiki Activity

refactor(e2e,playwright): add playwright test labels to show-certificate test and refactor the test code for show-certificate (#51553)

Browse Source
This commit is contained in:
Fahd Kassim
2023-09-15 14:06:15 +05:00
committed by GitHub
parent e9fbc352c1
commit 4a5ebe01b8
3 changed files with 25 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
client/src/client-only-routes/show-certification.tsx
View File

@@ -288,6 +288,7 @@ const ShowCertification = (props: ShowCertificationProps): JSX.Element => {
certMonth + 1
}&certUrl=${certURL}`}
target='_blank'
data-playwright-test-label='linkedin-share-btn'
>
{t('profile.add-linkedin')}
</Button>
@@ -301,6 +302,7 @@ const ShowCertification = (props: ShowCertificationProps): JSX.Element => {
certURL: certURL
})}`}
target='_blank'
data-playwright-test-label='twitter-share-btn'
>
{t('profile.add-twitter')}
</Button>
@@ -342,15 +344,20 @@ const ShowCertification = (props: ShowCertificationProps): JSX.Element => {
<h1>
<strong>{{ user: displayName }}</strong>
</h1>
<h3>placeholder</h3>
<h1>
<h3 data-playwright-test-label='successful-completion'>
placeholder
</h3>
<h1 data-playwright-test-label='certification-title'>
<strong>
{{
title: t(`certification.title.${certTitle}`, certTitle)
}}
</strong>
</h1>
<h4 data-cy={'issue-date'}>
<h4
data-cy={'issue-date'}
data-playwright-test-label='issue-date'
>
{{
time: certDate.toLocaleString([localeCode, 'en-US'], {
year: 'numeric',

17
e2e/show-certificate-else.spec.ts
View File

@@ -12,17 +12,16 @@ test.describe('Show certification else', () => {
await page.close();
});
test('while viewing someone else, should display certificate', async () => {
expect(await page.isVisible('text=successfully completed')).toBeTruthy();
expect(await page.isVisible('text=Responsive Web Design')).toBeTruthy();
test('while viewing someone else, should display the certificate information', async () => {
await expect(page.getByTestId('successful-completion')).toBeVisible();
await expect(page.getByTestId('certification-title')).toBeVisible();
await expect(page.getByTestId('issue-date')).toContainText(
'Developer Certification on August 3, 2018'
);
});
test('while viewing someone else, should not render a LinkedIn button and Twitter button', async () => {
await expect(
page.locator('text=Add this certification to my LinkedIn profile')
).toBeHidden();
await expect(
page.locator('text=Share this certification on Twitter')
).toBeHidden();
await expect(page.getByTestId('linkedin-share-btn')).toBeHidden();
await expect(page.getByTestId('twitter-share-btn')).toBeHidden();
});
});

18
e2e/show-certificate-own.spec.ts
View File

@@ -14,20 +14,16 @@ test.describe('Show certification own', () => {
await page.close();
});
test('should display certificate details', async () => {
await expect(page.getByText('successfully completed')).toBeVisible();
await expect(page.getByText('Responsive Web Design')).toBeVisible();
await expect(page.locator('[data-cy=issue-date]')).toContainText(
test('should display the certificate details', async () => {
await expect(page.getByTestId('successful-completion')).toBeVisible();
await expect(page.getByTestId('certification-title')).toBeVisible();
await expect(page.getByTestId('issue-date')).toContainText(
'Developer Certification on August 3, 2018'
);
});
test('should render LinkedIn and Twitter buttons', async () => {
await expect(
page.getByText('Add this certification to my LinkedIn profile')
).toBeVisible();
await expect(
page.getByText('Share this certification on Twitter')
).toBeVisible();
test('should render and display LinkedIn and Twitter buttons', async () => {
await expect(page.getByTestId('linkedin-share-btn')).toBeVisible();
await expect(page.getByTestId('twitter-share-btn')).toBeVisible();
});
});