vue3-yuanma/packages/compiler-sfc/__tests__/compileScript.spec.ts

919 lines
25 KiB
TypeScript
Raw Normal View History

import { parse, SFCScriptCompileOptions, compileScript } from '../src'
2020-07-09 09:11:57 +08:00
import { parse as babelParse } from '@babel/parser'
import { babelParserDefaultPlugins } from '@vue/shared'
2020-07-09 09:11:57 +08:00
function compile(src: string, options?: SFCScriptCompileOptions) {
const { descriptor } = parse(src)
return compileScript(descriptor, options)
2020-07-09 09:11:57 +08:00
}
function assertCode(code: string) {
// parse the generated code to make sure it is valid
try {
babelParse(code, {
sourceType: 'module',
plugins: [...babelParserDefaultPlugins, 'typescript']
2020-07-09 09:11:57 +08:00
})
} catch (e) {
console.log(code)
throw e
}
expect(code).toMatchSnapshot()
}
describe('SFC compile <script setup>', () => {
test('should expose top level declarations', () => {
const { content } = compile(`
2020-07-09 09:11:57 +08:00
<script setup>
import { x } from './x'
let a = 1
const b = 2
function c() {}
class d {}
2020-07-09 09:11:57 +08:00
</script>
`)
assertCode(content)
2020-11-13 07:11:25 +08:00
expect(content).toMatch('return { a, b, c, d, x }')
})
2020-11-14 06:38:28 +08:00
test('defineOptions()', () => {
2020-11-13 07:11:25 +08:00
const { content, bindings } = compile(`
<script setup>
2020-11-14 06:38:28 +08:00
import { defineOptions } from 'vue'
const { props, emit } = defineOptions({
2020-11-13 07:11:25 +08:00
props: {
foo: String
},
emit: ['a', 'b']
})
const bar = 1
</script>
`)
// should generate working code
assertCode(content)
// should anayze bindings
expect(bindings).toStrictEqual({
foo: 'props',
bar: 'const',
props: 'const',
emit: 'const'
})
2020-11-14 06:38:28 +08:00
// should remove defineOptions import and call
expect(content).not.toMatch('defineOptions')
2020-11-13 07:11:25 +08:00
// should generate correct setup signature
expect(content).toMatch(`setup(__props, { props, emit }) {`)
// should include context options in default export
expect(content).toMatch(`export default {
expose: [],
2020-11-13 07:11:25 +08:00
props: {
foo: String
},
emit: ['a', 'b'],`)
2020-07-09 09:11:57 +08:00
})
describe('imports', () => {
test('should hoist and expose imports', () => {
assertCode(
compile(`<script setup>import { ref } from 'vue'</script>`).content
2020-07-09 09:11:57 +08:00
)
})
test('should extract comment for import or type declarations', () => {
assertCode(
2020-11-13 07:11:25 +08:00
compile(`
<script setup>
import a from 'a' // comment
import b from 'b'
</script>
`).content
2020-07-09 09:11:57 +08:00
)
})
test('dedupe between user & helper', () => {
2020-11-13 07:11:25 +08:00
const { content } = compile(`
<script setup>
import { ref } from 'vue'
ref: foo = 1
</script>
`)
assertCode(content)
expect(content).toMatch(`import { ref } from 'vue'`)
2020-07-09 09:11:57 +08:00
})
test('import dedupe between <script> and <script setup>', () => {
const { content } = compile(`
<script>
import { x } from './x'
</script>
<script setup>
import { x } from './x'
x()
</script>
`)
assertCode(content)
expect(content.indexOf(`import { x }`)).toEqual(
content.lastIndexOf(`import { x }`)
2020-07-09 09:11:57 +08:00
)
})
})
2020-11-13 07:11:25 +08:00
describe('inlineTemplate mode', () => {
test('should work', () => {
const { content } = compile(
`
<script setup>
import { ref } from 'vue'
const count = ref(0)
</script>
<template>
<div>{{ count }}</div>
<div>static</div>
</template>
`,
{ inlineTemplate: true }
)
// check snapshot and make sure helper imports and
// hoists are placed correctly.
assertCode(content)
})
test('avoid unref() when necessary', () => {
// function, const, component import
const { content } = compile(
`
<script setup>
2020-11-14 06:38:28 +08:00
import { ref, defineOptions } from 'vue'
2020-11-13 07:11:25 +08:00
import Foo from './Foo.vue'
import other from './util'
const count = ref(0)
const constant = {}
function fn() {}
</script>
<template>
<Foo/>
<div @click="fn">{{ count }} {{ constant }} {{ other }}</div>
</template>
`,
{ inlineTemplate: true }
)
assertCode(content)
// no need to unref vue component import
expect(content).toMatch(`createVNode(Foo)`)
// should unref other imports
expect(content).toMatch(`unref(other)`)
// no need to unref constant literals
expect(content).not.toMatch(`unref(constant)`)
// should unref const w/ call init (e.g. ref())
expect(content).toMatch(`unref(count)`)
// no need to unref function declarations
expect(content).toMatch(`{ onClick: fn }`)
// no need to mark constant fns in patch flag
expect(content).not.toMatch(`PROPS`)
})
})
describe('with TypeScript', () => {
2020-07-09 09:11:57 +08:00
test('hoist type declarations', () => {
const { content } = compile(`
2020-07-09 09:11:57 +08:00
<script setup lang="ts">
export interface Foo {}
type Bar = {}
</script>`)
assertCode(content)
2020-07-09 09:11:57 +08:00
})
2020-11-14 06:38:28 +08:00
test('defineOptions w/ runtime options', () => {
const { content } = compile(`
2020-11-13 07:11:25 +08:00
<script setup lang="ts">
2020-11-14 06:38:28 +08:00
import { defineOptions } from 'vue'
const { props, emit } = defineOptions({
2020-11-13 07:11:25 +08:00
props: { foo: String },
emits: ['a', 'b']
})
</script>
`)
assertCode(content)
expect(content).toMatch(`export default _defineComponent({
expose: [],
2020-11-13 07:11:25 +08:00
props: { foo: String },
emits: ['a', 'b'],
setup(__props, { props, emit }) {`)
})
2020-11-14 06:38:28 +08:00
test('defineOptions w/ type / extract props', () => {
2020-11-13 07:11:25 +08:00
const { content, bindings } = compile(`
<script setup lang="ts">
2020-11-14 06:38:28 +08:00
import { defineOptions } from 'vue'
interface Test {}
2020-07-09 09:11:57 +08:00
type Alias = number[]
2020-11-14 06:38:28 +08:00
defineOptions<{
2020-11-13 07:11:25 +08:00
props: {
string: string
number: number
boolean: boolean
object: object
objectLiteral: { a: number }
fn: (n: number) => void
functionRef: Function
objectRef: Object
array: string[]
arrayRef: Array<any>
tuple: [number, number]
set: Set<string>
literal: 'foo'
optional?: any
recordRef: Record<string, null>
interface: Test
alias: Alias
union: string | number
literalUnion: 'foo' | 'bar'
literalUnionMixed: 'foo' | 1 | boolean
intersection: Test & {}
}
}>()
</script>`)
assertCode(content)
expect(content).toMatch(`string: { type: String, required: true }`)
expect(content).toMatch(`number: { type: Number, required: true }`)
expect(content).toMatch(`boolean: { type: Boolean, required: true }`)
expect(content).toMatch(`object: { type: Object, required: true }`)
expect(content).toMatch(`objectLiteral: { type: Object, required: true }`)
expect(content).toMatch(`fn: { type: Function, required: true }`)
expect(content).toMatch(`functionRef: { type: Function, required: true }`)
expect(content).toMatch(`objectRef: { type: Object, required: true }`)
expect(content).toMatch(`array: { type: Array, required: true }`)
expect(content).toMatch(`arrayRef: { type: Array, required: true }`)
expect(content).toMatch(`tuple: { type: Array, required: true }`)
expect(content).toMatch(`set: { type: Set, required: true }`)
expect(content).toMatch(`literal: { type: String, required: true }`)
expect(content).toMatch(`optional: { type: null, required: false }`)
expect(content).toMatch(`recordRef: { type: Object, required: true }`)
expect(content).toMatch(`interface: { type: Object, required: true }`)
expect(content).toMatch(`alias: { type: Array, required: true }`)
expect(content).toMatch(
`union: { type: [String, Number], required: true }`
)
expect(content).toMatch(
`literalUnion: { type: [String, String], required: true }`
)
expect(content).toMatch(
`literalUnionMixed: { type: [String, Number, Boolean], required: true }`
)
expect(content).toMatch(`intersection: { type: Object, required: true }`)
2020-11-13 07:11:25 +08:00
expect(bindings).toStrictEqual({
string: 'props',
number: 'props',
boolean: 'props',
object: 'props',
objectLiteral: 'props',
fn: 'props',
functionRef: 'props',
objectRef: 'props',
array: 'props',
arrayRef: 'props',
tuple: 'props',
set: 'props',
literal: 'props',
optional: 'props',
recordRef: 'props',
interface: 'props',
alias: 'props',
union: 'props',
literalUnion: 'props',
literalUnionMixed: 'props',
intersection: 'props'
})
})
2020-11-14 06:38:28 +08:00
test('defineOptions w/ type / extract emits', () => {
const { content } = compile(`
2020-11-13 07:11:25 +08:00
<script setup lang="ts">
2020-11-14 06:38:28 +08:00
import { defineOptions } from 'vue'
const { emit } = defineOptions<{
2020-11-13 07:11:25 +08:00
emit: (e: 'foo' | 'bar') => void
}>()
</script>
`)
assertCode(content)
expect(content).toMatch(`props: {},\n emit: (e: 'foo' | 'bar') => void,`)
expect(content).toMatch(`emits: ["foo", "bar"] as unknown as undefined`)
})
2020-11-14 06:38:28 +08:00
test('defineOptions w/ type / extract emits (union)', () => {
2020-11-13 07:11:25 +08:00
const { content } = compile(`
<script setup lang="ts">
2020-11-14 06:38:28 +08:00
import { defineOptions } from 'vue'
const { emit } = defineOptions<{
2020-11-13 07:11:25 +08:00
emit: ((e: 'foo' | 'bar') => void) | ((e: 'baz', id: number) => void)
}>()
</script>
`)
assertCode(content)
expect(content).toMatch(
2020-11-13 07:11:25 +08:00
`props: {},\n emit: ((e: 'foo' | 'bar') => void) | ((e: 'baz', id: number) => void),`
)
expect(content).toMatch(
`emits: ["foo", "bar", "baz"] as unknown as undefined`
)
})
2020-07-09 09:11:57 +08:00
})
describe('CSS vars injection', () => {
test('<script> w/ no default export', () => {
assertCode(
compile(
`<script>const a = 1</script>\n` +
`<style vars="{ color }">div{ color: var(--color); }</style>`
).content
)
})
test('<script> w/ default export', () => {
assertCode(
compile(
`<script>export default { setup() {} }</script>\n` +
`<style vars="{ color }">div{ color: var(--color); }</style>`
).content
)
})
test('<script> w/ default export in strings/comments', () => {
assertCode(
compile(
`<script>
// export default {}
export default {}
</script>\n` +
`<style vars="{ color }">div{ color: var(--color); }</style>`
).content
)
})
test('w/ <script setup>', () => {
assertCode(
compile(
`<script setup>const color = 'red'</script>\n` +
`<style vars="{ color }">div{ color: var(--color); }</style>`
).content
)
})
})
describe('async/await detection', () => {
function assertAwaitDetection(code: string, shouldAsync = true) {
const { content } = compile(`<script setup>${code}</script>`)
2020-11-13 07:11:25 +08:00
expect(content).toMatch(`${shouldAsync ? `async ` : ``}setup()`)
}
test('expression statement', () => {
assertAwaitDetection(`await foo`)
})
test('variable', () => {
assertAwaitDetection(`const a = 1 + (await foo)`)
})
test('ref', () => {
assertAwaitDetection(`ref: a = 1 + (await foo)`)
})
test('nested statements', () => {
assertAwaitDetection(`if (ok) { await foo } else { await bar }`)
})
test('should ignore await inside functions', () => {
// function declaration
assertAwaitDetection(`async function foo() { await bar }`, false)
// function expression
assertAwaitDetection(`const foo = async () => { await bar }`, false)
// object method
assertAwaitDetection(`const obj = { async method() { await bar }}`, false)
// class method
assertAwaitDetection(
`const cls = class Foo { async method() { await bar }}`,
false
)
})
})
describe('ref: syntax sugar', () => {
test('convert ref declarations', () => {
const { content, bindings } = compile(`<script setup>
ref: foo
ref: a = 1
ref: b = {
count: 0
}
let c = () => {}
let d
</script>`)
expect(content).toMatch(`import { ref as _ref } from 'vue'`)
expect(content).not.toMatch(`ref: foo`)
expect(content).not.toMatch(`ref: a`)
expect(content).not.toMatch(`ref: b`)
expect(content).toMatch(`const foo = _ref()`)
expect(content).toMatch(`const a = _ref(1)`)
expect(content).toMatch(`
const b = _ref({
count: 0
})
`)
// normal declarations left untouched
expect(content).toMatch(`let c = () => {}`)
expect(content).toMatch(`let d`)
assertCode(content)
expect(bindings).toStrictEqual({
foo: 'setup',
a: 'setup',
b: 'setup',
c: 'setup',
d: 'setup'
})
})
test('multi ref declarations', () => {
const { content, bindings } = compile(`<script setup>
ref: a = 1, b = 2, c = {
count: 0
}
</script>`)
expect(content).toMatch(`
const a = _ref(1), b = _ref(2), c = _ref({
count: 0
})
`)
expect(content).toMatch(`return { a, b, c }`)
assertCode(content)
expect(bindings).toStrictEqual({
a: 'setup',
b: 'setup',
c: 'setup'
})
})
test('should not convert non ref labels', () => {
const { content } = compile(`<script setup>
foo: a = 1, b = 2, c = {
count: 0
}
</script>`)
expect(content).toMatch(`foo: a = 1, b = 2`)
assertCode(content)
})
test('accessing ref binding', () => {
const { content } = compile(`<script setup>
ref: a = 1
console.log(a)
function get() {
return a + 1
}
</script>`)
expect(content).toMatch(`console.log(a.value)`)
expect(content).toMatch(`return a.value + 1`)
assertCode(content)
})
test('cases that should not append .value', () => {
const { content } = compile(`<script setup>
ref: a = 1
console.log(b.a)
function get(a) {
return a + 1
}
</script>`)
expect(content).not.toMatch(`a.value`)
})
test('mutating ref binding', () => {
const { content } = compile(`<script setup>
ref: a = 1
ref: b = { count: 0 }
function inc() {
a++
a = a + 1
b.count++
b.count = b.count + 1
}
</script>`)
expect(content).toMatch(`a.value++`)
expect(content).toMatch(`a.value = a.value + 1`)
expect(content).toMatch(`b.value.count++`)
expect(content).toMatch(`b.value.count = b.value.count + 1`)
assertCode(content)
})
test('using ref binding in property shorthand', () => {
const { content } = compile(`<script setup>
ref: a = 1
const b = { a }
function test() {
const { a } = b
}
</script>`)
expect(content).toMatch(`const b = { a: a.value }`)
// should not convert destructure
expect(content).toMatch(`const { a } = b`)
assertCode(content)
})
test('object destructure', () => {
const { content, bindings } = compile(`<script setup>
ref: n = 1, ({ a, b: c, d = 1, e: f = 2, ...g } = useFoo())
console.log(n, a, c, d, f, g)
</script>`)
expect(content).toMatch(
`const n = _ref(1), { a: __a, b: __c, d: __d = 1, e: __f = 2, ...__g } = useFoo()`
)
expect(content).toMatch(`\nconst a = _ref(__a);`)
expect(content).not.toMatch(`\nconst b = _ref(__b);`)
expect(content).toMatch(`\nconst c = _ref(__c);`)
expect(content).toMatch(`\nconst d = _ref(__d);`)
expect(content).not.toMatch(`\nconst e = _ref(__e);`)
expect(content).toMatch(`\nconst f = _ref(__f);`)
expect(content).toMatch(`\nconst g = _ref(__g);`)
expect(content).toMatch(
`console.log(n.value, a.value, c.value, d.value, f.value, g.value)`
)
expect(content).toMatch(`return { n, a, c, d, f, g }`)
expect(bindings).toStrictEqual({
n: 'setup',
a: 'setup',
c: 'setup',
d: 'setup',
f: 'setup',
g: 'setup'
})
assertCode(content)
})
test('array destructure', () => {
const { content, bindings } = compile(`<script setup>
ref: n = 1, [a, b = 1, ...c] = useFoo()
console.log(n, a, b, c)
</script>`)
expect(content).toMatch(
`const n = _ref(1), [__a, __b = 1, ...__c] = useFoo()`
)
expect(content).toMatch(`\nconst a = _ref(__a);`)
expect(content).toMatch(`\nconst b = _ref(__b);`)
expect(content).toMatch(`\nconst c = _ref(__c);`)
expect(content).toMatch(`console.log(n.value, a.value, b.value, c.value)`)
expect(content).toMatch(`return { n, a, b, c }`)
expect(bindings).toStrictEqual({
n: 'setup',
a: 'setup',
b: 'setup',
c: 'setup'
})
assertCode(content)
})
test('nested destructure', () => {
const { content, bindings } = compile(`<script setup>
ref: [{ a: { b }}] = useFoo()
ref: ({ c: [d, e] } = useBar())
console.log(b, d, e)
</script>`)
expect(content).toMatch(`const [{ a: { b: __b }}] = useFoo()`)
expect(content).toMatch(`const { c: [__d, __e] } = useBar()`)
expect(content).not.toMatch(`\nconst a = _ref(__a);`)
expect(content).not.toMatch(`\nconst c = _ref(__c);`)
expect(content).toMatch(`\nconst b = _ref(__b);`)
expect(content).toMatch(`\nconst d = _ref(__d);`)
expect(content).toMatch(`\nconst e = _ref(__e);`)
expect(content).toMatch(`return { b, d, e }`)
expect(bindings).toStrictEqual({
b: 'setup',
d: 'setup',
e: 'setup'
})
assertCode(content)
})
})
2020-07-09 09:11:57 +08:00
describe('errors', () => {
test('<script> and <script setup> must have same lang', () => {
expect(() =>
compile(`<script>foo()</script><script setup lang="ts">bar()</script>`)
).toThrow(`<script> and <script setup> must have the same language type`)
2020-07-09 09:11:57 +08:00
})
2020-11-13 07:11:25 +08:00
const moduleErrorMsg = `cannot contain ES module exports`
test('non-type named exports', () => {
expect(() =>
compile(`<script setup>
export const a = 1
</script>`)
2020-11-13 07:11:25 +08:00
).toThrow(moduleErrorMsg)
expect(() =>
compile(`<script setup>
export * from './foo'
</script>`)
2020-11-13 07:11:25 +08:00
).toThrow(moduleErrorMsg)
expect(() =>
compile(`<script setup>
2020-07-09 09:11:57 +08:00
const bar = 1
export { bar as default }
</script>`)
2020-11-13 07:11:25 +08:00
).toThrow(moduleErrorMsg)
})
test('ref: non-assignment expressions', () => {
expect(() =>
compile(`<script setup>
ref: a = 1, foo()
</script>`)
).toThrow(`ref: statements can only contain assignment expressions`)
2020-07-09 09:11:57 +08:00
})
2020-11-14 06:38:28 +08:00
test('defineOptions() w/ both type and non-type args', () => {
2020-11-13 07:11:25 +08:00
expect(() => {
compile(`<script setup lang="ts">
2020-11-14 06:38:28 +08:00
import { defineOptions } from 'vue'
defineOptions<{}>({})
2020-11-13 07:11:25 +08:00
</script>`)
}).toThrow(`cannot accept both type and non-type arguments`)
})
2020-11-14 06:38:28 +08:00
test('defineOptions() referencing local var', () => {
expect(() =>
compile(`<script setup>
2020-11-14 06:38:28 +08:00
import { defineOptions } from 'vue'
2020-11-13 07:11:25 +08:00
const bar = 1
2020-11-14 06:38:28 +08:00
defineOptions({
2020-11-13 07:11:25 +08:00
props: {
foo: {
default: () => bar
2020-07-09 09:11:57 +08:00
}
}
2020-11-13 07:11:25 +08:00
})
</script>`)
).toThrow(`cannot reference locally declared variables`)
2020-07-09 09:11:57 +08:00
})
2020-11-14 06:38:28 +08:00
test('defineOptions() referencing ref declarations', () => {
expect(() =>
compile(`<script setup>
2020-11-14 06:38:28 +08:00
import { defineOptions } from 'vue'
ref: bar = 1
2020-11-14 06:38:28 +08:00
defineOptions({
2020-11-13 07:11:25 +08:00
props: { bar }
})
</script>`)
).toThrow(`cannot reference locally declared variables`)
2020-07-09 09:11:57 +08:00
})
2020-11-14 06:38:28 +08:00
test('should allow defineOptions() referencing scope var', () => {
2020-07-09 09:11:57 +08:00
assertCode(
compile(`<script setup>
2020-11-14 06:38:28 +08:00
import { defineOptions } from 'vue'
2020-07-09 09:11:57 +08:00
const bar = 1
2020-11-14 06:38:28 +08:00
defineOptions({
2020-07-09 09:11:57 +08:00
props: {
foo: {
default: bar => bar + 1
}
}
2020-11-13 07:11:25 +08:00
})
</script>`).content
2020-07-09 09:11:57 +08:00
)
})
2020-11-14 06:38:28 +08:00
test('should allow defineOptions() referencing imported binding', () => {
2020-07-09 09:11:57 +08:00
assertCode(
compile(`<script setup>
2020-11-14 06:38:28 +08:00
import { defineOptions } from 'vue'
2020-07-09 09:11:57 +08:00
import { bar } from './bar'
2020-11-14 06:38:28 +08:00
defineOptions({
2020-07-09 09:11:57 +08:00
props: {
foo: {
default: () => bar
}
}
2020-11-13 07:11:25 +08:00
})
</script>`).content
2020-07-09 09:11:57 +08:00
)
})
})
})
describe('SFC analyze <script> bindings', () => {
it('can parse decorators syntax in typescript block', () => {
const { scriptAst } = compile(`
<script lang="ts">
import { Options, Vue } from 'vue-class-component';
@Options({
components: {
HelloWorld,
},
props: ['foo', 'bar']
})
export default class Home extends Vue {}
</script>
`)
expect(scriptAst).toBeDefined()
})
it('recognizes props array declaration', () => {
const { bindings } = compile(`
<script>
export default {
props: ['foo', 'bar']
}
</script>
`)
expect(bindings).toStrictEqual({ foo: 'props', bar: 'props' })
})
it('recognizes props object declaration', () => {
const { bindings } = compile(`
<script>
export default {
props: {
foo: String,
bar: {
type: String,
},
baz: null,
qux: [String, Number]
}
}
</script>
`)
expect(bindings).toStrictEqual({
foo: 'props',
bar: 'props',
baz: 'props',
qux: 'props'
})
})
it('recognizes setup return', () => {
const { bindings } = compile(`
<script>
const bar = 2
export default {
setup() {
return {
foo: 1,
bar
}
}
}
</script>
`)
expect(bindings).toStrictEqual({ foo: 'setup', bar: 'setup' })
})
it('recognizes async setup return', () => {
const { bindings } = compile(`
<script>
const bar = 2
export default {
async setup() {
return {
foo: 1,
bar
}
}
}
</script>
`)
expect(bindings).toStrictEqual({ foo: 'setup', bar: 'setup' })
})
it('recognizes data return', () => {
const { bindings } = compile(`
<script>
const bar = 2
export default {
data() {
return {
foo: null,
bar
}
}
}
</script>
`)
expect(bindings).toStrictEqual({ foo: 'data', bar: 'data' })
})
it('recognizes methods', () => {
const { bindings } = compile(`
<script>
export default {
methods: {
foo() {}
}
}
</script>
`)
expect(bindings).toStrictEqual({ foo: 'options' })
})
it('recognizes computeds', () => {
const { bindings } = compile(`
<script>
export default {
computed: {
foo() {},
bar: {
get() {},
set() {},
}
}
}
</script>
`)
expect(bindings).toStrictEqual({ foo: 'options', bar: 'options' })
})
it('recognizes injections array declaration', () => {
const { bindings } = compile(`
<script>
export default {
inject: ['foo', 'bar']
}
</script>
`)
expect(bindings).toStrictEqual({ foo: 'options', bar: 'options' })
})
it('recognizes injections object declaration', () => {
const { bindings } = compile(`
<script>
export default {
inject: {
foo: {},
bar: {},
}
}
</script>
`)
expect(bindings).toStrictEqual({ foo: 'options', bar: 'options' })
})
it('works for mixed bindings', () => {
const { bindings } = compile(`
<script>
export default {
inject: ['foo'],
props: {
bar: String,
},
setup() {
return {
baz: null,
}
},
data() {
return {
qux: null
}
},
methods: {
quux() {}
},
computed: {
quuz() {}
}
}
</script>
`)
expect(bindings).toStrictEqual({
foo: 'options',
bar: 'props',
baz: 'setup',
qux: 'data',
quux: 'options',
quuz: 'options'
})
})
it('works for script setup', () => {
const { bindings } = compile(`
<script setup>
2020-11-14 06:38:28 +08:00
import { defineOptions } from 'vue'
defineOptions({
2020-11-13 07:11:25 +08:00
props: {
foo: String,
}
2020-11-13 07:11:25 +08:00
})
</script>
`)
expect(bindings).toStrictEqual({
foo: 'props'
})
})
})