Skip to content

Commit

Permalink
wip
Browse files Browse the repository at this point in the history
  • Loading branch information
sxzz committed Apr 5, 2023
1 parent b6353f4 commit fdd91c6
Show file tree
Hide file tree
Showing 7 changed files with 491 additions and 70 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -653,6 +653,48 @@ return { }
}"
`;

exports[`SFC compile <script setup> > defineModel() > basic usage 1`] = `
"import { useModel as _useModel } from 'vue'

export default {
props: {
\\"modelValue\\": { required: true },
\\"count\\": {},
},
emits: [\\"update:modelValue\\", \\"update:count\\"],
setup(__props, { expose: __expose }) {
__expose();

const modelValue = _useModel(\\"modelValue\\", { required: true })
const c = _useModel(\\"count\\")

return { modelValue, c }
}

}"
`;

exports[`SFC compile <script setup> > defineModel() > w/ defineProps and defineEmits 1`] = `
"import { useModel as _useModel, mergeModels as _mergeModels } from 'vue'

export default {
props: _mergeModels({ foo: String }, {
\\"modelValue\\": { default: 0 },
}),
emits: merge(['change'], [\\"update:modelValue\\"]),
setup(__props, { expose: __expose }) {
__expose();



const count = _useModel(\\"modelValue\\", { default: 0 })

return { count }
}

}"
`;

exports[`SFC compile <script setup> > defineOptions() > basic usage 1`] = `
"export default /*#__PURE__*/Object.assign({ name: 'FooApp' }, {
setup(__props, { expose: __expose }) {
Expand Down Expand Up @@ -1580,6 +1622,50 @@ return { emit }
})"
`;

exports[`SFC compile <script setup> > with TypeScript > defineModel > basic usage 1`] = `
"import { useModel as _useModel, defineComponent as _defineComponent } from 'vue'

export default /*#__PURE__*/_defineComponent({
props: {
\\"modelValue\\": [Boolean, String],
\\"count\\": Number,
},
emits: [\\"update:modelValue\\", \\"update:count\\"],
setup(__props, { expose: __expose }) {
__expose();

const modelValue = _useModel(\\"modelValue\\")
const count = _useModel(\\"count\\")

return { modelValue, count }
}

})"
`;

exports[`SFC compile <script setup> > with TypeScript > defineModel > w/ production mode 1`] = `
"import { useModel as _useModel, defineComponent as _defineComponent } from 'vue'

export default /*#__PURE__*/_defineComponent({
props: {
\\"modelValue\\": Boolean,
\\"fn\\": Function,
\\"str\\": {},
},
emits: [\\"update:modelValue\\", \\"update:fn\\", \\"update:str\\"],
setup(__props, { expose: __expose }) {
__expose();

const modelValue = _useModel(\\"modelValue\\")
const fn = _useModel(\\"fn\\")
const str = _useModel(\\"str\\")

return { modelValue, fn, str }
}

})"
`;

exports[`SFC compile <script setup> > with TypeScript > defineProps w/ TS assertion 1`] = `
"import { defineComponent as _defineComponent } from 'vue'

Expand Down
107 changes: 107 additions & 0 deletions packages/compiler-sfc/__tests__/compileScript.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -365,6 +365,61 @@ defineExpose({ foo: 123 })
expect(content).toMatch(/\b__expose\(\{ foo: 123 \}\)/)
})

describe('defineModel()', () => {
test('basic usage', () => {
const { content, bindings } = compile(
`
<script setup>
const modelValue = defineModel({ required: true })
const c = defineModel('count')
</script>
`,
{ defineModel: true }
)
assertCode(content)
expect(content).toMatch('props: {\n "modelValue": { required: true }')
expect(content).toMatch('"count": {},')
expect(content).toMatch('emits: ["update:modelValue", "update:count"],')
expect(content).toMatch(
`const modelValue = _useModel("modelValue", { required: true })`
)
expect(content).toMatch(`const c = _useModel("count")`)
expect(content).toMatch(`return { modelValue, c }`)
expect(content).not.toMatch('defineModel')

expect(bindings).toStrictEqual({
modelValue: BindingTypes.SETUP_REF,
count: BindingTypes.PROPS,
c: BindingTypes.SETUP_REF
})
})

test('w/ defineProps and defineEmits', () => {
const { content, bindings } = compile(
`
<script setup>
defineProps({ foo: String })
defineEmits(['change'])
const count = defineModel({ default: 0 })
</script>
`,
{ defineModel: true }
)
assertCode(content)
expect(content).toMatch(`props: _mergeModels({ foo: String }`)
expect(content).toMatch(`"modelValue": { default: 0 }`)
expect(content).toMatch(
`const count = _useModel("modelValue", { default: 0 })`
)
expect(content).not.toMatch('defineModel')
expect(bindings).toStrictEqual({
count: BindingTypes.SETUP_REF,
foo: BindingTypes.PROPS,
modelValue: BindingTypes.PROPS
})
})
})

test('<script> after <script setup> the script content not end with `\\n`', () => {
const { content } = compile(`
<script setup>
Expand Down Expand Up @@ -1710,6 +1765,58 @@ const emit = defineEmits(['a', 'b'])
})
})

describe('defineModel', () => {
test('basic usage', () => {
const { content, bindings } = compile(
`
<script setup lang="ts">
const modelValue = defineModel<boolean | string>()
const count = defineModel<number>('count')
</script>
`,
{ defineModel: true }
)
assertCode(content)
expect(content).toMatch('"modelValue": [Boolean, String]')
expect(content).toMatch('"count": Number')
expect(content).toMatch('emits: ["update:modelValue", "update:count"]')
expect(content).toMatch(`const modelValue = _useModel("modelValue")`)
expect(content).toMatch(`const count = _useModel("count")`)
expect(bindings).toStrictEqual({
modelValue: BindingTypes.SETUP_REF,
count: BindingTypes.SETUP_REF
})
})

test('w/ production mode', () => {
const { content, bindings } = compile(
`
<script setup lang="ts">
const modelValue = defineModel<boolean>()
const fn = defineModel<() => void>('fn')
const str = defineModel<string>('str')
</script>
`,
{ defineModel: true, isProd: true }
)
assertCode(content)
expect(content).toMatch('"modelValue": Boolean')
expect(content).toMatch('"fn": Function')
expect(content).toMatch('"str": {}')
expect(content).toMatch(
'emits: ["update:modelValue", "update:fn", "update:str"]'
)
expect(content).toMatch(`const modelValue = _useModel("modelValue")`)
expect(content).toMatch(`const fn = _useModel("fn")`)
expect(content).toMatch(`const str = _useModel("str")`)
expect(bindings).toStrictEqual({
modelValue: BindingTypes.SETUP_REF,
fn: BindingTypes.SETUP_REF,
str: BindingTypes.SETUP_REF
})
})
})

test('runtime Enum', () => {
const { content, bindings } = compile(
`<script setup lang="ts">
Expand Down
Loading

0 comments on commit fdd91c6

Please sign in to comment.