Skip to content

Commit e24dbee

Browse files
hi-ogawahi-ogawa
committed
test: wip browser mode
1 parent 2b47c4d commit e24dbee

File tree

5 files changed

+218
-73
lines changed

5 files changed

+218
-73
lines changed

‎test/browser/fixtures/aria-snapshot/__snapshots__/basic.test.ts.snap‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
2+
3+
exports[`toMatchAriaSnapshot simple 1`] = `
4+
- main:
5+
- heading [level=1]: Dashboard
6+
- navigation "Actions":
7+
- button: Save
8+
- button: Cancel
9+
`;

‎test/browser/fixtures/aria-snapshot/basic.test.ts‎

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
import { expect, test, } from 'vitest'
2+
import { server, page } from 'vitest/browser'
3+
4+
test('toMatchAriaSnapshot simple', () => {
5+
document.body.innerHTML = `
6+
<main>
7+
<h1>Dashboard</h1>
8+
<nav aria-label="Actions">
9+
<button>Save</button>
10+
<button>Cancel</button>
11+
</nav>
12+
</main>
13+
`
14+
expect(document.body).toMatchAriaSnapshot()
15+
})
16+
17+
test('toMatchAriaInlineSnapshot simple', () => {
18+
document.body.innerHTML = `
19+
<button aria-label="User 42">Profile</button>
20+
<p>You have 7 notifications</p>
21+
`
22+
// manually updated regex pattern from "User 42" to /User \\d+/
23+
expect(document.body).toMatchAriaInlineSnapshot(`
24+
- button /User \\d+/: Profile
25+
- paragraph: You have 7 notifications
26+
`)
27+
})
28+
29+
// NOTE: webkit async stack traces is poor. should be fixed on next playwright/webkit release.
30+
test.skipIf(server.browser === 'webkit')('poll aria once', async () => {
31+
await expect.poll(async () => {
32+
document.body.innerHTML = `<p>poll once</p>`
33+
return document.body
34+
}).toMatchAriaInlineSnapshot(`- paragraph: poll once`)
35+
})
36+
37+
test.skipIf(server.browser === 'webkit')('expect.element aria once', async () => {
38+
document.body.innerHTML = `
39+
<main>
40+
<h1>Dashboard</h1>
41+
<nav data-testid="nav">
42+
<button>Save</button>
43+
<button>Cancel</button>
44+
</nav>
45+
</main>
46+
`
47+
await expect.element(page.getByTestId('nav')).toMatchAriaInlineSnapshot(`
48+
- button: Save
49+
- button: Cancel
50+
`)
51+
})
52+
53+
test.skipIf(server.browser === 'webkit')('expect.element aria retry', async () => {
54+
document.body.innerHTML = `
55+
<main>
56+
<h1>Dashboard</h1>
57+
</main>
58+
`
59+
setTimeout(() => {
60+
document.body.innerHTML = `
61+
<main>
62+
<h1>Dashboard</h1>
63+
<nav data-testid="nav">
64+
<button>Save</button>
65+
<button>Cancel</button>
66+
</nav>
67+
</main>
68+
`
69+
}, 100)
70+
await expect.element(page.getByTestId('nav')).toMatchAriaInlineSnapshot(`
71+
- button: Save
72+
- button: Cancel
73+
`)
74+
})

‎test/browser/fixtures/aria-snapshot/vitest.config.ts‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { fileURLToPath } from 'node:url'
2+
import { defineConfig } from 'vitest/config'
3+
import { instances, provider } from '../../settings'
4+
5+
export default defineConfig({
6+
cacheDir: fileURLToPath(new URL('./node_modules/.vite', import.meta.url)),
7+
test: {
8+
browser: {
9+
enabled: true,
10+
provider,
11+
instances,
12+
},
13+
},
14+
})

‎test/browser/specs/aria-snapshot.test.ts‎

