wip: trying to make tests work
This commit is contained in:
parent
d70b7d6dd5
commit
ba571cda61
@ -16,14 +16,14 @@ import {
|
|||||||
} from '@vue/runtime-test'
|
} from '@vue/runtime-test'
|
||||||
|
|
||||||
describe('Fragments', () => {
|
describe('Fragments', () => {
|
||||||
it('should allow returning multiple component root nodes', () => {
|
it('should allow returning multiple component root nodes', async () => {
|
||||||
class App extends Component {
|
class App extends Component {
|
||||||
render() {
|
render() {
|
||||||
return [h('div', 'one'), 'two']
|
return [h('div', 'one'), 'two']
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const root = nodeOps.createElement('div')
|
const root = nodeOps.createElement('div')
|
||||||
render(h(App), root)
|
await render(h(App), root)
|
||||||
expect(serialize(root)).toBe(`<div><div>one</div>two</div>`)
|
expect(serialize(root)).toBe(`<div><div>one</div>two</div>`)
|
||||||
expect(root.children.length).toBe(2)
|
expect(root.children.length).toBe(2)
|
||||||
expect(root.children[0]).toMatchObject({
|
expect(root.children[0]).toMatchObject({
|
||||||
@ -40,14 +40,14 @@ describe('Fragments', () => {
|
|||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
it('should be able to explicitly create fragments', () => {
|
it('should be able to explicitly create fragments', async () => {
|
||||||
class App extends Component {
|
class App extends Component {
|
||||||
render() {
|
render() {
|
||||||
return h('div', [h(Fragment, [h('div', 'one'), 'two'])])
|
return h('div', [h(Fragment, [h('div', 'one'), 'two'])])
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const root = nodeOps.createElement('div')
|
const root = nodeOps.createElement('div')
|
||||||
render(h(App), root)
|
await render(h(App), root)
|
||||||
const parent = root.children[0] as TestElement
|
const parent = root.children[0] as TestElement
|
||||||
expect(serialize(parent)).toBe(`<div><div>one</div>two</div>`)
|
expect(serialize(parent)).toBe(`<div><div>one</div>two</div>`)
|
||||||
})
|
})
|
||||||
@ -65,7 +65,7 @@ describe('Fragments', () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
const root = nodeOps.createElement('div')
|
const root = nodeOps.createElement('div')
|
||||||
render(h(App), root)
|
await render(h(App), root)
|
||||||
|
|
||||||
expect(serialize(root)).toBe(`<div><div>one</div>two</div>`)
|
expect(serialize(root)).toBe(`<div><div>one</div>two</div>`)
|
||||||
|
|
||||||
@ -84,7 +84,7 @@ describe('Fragments', () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
const root = nodeOps.createElement('div')
|
const root = nodeOps.createElement('div')
|
||||||
render(h(App), root)
|
await await render(h(App), root)
|
||||||
|
|
||||||
expect(serialize(root)).toBe(`<div><div>one</div>two</div>`)
|
expect(serialize(root)).toBe(`<div><div>one</div>two</div>`)
|
||||||
|
|
||||||
@ -103,7 +103,7 @@ describe('Fragments', () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
const root = nodeOps.createElement('div')
|
const root = nodeOps.createElement('div')
|
||||||
render(h(App), root)
|
await render(h(App), root)
|
||||||
|
|
||||||
expect(serialize(root)).toBe(`<div><div>one</div><div>two</div></div>`)
|
expect(serialize(root)).toBe(`<div><div>one</div><div>two</div></div>`)
|
||||||
|
|
||||||
@ -138,7 +138,7 @@ describe('Fragments', () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
const root = nodeOps.createElement('div')
|
const root = nodeOps.createElement('div')
|
||||||
render(h(App), root)
|
await render(h(App), root)
|
||||||
const parent = root.children[0] as TestElement
|
const parent = root.children[0] as TestElement
|
||||||
|
|
||||||
expect(serialize(parent)).toBe(
|
expect(serialize(parent)).toBe(
|
||||||
@ -179,7 +179,7 @@ describe('Fragments', () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const root = nodeOps.createElement('div')
|
const root = nodeOps.createElement('div')
|
||||||
render(h(App), root)
|
await render(h(App), root)
|
||||||
|
|
||||||
expect(serialize(root)).toBe(
|
expect(serialize(root)).toBe(
|
||||||
`<div><div>outer</div><div>one</div><div>two</div></div>`
|
`<div><div>outer</div><div>one</div><div>two</div></div>`
|
||||||
|
@ -109,7 +109,8 @@ export interface ComponentInstance<P = {}, D = {}>
|
|||||||
// actual implementation of the component
|
// actual implementation of the component
|
||||||
class InternalComponent implements PublicInstanceMethods {
|
class InternalComponent implements PublicInstanceMethods {
|
||||||
get $el(): any {
|
get $el(): any {
|
||||||
return this.$vnode && this.$vnode.el
|
const el = this.$vnode && this.$vnode.el
|
||||||
|
return typeof el === 'function' ? (el as any)() : el
|
||||||
}
|
}
|
||||||
|
|
||||||
$vnode: VNode | null = null
|
$vnode: VNode | null = null
|
||||||
|
@ -227,16 +227,12 @@ export function createRenderer(options: RendererOptions) {
|
|||||||
if (vnode.flags & VNodeFlags.COMPONENT_STATEFUL_KEPT_ALIVE) {
|
if (vnode.flags & VNodeFlags.COMPONENT_STATEFUL_KEPT_ALIVE) {
|
||||||
// kept-alive
|
// kept-alive
|
||||||
activateComponentInstance(vnode, container, endNode)
|
activateComponentInstance(vnode, container, endNode)
|
||||||
} else {
|
|
||||||
if (__JSDOM__) {
|
|
||||||
mountComponentInstance(vnode, container, isSVG, endNode)
|
|
||||||
} else {
|
} else {
|
||||||
queueJob(() => {
|
queueJob(() => {
|
||||||
mountComponentInstance(vnode, container, isSVG, endNode)
|
mountComponentInstance(vnode, container, isSVG, endNode)
|
||||||
}, flushHooks)
|
}, flushHooks)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
function mountFunctionalComponent(
|
function mountFunctionalComponent(
|
||||||
vnode: VNode,
|
vnode: VNode,
|
||||||
@ -1441,7 +1437,6 @@ export function createRenderer(options: RendererOptions) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
return nextTick(() => {
|
return nextTick(() => {
|
||||||
debugger
|
|
||||||
return vnode && vnode.flags & VNodeFlags.COMPONENT_STATEFUL
|
return vnode && vnode.flags & VNodeFlags.COMPONENT_STATEFUL
|
||||||
? (vnode.children as ComponentInstance).$proxy
|
? (vnode.children as ComponentInstance).$proxy
|
||||||
: null
|
: null
|
||||||
|
@ -17,7 +17,7 @@ import {
|
|||||||
} from '../src'
|
} from '../src'
|
||||||
|
|
||||||
describe('test renderer', () => {
|
describe('test renderer', () => {
|
||||||
it('should work', () => {
|
it('should work', async () => {
|
||||||
class App extends Component {
|
class App extends Component {
|
||||||
render() {
|
render() {
|
||||||
return h(
|
return h(
|
||||||
@ -30,7 +30,7 @@ describe('test renderer', () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
const root = nodeOps.createElement('div')
|
const root = nodeOps.createElement('div')
|
||||||
render(h(App), root)
|
await render(h(App), root)
|
||||||
|
|
||||||
expect(root.children.length).toBe(1)
|
expect(root.children.length).toBe(1)
|
||||||
|
|
||||||
@ -64,7 +64,7 @@ describe('test renderer', () => {
|
|||||||
const root = nodeOps.createElement('div')
|
const root = nodeOps.createElement('div')
|
||||||
|
|
||||||
resetOps()
|
resetOps()
|
||||||
render(h(App), root)
|
await render(h(App), root)
|
||||||
const ops = dumpOps()
|
const ops = dumpOps()
|
||||||
|
|
||||||
expect(ops.length).toBe(5)
|
expect(ops.length).toBe(5)
|
||||||
@ -126,7 +126,7 @@ describe('test renderer', () => {
|
|||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
it('should be able to serialize nodes', () => {
|
it('should be able to serialize nodes', async () => {
|
||||||
class App extends Component {
|
class App extends Component {
|
||||||
render() {
|
render() {
|
||||||
return h(
|
return h(
|
||||||
@ -139,7 +139,7 @@ describe('test renderer', () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
const root = nodeOps.createElement('div')
|
const root = nodeOps.createElement('div')
|
||||||
render(h(App), root)
|
await render(h(App), root)
|
||||||
expect(serialize(root)).toEqual(
|
expect(serialize(root)).toEqual(
|
||||||
`<div><div id="test"><span>foo</span>hello</div></div>`
|
`<div><div id="test"><span>foo</span>hello</div></div>`
|
||||||
)
|
)
|
||||||
|
@ -63,6 +63,9 @@ export function dumpOps(): NodeOp[] {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function createElement(tag: string): TestElement {
|
function createElement(tag: string): TestElement {
|
||||||
|
if (nodeId === 5) {
|
||||||
|
throw new Error('foo')
|
||||||
|
}
|
||||||
const node: TestElement = {
|
const node: TestElement = {
|
||||||
id: nodeId++,
|
id: nodeId++,
|
||||||
type: NodeTypes.ELEMENT,
|
type: NodeTypes.ELEMENT,
|
||||||
|
@ -61,7 +61,10 @@ export function nextTick<T>(fn?: () => T): Promise<T> {
|
|||||||
nextTickQueue.push(() => {
|
nextTickQueue.push(() => {
|
||||||
resolve(fn ? fn() : undefined)
|
resolve(fn ? fn() : undefined)
|
||||||
})
|
})
|
||||||
pendingRejectors.push(reject)
|
pendingRejectors.push(err => {
|
||||||
|
if (fn) fn()
|
||||||
|
reject(err)
|
||||||
|
})
|
||||||
} else {
|
} else {
|
||||||
resolve(fn ? fn() : undefined)
|
resolve(fn ? fn() : undefined)
|
||||||
}
|
}
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
import { NodeOps } from '@vue/runtime-core'
|
import { NodeOps } from '@vue/runtime-core'
|
||||||
import { nodeOps } from '../../runtime-dom/src/nodeOps'
|
import { nodeOps } from '../../runtime-dom/src/nodeOps'
|
||||||
|
import { nodeOps as testNodeOps } from '../../runtime-test/src/nodeOps'
|
||||||
|
|
||||||
export type Op = [Function, ...any[]]
|
export type Op = [Function, ...any[]]
|
||||||
|
|
||||||
@ -14,7 +15,8 @@ const evaluate = (v: any) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// patch nodeOps to record operations without touching the DOM
|
// patch nodeOps to record operations without touching the DOM
|
||||||
Object.keys(nodeOps).forEach((key: keyof NodeOps) => {
|
function patchOps(nodeOps: NodeOps) {
|
||||||
|
Object.keys(nodeOps).forEach((key: keyof NodeOps) => {
|
||||||
const original = nodeOps[key] as Function
|
const original = nodeOps[key] as Function
|
||||||
if (key === 'querySelector') {
|
if (key === 'querySelector') {
|
||||||
return
|
return
|
||||||
@ -37,4 +39,8 @@ Object.keys(nodeOps).forEach((key: keyof NodeOps) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
patchOps(nodeOps)
|
||||||
|
patchOps(testNodeOps)
|
||||||
|
Loading…
Reference in New Issue
Block a user