Skip to content

Commit

Permalink
refactor(e2e): update Text e2e test
Browse files Browse the repository at this point in the history
  • Loading branch information
joshblack committed Aug 12, 2024
1 parent 288ec51 commit aa0efb7
Show file tree
Hide file tree
Showing 7 changed files with 54 additions and 143 deletions.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
187 changes: 49 additions & 138 deletions e2e/components/Text.test.ts
Original file line number Diff line number Diff line change
@@ -1,150 +1,61 @@
import {test, expect} from '@playwright/test'
import {visit} from '../test-helpers/storybook'

const stories = [
{
title: 'Default',
id: 'components-text--default',
},
{
title: 'Small',
id: 'components-text-features--size-small',
},
{
title: 'Medium',
id: 'components-text-features--size-medium',
},
{
title: 'Large',
id: 'components-text-features--size-large',
},
{
title: 'LightWeight',
id: 'components-text-features--light-weight',
},
{
title: 'NormalWeight',
id: 'components-text-features--normal-weight',
},
{
title: 'MediumWeight',
id: 'components-text-features--medium-weight',
},
{
title: 'SemiboldWeight',
id: 'components-text-features--semibold-weight',
},
] as const

// only testing light theme because this component is only concerned with text size and weight

test.describe('Text', () => {
test.describe('Default', () => {
test('default @vrt', async ({page}) => {
await visit(page, {
id: 'components-text--default',
})

// Default state
expect(await page.screenshot()).toMatchSnapshot(`Text.Default.png`)
})

test('axe @aat', async ({page}) => {
await visit(page, {
id: 'components-text--default',
})
await expect(page).toHaveNoViolations()
})
})

test.describe('Small', () => {
test('default @vrt', async ({page}) => {
await visit(page, {
id: 'components-text-features--size-small',
})

// Default state
expect(await page.screenshot()).toMatchSnapshot(`Text.Small.png`)
})

test('axe @aat', async ({page}) => {
await visit(page, {
id: 'components-text-features--size-small',
})
await expect(page).toHaveNoViolations()
})
})
for (const story of stories) {
test.describe(story.title, () => {
test('default @vrt', async ({page}) => {
await visit(page, {
id: story.id,
})

test.describe('Medium', () => {
test('default @vrt', async ({page}) => {
await visit(page, {
id: 'components-text-features--size-medium',
// Default state
expect(await page.screenshot()).toMatchSnapshot(`Text.${story.title}.png`)
})

// Default state
expect(await page.screenshot()).toMatchSnapshot(`Text.Medium.png`)
})

test('axe @aat', async ({page}) => {
await visit(page, {
id: 'components-text-features--size-medium',
})
await expect(page).toHaveNoViolations()
})
})

test.describe('Large', () => {
test('default @vrt', async ({page}) => {
await visit(page, {
id: 'components-text-features--size-large',
})

// Default state
expect(await page.screenshot()).toMatchSnapshot(`Text.Large.png`)
})

test('axe @aat', async ({page}) => {
await visit(page, {
id: 'components-text-features--size-large',
})
await expect(page).toHaveNoViolations()
})
})

test.describe('LightWeight', () => {
test('default @vrt', async ({page}) => {
await visit(page, {
id: 'components-text-features--light-weight',
})

// Default state
expect(await page.screenshot()).toMatchSnapshot(`Text.Light.png`)
})

test('axe @aat', async ({page}) => {
await visit(page, {
id: 'components-text-features--light-weight',
})
await expect(page).toHaveNoViolations()
})
})

test.describe('NormalWeight', () => {
test('default @vrt', async ({page}) => {
await visit(page, {
id: 'components-text-features--normal-weight',
})

// Default state
expect(await page.screenshot()).toMatchSnapshot(`Text.Normal.png`)
})

test('axe @aat', async ({page}) => {
await visit(page, {
id: 'components-text-features--normal-weight',
})
await expect(page).toHaveNoViolations()
})
})

test.describe('MediumWeight', () => {
test('default @vrt', async ({page}) => {
await visit(page, {
id: 'components-text-features--medium-weight',
})

// Default state
expect(await page.screenshot()).toMatchSnapshot(`Text.Medium.png`)
})

test('axe @aat', async ({page}) => {
await visit(page, {
id: 'components-text-features--medium-weight',
})
await expect(page).toHaveNoViolations()
})
})

test.describe('SemiboldWeight', () => {
test('default @vrt', async ({page}) => {
await visit(page, {
id: 'components-text-features--semibold-weight',
})

// Default state
expect(await page.screenshot()).toMatchSnapshot(`Text.Semibold.png`)
})

test('axe @aat', async ({page}) => {
await visit(page, {
id: 'components-text-features--semibold-weight',
test('axe @aat', async ({page}) => {
await visit(page, {
id: story.id,
})
await expect(page).toHaveNoViolations()
})
await expect(page).toHaveNoViolations()
})
})
}
})
10 changes: 5 additions & 5 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit aa0efb7

Please sign in to comment.