parent
81a7819535
commit
2024d11db0
@ -1,3 +1,4 @@
|
|||||||
|
import { BindingTypes } from '@vue/compiler-dom'
|
||||||
import { compile } from '../src'
|
import { compile } from '../src'
|
||||||
|
|
||||||
describe('ssr: inject <style vars>', () => {
|
describe('ssr: inject <style vars>', () => {
|
||||||
@ -111,4 +112,25 @@ describe('ssr: inject <style vars>', () => {
|
|||||||
}"
|
}"
|
||||||
`)
|
`)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
test('inject helpers', () => {
|
||||||
|
const result = compile(`<div/>`, {
|
||||||
|
inline: true,
|
||||||
|
bindingMetadata: { dynamic: BindingTypes.SETUP_MAYBE_REF },
|
||||||
|
ssrCssVars: '{ "--hash": (dynamic) }'
|
||||||
|
})
|
||||||
|
|
||||||
|
expect(result.code).toMatchInlineSnapshot(`
|
||||||
|
"(_ctx, _push, _parent, _attrs) => {
|
||||||
|
const _cssVars = { style: { \\"--hash\\": (_unref(dynamic)) }}
|
||||||
|
_push(\`<div\${_ssrRenderAttrs(_mergeProps(_attrs, _cssVars))}></div>\`)
|
||||||
|
}"
|
||||||
|
`)
|
||||||
|
expect(result.ast.helpers).toMatchInlineSnapshot(`
|
||||||
|
Array [
|
||||||
|
Symbol(mergeProps),
|
||||||
|
Symbol(unref),
|
||||||
|
]
|
||||||
|
`)
|
||||||
|
})
|
||||||
})
|
})
|
||||||
|
@ -40,13 +40,17 @@ export function ssrCodegenTransform(ast: RootNode, options: CompilerOptions) {
|
|||||||
// we do this instead of inlining the expression to ensure the vars are
|
// we do this instead of inlining the expression to ensure the vars are
|
||||||
// only resolved once per render
|
// only resolved once per render
|
||||||
if (options.ssrCssVars) {
|
if (options.ssrCssVars) {
|
||||||
|
const cssContext = createTransformContext(createRoot([]), options)
|
||||||
const varsExp = processExpression(
|
const varsExp = processExpression(
|
||||||
createSimpleExpression(options.ssrCssVars, false),
|
createSimpleExpression(options.ssrCssVars, false),
|
||||||
createTransformContext(createRoot([]), options)
|
cssContext
|
||||||
)
|
)
|
||||||
context.body.push(
|
context.body.push(
|
||||||
createCompoundExpression([`const _cssVars = { style: `, varsExp, `}`])
|
createCompoundExpression([`const _cssVars = { style: `, varsExp, `}`])
|
||||||
)
|
)
|
||||||
|
Array.from(cssContext.helpers.keys()).forEach(helper =>
|
||||||
|
ast.helpers.push(helper)
|
||||||
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
const isFragment =
|
const isFragment =
|
||||||
|
Loading…
Reference in New Issue
Block a user