fix(compiler-sfc): fix wrong scopeId for nested <script setup> components

This commit is contained in:
Evan You
2021-04-01 18:11:04 -04:00
parent 8c57b9131d
commit 7f7dcc9f7d
3 changed files with 53 additions and 7 deletions

View File

@@ -272,6 +272,25 @@ return (_ctx, _cache) => {
}"
`;
exports[`SFC compile <script setup> inlineTemplate mode should not wrap render fn with withId when having scoped styles 1`] = `
"import { toDisplayString as _toDisplayString, openBlock as _openBlock, createBlock as _createBlock, withScopeId as _withScopeId } from \\"vue\\"
const _withId = /*#__PURE__*/_withScopeId(\\"data-v-xxxxxxxx\\")
export default {
expose: [],
setup(__props) {
const msg = 1
return (_ctx, _cache) => {
return (_openBlock(), _createBlock(\\"h1\\", null, _toDisplayString(msg)))
}
}
}"
`;
exports[`SFC compile <script setup> inlineTemplate mode should work 1`] = `
"import { toDisplayString as _toDisplayString, createVNode as _createVNode, Fragment as _Fragment, openBlock as _openBlock, createBlock as _createBlock } from \\"vue\\"

View File

@@ -404,6 +404,32 @@ const myEmit = defineEmit(['foo', 'bar'])
expect(content).toMatch(`ssrInterpolate`)
assertCode(content)
})
// _withId is only generated for backwards compat and is a noop when called
// in module scope.
// when inside setup(), currentInstance will be non-null and _withId will
// no longer be noop and cause scopeId errors.
// TODO: this test should no longer be necessary if we remove _withId
// codegen in 3.1
test('should not wrap render fn with withId when having scoped styles', async () => {
const { content } = compile(
`
<script setup>
const msg = 1
</script>
<template><h1>{{ msg }}</h1></template>
<style scoped>
h1 { color: red; }
</style>
`,
{
inlineTemplate: true
}
)
expect(content).toMatch(`return (_ctx, _cache`)
expect(content).not.toMatch(`_withId(`)
assertCode(content)
})
})
describe('with TypeScript', () => {