test(vapor): apiSetupContext
This commit is contained in:
parent
217e1e6f86
commit
baf68a0fe4
|
@ -2,24 +2,20 @@ import {
|
||||||
createComponent,
|
createComponent,
|
||||||
createSlot,
|
createSlot,
|
||||||
createTextNode,
|
createTextNode,
|
||||||
defineComponent,
|
defineVaporComponent,
|
||||||
delegate,
|
delegate,
|
||||||
delegateEvents,
|
delegateEvents,
|
||||||
insert,
|
insert,
|
||||||
nextTick,
|
|
||||||
reactive,
|
|
||||||
ref,
|
|
||||||
renderEffect,
|
renderEffect,
|
||||||
setDynamicProps,
|
setDynamicProps,
|
||||||
setInheritAttrs,
|
|
||||||
template,
|
template,
|
||||||
watchEffect,
|
|
||||||
} from '../src'
|
} from '../src'
|
||||||
|
import { nextTick, reactive, ref, watchEffect } from '@vue/runtime-dom'
|
||||||
import { makeRender } from './_utils'
|
import { makeRender } from './_utils'
|
||||||
|
|
||||||
const define = makeRender()
|
const define = makeRender()
|
||||||
|
|
||||||
describe.todo('api: setup context', () => {
|
describe('api: setup context', () => {
|
||||||
it('should expose return values to template render context', () => {
|
it('should expose return values to template render context', () => {
|
||||||
const { html } = define({
|
const { html } = define({
|
||||||
setup() {
|
setup() {
|
||||||
|
@ -49,7 +45,7 @@ describe.todo('api: setup context', () => {
|
||||||
const count = ref(0)
|
const count = ref(0)
|
||||||
let dummy
|
let dummy
|
||||||
|
|
||||||
const Child = defineComponent({
|
const Child = defineVaporComponent({
|
||||||
props: { count: Number },
|
props: { count: Number },
|
||||||
setup(props) {
|
setup(props) {
|
||||||
watchEffect(() => {
|
watchEffect(() => {
|
||||||
|
@ -74,7 +70,7 @@ describe.todo('api: setup context', () => {
|
||||||
it('context.attrs', async () => {
|
it('context.attrs', async () => {
|
||||||
const toggle = ref(true)
|
const toggle = ref(true)
|
||||||
|
|
||||||
const Child = defineComponent({
|
const Child = defineVaporComponent({
|
||||||
inheritAttrs: false,
|
inheritAttrs: false,
|
||||||
setup(props, { attrs }) {
|
setup(props, { attrs }) {
|
||||||
const el = document.createElement('div')
|
const el = document.createElement('div')
|
||||||
|
@ -85,9 +81,9 @@ describe.todo('api: setup context', () => {
|
||||||
|
|
||||||
const { html } = define({
|
const { html } = define({
|
||||||
render: () =>
|
render: () =>
|
||||||
createComponent(Child, () =>
|
createComponent(Child, {
|
||||||
toggle.value ? { id: 'foo' } : { class: 'baz' },
|
$: [() => (toggle.value ? { id: 'foo' } : { class: 'baz' })],
|
||||||
),
|
}),
|
||||||
}).render()
|
}).render()
|
||||||
|
|
||||||
expect(html()).toMatch(`<div id="foo"></div>`)
|
expect(html()).toMatch(`<div id="foo"></div>`)
|
||||||
|
@ -101,15 +97,14 @@ describe.todo('api: setup context', () => {
|
||||||
it('context.attrs in child component slots', async () => {
|
it('context.attrs in child component slots', async () => {
|
||||||
const toggle = ref(true)
|
const toggle = ref(true)
|
||||||
|
|
||||||
const Wrapper = defineComponent({
|
const Wrapper = defineVaporComponent({
|
||||||
setup(_) {
|
setup(_) {
|
||||||
const n0 = createSlot('default')
|
const n0 = createSlot('default')
|
||||||
setInheritAttrs(true)
|
|
||||||
return n0
|
return n0
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
const Child = defineComponent({
|
const Child = defineVaporComponent({
|
||||||
inheritAttrs: false,
|
inheritAttrs: false,
|
||||||
setup(_: any, { attrs }: any) {
|
setup(_: any, { attrs }: any) {
|
||||||
const n0 = createComponent(Wrapper, null, {
|
const n0 = createComponent(Wrapper, null, {
|
||||||
|
@ -125,9 +120,9 @@ describe.todo('api: setup context', () => {
|
||||||
|
|
||||||
const { html } = define({
|
const { html } = define({
|
||||||
render: () =>
|
render: () =>
|
||||||
createComponent(Child, () =>
|
createComponent(Child, {
|
||||||
toggle.value ? { id: 'foo' } : { class: 'baz' },
|
$: [() => (toggle.value ? { id: 'foo' } : { class: 'baz' })],
|
||||||
),
|
}),
|
||||||
}).render()
|
}).render()
|
||||||
|
|
||||||
expect(html()).toMatch(`<div id="foo"></div>`)
|
expect(html()).toMatch(`<div id="foo"></div>`)
|
||||||
|
@ -141,7 +136,7 @@ describe.todo('api: setup context', () => {
|
||||||
it('context.slots', async () => {
|
it('context.slots', async () => {
|
||||||
const id = ref('foo')
|
const id = ref('foo')
|
||||||
|
|
||||||
const Child = defineComponent({
|
const Child = defineVaporComponent({
|
||||||
render() {
|
render() {
|
||||||
return [createSlot('foo'), createSlot('bar')]
|
return [createSlot('foo'), createSlot('bar')]
|
||||||
},
|
},
|
||||||
|
@ -149,16 +144,18 @@ describe.todo('api: setup context', () => {
|
||||||
|
|
||||||
const { html } = define({
|
const { html } = define({
|
||||||
render() {
|
render() {
|
||||||
return createComponent(Child, null, [
|
return createComponent(Child, null, {
|
||||||
() => ({
|
$: [
|
||||||
name: 'foo',
|
() => ({
|
||||||
fn: () => createTextNode(() => [id.value]),
|
name: 'foo',
|
||||||
}),
|
fn: () => createTextNode(() => [id.value]),
|
||||||
() => ({
|
}),
|
||||||
name: 'bar',
|
() => ({
|
||||||
fn: () => createTextNode(['bar']),
|
name: 'bar',
|
||||||
}),
|
fn: () => createTextNode(['bar']),
|
||||||
])
|
}),
|
||||||
|
],
|
||||||
|
})
|
||||||
},
|
},
|
||||||
}).render()
|
}).render()
|
||||||
|
|
||||||
|
@ -175,7 +172,7 @@ describe.todo('api: setup context', () => {
|
||||||
|
|
||||||
delegateEvents('click')
|
delegateEvents('click')
|
||||||
|
|
||||||
const Child = defineComponent({
|
const Child = defineVaporComponent({
|
||||||
props: {
|
props: {
|
||||||
count: { type: Number, default: 1 },
|
count: { type: Number, default: 1 },
|
||||||
},
|
},
|
||||||
|
|
|
@ -17,7 +17,6 @@ import {
|
||||||
template,
|
template,
|
||||||
} from '../src'
|
} from '../src'
|
||||||
import { makeRender } from './_utils'
|
import { makeRender } from './_utils'
|
||||||
import type { RawProps } from '../src/componentProps'
|
|
||||||
|
|
||||||
const define = makeRender<any>()
|
const define = makeRender<any>()
|
||||||
|
|
||||||
|
@ -468,7 +467,7 @@ describe('component: props', () => {
|
||||||
define(() =>
|
define(() =>
|
||||||
createComponent(Comp, {
|
createComponent(Comp, {
|
||||||
$: [() => (passFoo.value ? { foo: 'ok' } : {})],
|
$: [() => (passFoo.value ? { foo: 'ok' } : {})],
|
||||||
} as RawProps),
|
}),
|
||||||
).render()
|
).render()
|
||||||
|
|
||||||
expect(initialKeys).toMatchObject(['foo'])
|
expect(initialKeys).toMatchObject(['foo'])
|
||||||
|
|
Loading…
Reference in New Issue