root
/
vue3-core
mirror of https://github.com/vuejs/core.git
1
0
Fork 0
Code Issues Actions 10 Packages Projects Releases Wiki Activity

wip(vitest-migration): all tests passing

This commit is contained in:
Evan You 2023-01-26 22:22:43 +08:00
parent 4ee0dad0fe
commit 158db33611
12 changed files with 94 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
packages/vue/__tests__/Transition.spec.ts → packages/vue/__tests__/e2e/Transition.spec.ts
View File

@ -21,15 +21,30 @@ describe('e2e: Transition', () => {
}) })
}) })
beforeEach(async () => { // beforeEach(async () => {
// await page().goto(baseUrl)
// await page().waitForSelector('#app')
// })
// workaround for https://github.com/vitest-dev/vitest/issues/2756
function runTest(desc: string, runner: any, timeout?: number) {
test(
desc,
async () => {
await page().goto(baseUrl) await page().goto(baseUrl)
await page().waitForSelector('#app') await page().waitForSelector('#app')
}) await runner()
},
timeout
)
}
describe('transition with v-if', () => { describe('transition with v-if', () => {
test( runTest(
'basic transition', 'basic transition',
async () => { async () => {
await page().goto(baseUrl)
await page().waitForSelector('#app')
await page().evaluate(() => { await page().evaluate(() => {
const { createApp, ref } = (window as any).Vue const { createApp, ref } = (window as any).Vue
createApp({ createApp({
@ -83,7 +98,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'named transition', 'named transition',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -139,7 +154,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'custom transition classes', 'custom transition classes',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -200,7 +215,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'transition with dynamic name', 'transition with dynamic name',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -262,7 +277,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'transition events without appear', 'transition events without appear',
async () => { async () => {
const beforeLeaveSpy = vi.fn() const beforeLeaveSpy = vi.fn()
@ -366,7 +381,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'events with arguments', 'events with arguments',
async () => { async () => {
const beforeLeaveSpy = vi.fn() const beforeLeaveSpy = vi.fn()
@ -482,7 +497,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test('onEnterCancelled', async () => { runTest('onEnterCancelled', async () => {
const enterCancelledSpy = vi.fn() const enterCancelledSpy = vi.fn()
await page().exposeFunction('enterCancelledSpy', enterCancelledSpy) await page().exposeFunction('enterCancelledSpy', enterCancelledSpy)
@ -544,7 +559,7 @@ describe('e2e: Transition', () => {
expect(await html('#container')).toBe('<!--v-if-->') expect(await html('#container')).toBe('<!--v-if-->')
}) })
test( runTest(
'transition on appear', 'transition on appear',
async () => { async () => {
const appearClass = await page().evaluate(async () => { const appearClass = await page().evaluate(async () => {
@ -620,7 +635,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'transition events with appear', 'transition events with appear',
async () => { async () => {
const onLeaveSpy = vi.fn() const onLeaveSpy = vi.fn()
@ -768,7 +783,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'css: false', 'css: false',
async () => { async () => {
const onBeforeEnterSpy = vi.fn() const onBeforeEnterSpy = vi.fn()
@ -846,7 +861,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'no transition detected', 'no transition detected',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -888,7 +903,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'animations', 'animations',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -940,7 +955,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'explicit transition type', 'explicit transition type',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -1010,7 +1025,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'transition on SVG elements', 'transition on SVG elements',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -1081,7 +1096,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'custom transition higher-order component', 'custom transition higher-order component',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -1138,7 +1153,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'transition on child components with empty root node', 'transition on child components with empty root node',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -1217,7 +1232,7 @@ describe('e2e: Transition', () => {
describe('transition with Suspense', () => { describe('transition with Suspense', () => {
// #1583 // #1583
test( runTest(
'async component transition inside Suspense', 'async component transition inside Suspense',
async () => { async () => {
const onLeaveSpy = vi.fn() const onLeaveSpy = vi.fn()
@ -1311,7 +1326,7 @@ describe('e2e: Transition', () => {
) )
// #1689 // #1689
test( runTest(
'static node transition inside Suspense', 'static node transition inside Suspense',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -1369,7 +1384,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'out-in mode with Suspense', 'out-in mode with Suspense',
async () => { async () => {
const onLeaveSpy = vi.fn() const onLeaveSpy = vi.fn()
@ -1436,7 +1451,7 @@ describe('e2e: Transition', () => {
) )
// #3963 // #3963
test( runTest(
'Suspense fallback should work with transition', 'Suspense fallback should work with transition',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -1500,7 +1515,7 @@ describe('e2e: Transition', () => {
}) })
describe('transition with v-show', () => { describe('transition with v-show', () => {
test( runTest(
'named transition with v-show', 'named transition with v-show',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -1559,7 +1574,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'transition events with v-show', 'transition events with v-show',
async () => { async () => {
const beforeLeaveSpy = vi.fn() const beforeLeaveSpy = vi.fn()
@ -1665,7 +1680,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'onLeaveCancelled (v-show only)', 'onLeaveCancelled (v-show only)',
async () => { async () => {
const onLeaveCancelledSpy = vi.fn() const onLeaveCancelledSpy = vi.fn()
@ -1727,7 +1742,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'transition on appear with v-show', 'transition on appear with v-show',
async () => { async () => {
const beforeEnterSpy = vi.fn() const beforeEnterSpy = vi.fn()
@ -1833,7 +1848,7 @@ describe('e2e: Transition', () => {
) )
// #4845 // #4845
test( runTest(
'transition events should not call onEnter with v-show false', 'transition events should not call onEnter with v-show false',
async () => { async () => {
const beforeEnterSpy = vi.fn() const beforeEnterSpy = vi.fn()
@ -1907,7 +1922,7 @@ describe('e2e: Transition', () => {
}) })
describe('explicit durations', () => { describe('explicit durations', () => {
test( runTest(
'single value', 'single value',
async () => { async () => {
await page().evaluate(duration => { await page().evaluate(duration => {
@ -1963,7 +1978,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'enter with explicit durations', 'enter with explicit durations',
async () => { async () => {
await page().evaluate(duration => { await page().evaluate(duration => {
@ -2019,7 +2034,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'leave with explicit durations', 'leave with explicit durations',
async () => { async () => {
await page().evaluate(duration => { await page().evaluate(duration => {
@ -2075,7 +2090,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'separate enter and leave', 'separate enter and leave',
async () => { async () => {
await page().evaluate(duration => { await page().evaluate(duration => {
@ -2134,7 +2149,7 @@ describe('e2e: Transition', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'warn invalid durations', 'warn invalid durations',
async () => { async () => {
createApp({ createApp({
@ -2172,7 +2187,7 @@ describe('e2e: Transition', () => {
) )
}) })
test('warn when used on multiple elements', async () => { runTest('warn when used on multiple elements', async () => {
createApp({ createApp({
render() { render() {
return h(Transition, null, { return h(Transition, null, {
@ -2185,7 +2200,7 @@ describe('e2e: Transition', () => {
).toHaveBeenWarned() ).toHaveBeenWarned()
}) })
test('warn when invalid transition mode', () => { runTest('warn when invalid transition mode', () => {
createApp({ createApp({
template: ` template: `
<div id="container"> <div id="container">
@ -2199,7 +2214,7 @@ describe('e2e: Transition', () => {
}) })
// #3227 // #3227
test(`HOC w/ merged hooks`, async () => { runTest(`HOC w/ merged hooks`, async () => {
const innerSpy = vi.fn() const innerSpy = vi.fn()
const outerSpy = vi.fn() const outerSpy = vi.fn()
@ -2238,7 +2253,7 @@ describe('e2e: Transition', () => {
expect(root.innerHTML).toBe(`<!---->`) expect(root.innerHTML).toBe(`<!---->`)
}) })
test( runTest(
'should work with dev root fragment', 'should work with dev root fragment',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {

33
packages/vue/__tests__/TransitionGroup.spec.ts → packages/vue/__tests__/e2e/TransitionGroup.spec.ts
View File

@ -20,12 +20,25 @@ describe('e2e: TransitionGroup', () => {
const transitionFinish = (time = duration) => timeout(time + buffer) const transitionFinish = (time = duration) => timeout(time + buffer)
beforeEach(async () => { // beforeEach(async () => {
// await page().goto(baseUrl)
// await page().waitForSelector('#app')
// })
// workaround for https://github.com/vitest-dev/vitest/issues/2756
function runTest(desc: string, runner: any, timeout?: number) {
test(
desc,
async () => {
await page().goto(baseUrl) await page().goto(baseUrl)
await page().waitForSelector('#app') await page().waitForSelector('#app')
}) await runner()
},
timeout
)
}
test( runTest(
'enter', 'enter',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -79,7 +92,7 @@ describe('e2e: TransitionGroup', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'leave', 'leave',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -123,7 +136,7 @@ describe('e2e: TransitionGroup', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'enter + leave', 'enter + leave',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -173,7 +186,7 @@ describe('e2e: TransitionGroup', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'appear', 'appear',
async () => { async () => {
const appearHtml = await page().evaluate(() => { const appearHtml = await page().evaluate(() => {
@ -248,7 +261,7 @@ describe('e2e: TransitionGroup', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'move', 'move',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -298,7 +311,7 @@ describe('e2e: TransitionGroup', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'dynamic name', 'dynamic name',
async () => { async () => {
await page().evaluate(() => { await page().evaluate(() => {
@ -357,7 +370,7 @@ describe('e2e: TransitionGroup', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test( runTest(
'events', 'events',
async () => { async () => {
const onLeaveSpy = vi.fn() const onLeaveSpy = vi.fn()
@ -494,7 +507,7 @@ describe('e2e: TransitionGroup', () => {
E2E_TIMEOUT E2E_TIMEOUT
) )
test('warn unkeyed children', () => { runTest('warn unkeyed children', () => {
createApp({ createApp({
template: ` template: `
<transition-group name="test"> <transition-group name="test">

0
packages/vue/examples/__tests__/commits.mock.ts → packages/vue/__tests__/e2e/commits.mock.ts
View File

4
packages/vue/examples/__tests__/commits.spec.ts → packages/vue/__tests__/e2e/commits.spec.ts
View File

@ -1,5 +1,5 @@
import path from 'path' import path from 'path'
import { setupPuppeteer, E2E_TIMEOUT } from '../../__tests__/e2eUtils' import { setupPuppeteer, E2E_TIMEOUT } from './e2eUtils'
import mocks from './commits.mock' import mocks from './commits.mock'
describe('e2e: commits', () => { describe('e2e: commits', () => {
@ -8,7 +8,7 @@ describe('e2e: commits', () => {
async function testCommits(apiType: 'classic' | 'composition') { async function testCommits(apiType: 'classic' | 'composition') {
const baseUrl = `file://${path.resolve( const baseUrl = `file://${path.resolve(
__dirname, __dirname,
`../${apiType}/commits.html` `../../examples/${apiType}/commits.html`
)}` )}`
// intercept and mock the response to avoid hitting the actual API // intercept and mock the response to avoid hitting the actual API

0
packages/vue/__tests__/e2eUtils.ts → packages/vue/__tests__/e2e/e2eUtils.ts
View File

4
packages/vue/examples/__tests__/grid.spec.ts → packages/vue/__tests__/e2e/grid.spec.ts
View File

@ -1,5 +1,5 @@
import path from 'path' import path from 'path'
import { setupPuppeteer, E2E_TIMEOUT } from '../../__tests__/e2eUtils' import { setupPuppeteer, E2E_TIMEOUT } from './e2eUtils'
interface TableData { interface TableData {
name: string name: string
@ -24,7 +24,7 @@ describe('e2e: grid', () => {
async function testGrid(apiType: 'classic' | 'composition') { async function testGrid(apiType: 'classic' | 'composition') {
const baseUrl = `file://${path.resolve( const baseUrl = `file://${path.resolve(
__dirname, __dirname,
`../${apiType}/grid.html` `../../examples/${apiType}/grid.html`
)}` )}`
await page().goto(baseUrl) await page().goto(baseUrl)

8
packages/vue/examples/__tests__/markdown.spec.ts → packages/vue/__tests__/e2e/markdown.spec.ts
View File

@ -1,9 +1,5 @@
import path from 'path' import path from 'path'
import { import { setupPuppeteer, expectByPolling, E2E_TIMEOUT } from './e2eUtils'
setupPuppeteer,
expectByPolling,
E2E_TIMEOUT
} from '../../__tests__/e2eUtils'
describe('e2e: markdown', () => { describe('e2e: markdown', () => {
const { page, isVisible, value, html } = setupPuppeteer() const { page, isVisible, value, html } = setupPuppeteer()
@ -11,7 +7,7 @@ describe('e2e: markdown', () => {
async function testMarkdown(apiType: 'classic' | 'composition') { async function testMarkdown(apiType: 'classic' | 'composition') {
const baseUrl = `file://${path.resolve( const baseUrl = `file://${path.resolve(
__dirname, __dirname,
`../${apiType}/markdown.html#test` `../../examples/${apiType}/markdown.html#test`
)}` )}`
await page().goto(baseUrl) await page().goto(baseUrl)

4
packages/vue/examples/__tests__/svg.spec.ts → packages/vue/__tests__/e2e/svg.spec.ts
View File

@ -1,5 +1,5 @@
import path from 'path' import path from 'path'
import { setupPuppeteer, E2E_TIMEOUT } from '../../__tests__/e2eUtils' import { setupPuppeteer, E2E_TIMEOUT } from './e2eUtils'
declare const globalStats: { declare const globalStats: {
label: string label: string
@ -73,7 +73,7 @@ describe('e2e: svg', () => {
async function testSvg(apiType: 'classic' | 'composition') { async function testSvg(apiType: 'classic' | 'composition') {
const baseUrl = `file://${path.resolve( const baseUrl = `file://${path.resolve(
__dirname, __dirname,
`../${apiType}/svg.html` `../../examples/${apiType}/svg.html`
)}` )}`
await page().goto(baseUrl) await page().goto(baseUrl)

4
packages/vue/examples/__tests__/todomvc.spec.ts → packages/vue/__tests__/e2e/todomvc.spec.ts
View File

@ -1,5 +1,5 @@
import path from 'path' import path from 'path'
import { setupPuppeteer, E2E_TIMEOUT } from '../../__tests__/e2eUtils' import { setupPuppeteer, E2E_TIMEOUT } from './e2eUtils'
describe('e2e: todomvc', () => { describe('e2e: todomvc', () => {
const { const {
@ -26,7 +26,7 @@ describe('e2e: todomvc', () => {
async function testTodomvc(apiType: 'classic' | 'composition') { async function testTodomvc(apiType: 'classic' | 'composition') {
const baseUrl = `file://${path.resolve( const baseUrl = `file://${path.resolve(
__dirname, __dirname,
`../${apiType}/todomvc.html` `../../examples/${apiType}/todomvc.html`
)}` )}`
await page().goto(baseUrl) await page().goto(baseUrl)

2
packages/vue/__tests__/transition.html → packages/vue/__tests__/e2e/transition.html
View File

@ -1,4 +1,4 @@
<script src="../dist/vue.global.js"></script> <script src="../../dist/vue.global.js"></script>
<div id="app"></div> <div id="app"></div>
<style> <style>

4
packages/vue/examples/__tests__/tree.spec.ts → packages/vue/__tests__/e2e/tree.spec.ts
View File

@ -1,5 +1,5 @@
import path from 'path' import path from 'path'
import { setupPuppeteer, E2E_TIMEOUT } from '../../__tests__/e2eUtils' import { setupPuppeteer, E2E_TIMEOUT } from './e2eUtils'
describe('e2e: tree', () => { describe('e2e: tree', () => {
const { page, click, count, text, children, isVisible } = setupPuppeteer() const { page, click, count, text, children, isVisible } = setupPuppeteer()
@ -7,7 +7,7 @@ describe('e2e: tree', () => {
async function testTree(apiType: 'classic' | 'composition') { async function testTree(apiType: 'classic' | 'composition') {
const baseUrl = `file://${path.resolve( const baseUrl = `file://${path.resolve(
__dirname, __dirname,
`../${apiType}/tree.html` `../../examples/${apiType}/tree.html`
)}` )}`
await page().goto(baseUrl) await page().goto(baseUrl)

4
vitest.config.ts
View File

@ -43,6 +43,8 @@ export default defineConfig({
test: { test: {
globals: true, globals: true,
setupFiles: 'scripts/setupVitest.ts', setupFiles: 'scripts/setupVitest.ts',
environmentMatchGlobs: [['packages/{vue-compat,runtime-dom}/**', 'jsdom']] environmentMatchGlobs: [
['packages/{vue,vue-compat,runtime-dom}/**', 'jsdom']
]
} }
}) })