Lines changed: 121 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,121 @@
1+
import { expect, test } from 'vitest'
2+
import { instances, runBrowserTests } from './utils'
3+
4+
// TODO:
5+
// - fix firefox
6+
// - test new and update snapshot scenarios
7+
8+
test.for(instances.map(i => i.browser))('aria snapshot %s', async (browser) => {
9+
const result = await runBrowserTests({
10+
root: './fixtures/aria-snapshot',
11+
project: browser,
12+
})
13+
14+
if (browser === 'webkit') {
15+
expect(result.stderr).toMatchInlineSnapshot(`""`)
16+
expect(result.errorTree()).toMatchInlineSnapshot(`
17+
{
18+
"basic.test.ts": {
19+
"expect.element aria once": "skipped",
20+
"expect.element aria retry": "skipped",
21+
"poll aria once": "skipped",
22+
"toMatchAriaInlineSnapshot simple": "passed",
23+
"toMatchAriaSnapshot simple": "passed",
24+
},
25+
}
26+
`)
27+
}
28+
else if (browser === 'firefox') {
29+
expect(result.stderr).toMatchInlineSnapshot(`
30+
"
31+
⎯⎯⎯⎯⎯⎯⎯ Failed Tests 2 ⎯⎯⎯⎯⎯⎯⎯
32+
33+
FAIL |firefox| basic.test.ts > expect.element aria once
34+
Error: toMatchDomainInlineSnapshot with different snapshots cannot be called at the same location
35+
36+
Failure screenshot:
37+
- fixtures/aria-snapshot/__screenshots__/basic.test.ts/expect-element-aria-once-1.png
38+
39+
- Expected
40+
+ Received
41+
42+
43+
- - paragraph: poll once
44+
+ - button: Save
45+
+ - button: Cancel
46+
47+
48+
❯ basic.test.ts:47:48
49+
45| </main>
50+
46| \`
51+
47| await expect.element(page.getByTestId('nav')).toMatchAriaInlineSnaps…
52+
| ^
53+
48| - button: Save
54+
49| - button: Cancel
55+
56+
Caused by: Error: Matcher did not succeed in time.
57+
❯ promise callback* basic.test.ts:47:48
58+
59+
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[1/2]⎯
60+
61+
FAIL |firefox| basic.test.ts > expect.element aria retry
62+
Error: toMatchDomainInlineSnapshot with different snapshots cannot be called at the same location
63+
64+
Failure screenshot:
65+
- fixtures/aria-snapshot/__screenshots__/basic.test.ts/expect-element-aria-retry-1.png
66+
67+
- Expected
68+
+ Received
69+
70+
71+
- - paragraph: poll once
72+
+ - button: Save
73+
+ - button: Cancel
74+
75+
76+
❯ basic.test.ts:70:48
77+
68| \`
78+
69| }, 100)
79+
70| await expect.element(page.getByTestId('nav')).toMatchAriaInlineSnaps…
80+
| ^
81+
71| - button: Save
82+
72| - button: Cancel
83+
84+
Caused by: Error: Matcher did not succeed in time.
85+
❯ promise callback* basic.test.ts:70:48
86+
87+
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[2/2]⎯
88+
89+
"
90+
`)
91+
expect(result.errorTree()).toMatchInlineSnapshot(`
92+
{
93+
"basic.test.ts": {
94+
"expect.element aria once": [
95+
"toMatchDomainInlineSnapshot with different snapshots cannot be called at the same location",
96+
],
97+
"expect.element aria retry": [
98+
"toMatchDomainInlineSnapshot with different snapshots cannot be called at the same location",
99+
],
100+
"poll aria once": "passed",
101+
"toMatchAriaInlineSnapshot simple": "passed",
102+
"toMatchAriaSnapshot simple": "passed",
103+
},
104+
}
105+
`)
106+
}
107+
else {
108+
expect(result.stderr).toMatchInlineSnapshot(`""`)
109+
expect(result.errorTree()).toMatchInlineSnapshot(`
110+
{
111+
"basic.test.ts": {
112+
"expect.element aria once": "passed",
113+
"expect.element aria retry": "passed",
114+
"poll aria once": "passed",
115+
"toMatchAriaInlineSnapshot simple": "passed",
116+
"toMatchAriaSnapshot simple": "passed",
117+
},
118+
}
119+
`)
120+
}
121+
})

‎test/browser/test/snapshot.test.ts‎

Lines changed: 0 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { expect, test } from 'vitest'
2-
import { page, server } from 'vitest/browser'
32

43
test('inline snapshot', () => {
54
expect(1).toMatchInlineSnapshot('1')
@@ -21,75 +20,3 @@ test('vitest attribute is hidden', () => {
2120
<div />
2221
`)
2322
})
24-
25-
test('toMatchAriaSnapshot simple', () => {
26-
document.body.innerHTML = `
27-
<main>
28-
<h1>Dashboard</h1>
29-
<nav aria-label="Actions">
30-
<button>Save</button>
31-
<button>Cancel</button>
32-
</nav>
33-
</main>
34-
`
35-
expect(document.body).toMatchAriaSnapshot()
36-
})
37-
38-
test('toMatchAriaInlineSnapshot simple', () => {
39-
document.body.innerHTML = `
40-
<button aria-label="User 42">Profile</button>
41-
<p>You have 7 notifications</p>
42-
`
43-
// manually updated regex pattern from "User 42" to /User \\d+/
44-
expect(document.body).toMatchAriaInlineSnapshot(`
45-
- button /User \\d+/: Profile
46-
- paragraph: You have 7 notifications
47-
`)
48-
})
49-
50-
// NOTE: webkit async stack traces is poor. should be fixed on next playwright/webkit release.
51-
test.skipIf(server.browser === 'webkit')('poll aria once', async () => {
52-
await expect.poll(async () => {
53-
document.body.innerHTML = `<p>poll once</p>`
54-
return document.body
55-
}).toMatchAriaInlineSnapshot(`- paragraph: poll once`)
56-
})
57-
58-
test.skipIf(server.browser === 'webkit')('expect.element aria once', async () => {
59-
document.body.innerHTML = `
60-
<main>
61-
<h1>Dashboard</h1>
62-
<nav data-testid="nav">
63-
<button>Save</button>
64-
<button>Cancel</button>
65-
</nav>
66-
</main>
67-
`
68-
await expect.element(page.getByTestId('nav')).toMatchAriaInlineSnapshot(`
69-
- button: Save
70-
- button: Cancel
71-
`)
72-
})
73-
74-
test.skipIf(server.browser === 'webkit')('expect.element aria retry', async () => {
75-
document.body.innerHTML = `
76-
<main>
77-
<h1>Dashboard</h1>
78-
</main>
79-
`
80-
setTimeout(() => {
81-
document.body.innerHTML = `
82-
<main>
83-
<h1>Dashboard</h1>
84-
<nav data-testid="nav">
85-
<button>Save</button>
86-
<button>Cancel</button>
87-
</nav>
88-
</main>
89-
`
90-
}, 100)
91-
await expect.element(page.getByTestId('nav')).toMatchAriaInlineSnapshot(`
92-
- button: Save
93-
- button: Cancel
94-
`)
95-
})

0 commit comments

Comments
 (0)