`;
exports[`compile > directives > v-pre > basic 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
+"import { template as _template } from 'vue';
const t0 = _template("<div :id=\\"foo\\"><Comp></Comp>{{ bar }}</div>")
export function render(_ctx, $props, $emit, $attrs, $slots) {
const n0 = t0()
- _setInheritAttrs(false)
return n0
}"
`;
`;
exports[`compile > dynamic root nodes and interpolation 1`] = `
-"import { delegate as _delegate, setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setText as _setText, setDOMProp as _setDOMProp, delegateEvents as _delegateEvents, template as _template } from 'vue';
+"import { delegate as _delegate, renderEffect as _renderEffect, setText as _setText, setDOMProp as _setDOMProp, delegateEvents as _delegateEvents, template as _template } from 'vue';
const t0 = _template("<button></button>")
_delegateEvents("click")
export function render(_ctx) {
const n0 = t0()
_delegate(n0, "click", () => _ctx.handleClick)
- _setInheritAttrs(["id"])
_renderEffect(() => _setText(n0, _ctx.count, "foo", _ctx.count, "foo", _ctx.count))
_renderEffect(() => _setDOMProp(n0, "id", _ctx.count))
return n0
exports[`compile > expression parsing > v-bind 1`] = `
"((_ctx) => {
const n0 = t0()
- _setInheritAttrs(true)
_renderEffect(() => _setDynamicProps(n0, [{ [key.value+1]: _unref(foo)[key.value+1]() }], true))
return n0
})()"
`;
exports[`compiler: element transform > component with dynamic event arguments 1`] = `
-"import { toHandlerKey as _toHandlerKey } from 'vue';
-import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
+"import { resolveComponent as _resolveComponent, toHandlerKey as _toHandlerKey, createComponentWithFallback as _createComponentWithFallback } from 'vue';
export function render(_ctx) {
const _component_Foo = _resolveComponent("Foo")
`;
exports[`compiler: element transform > props + children 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
+"import { template as _template } from 'vue';
const t0 = _template("<div id=\\"foo\\"><span></span></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(false)
return n0
}"
`;
exports[`compiler: element transform > props merging: class 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setClass as _setClass, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setClass as _setClass, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["class"])
_renderEffect(() => _setClass(n0, ["foo", { bar: _ctx.isBar }], true))
return n0
}"
`;
exports[`compiler: element transform > props merging: style 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setStyle as _setStyle, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setStyle as _setStyle, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["style"])
_renderEffect(() => _setStyle(n0, ["color: green", { color: 'red' }], true))
return n0
}"
`;
exports[`compiler: element transform > static props 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
+"import { template as _template } from 'vue';
const t0 = _template("<div id=\\"foo\\" class=\\"bar\\"></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(false)
return n0
}"
`;
exports[`compiler: element transform > v-bind="obj" 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(true)
_renderEffect(() => _setDynamicProps(n0, [_ctx.obj], true))
return n0
}"
`;
exports[`compiler: element transform > v-bind="obj" after static prop 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(true)
_renderEffect(() => _setDynamicProps(n0, [{ id: "foo" }, _ctx.obj], true))
return n0
}"
`;
exports[`compiler: element transform > v-bind="obj" before static prop 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(true)
_renderEffect(() => _setDynamicProps(n0, [_ctx.obj, { id: "foo" }], true))
return n0
}"
`;
exports[`compiler: element transform > v-bind="obj" between static props 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(true)
_renderEffect(() => _setDynamicProps(n0, [{ id: "foo" }, _ctx.obj, { class: "bar" }], true))
return n0
}"
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`compiler v-bind > .attr modifier 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["foo-bar"])
_renderEffect(() => _setAttr(n0, "foo-bar", _ctx.id))
return n0
}"
`;
exports[`compiler v-bind > .attr modifier w/ innerHTML 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["innerHTML"])
_renderEffect(() => _setAttr(n0, "innerHTML", _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > .attr modifier w/ no expression 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["foo-bar"])
_renderEffect(() => _setAttr(n0, "foo-bar", _ctx.fooBar))
return n0
}"
`;
exports[`compiler v-bind > .attr modifier w/ progress value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
const t0 = _template("<progress></progress>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["value"])
_renderEffect(() => _setAttr(n0, "value", _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > .attr modifier w/ textContent 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["textContent"])
_renderEffect(() => _setAttr(n0, "textContent", _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > .attr modifier w/ value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["value"])
_renderEffect(() => _setAttr(n0, "value", _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > .camel modifier 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["fooBar"])
_renderEffect(() => _setDynamicProp(n0, "fooBar", _ctx.id))
return n0
}"
`;
exports[`compiler v-bind > .camel modifier w/ dynamic arg 1`] = `
-"import { camelize as _camelize } from 'vue';
-import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, camelize as _camelize, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(true)
_renderEffect(() => _setDynamicProps(n0, [{ [_camelize(_ctx.foo)]: _ctx.id }], true))
return n0
}"
`;
exports[`compiler v-bind > .camel modifier w/ no expression 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["fooBar"])
_renderEffect(() => _setDynamicProp(n0, "fooBar", _ctx.fooBar))
return n0
}"
`;
exports[`compiler v-bind > .prop modifier (shorthand) 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["fooBar"])
_renderEffect(() => _setDOMProp(n0, "fooBar", _ctx.id))
return n0
}"
`;
exports[`compiler v-bind > .prop modifier (shorthand) w/ innerHTML 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["innerHTML"])
_renderEffect(() => _setHtml(n0, _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > .prop modifier (shorthand) w/ no expression 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["fooBar"])
_renderEffect(() => _setDOMProp(n0, "fooBar", _ctx.fooBar))
return n0
}"
`;
exports[`compiler v-bind > .prop modifier (shorthand) w/ progress value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
const t0 = _template("<progress></progress>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["value"])
_renderEffect(() => _setDOMProp(n0, "value", _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > .prop modifier (shorthand) w/ textContent 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["textContent"])
_renderEffect(() => _setText(n0, _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > .prop modifier (shorthand) w/ value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setValue as _setValue, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setValue as _setValue, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["value"])
_renderEffect(() => _setValue(n0, _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > .prop modifier 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["fooBar"])
_renderEffect(() => _setDOMProp(n0, "fooBar", _ctx.id))
return n0
}"
`;
exports[`compiler v-bind > .prop modifier w/ dynamic arg 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(true)
_renderEffect(() => _setDynamicProps(n0, [{ ["." + _ctx.fooBar]: _ctx.id }], true))
return n0
}"
`;
exports[`compiler v-bind > .prop modifier w/ innerHTML 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["innerHTML"])
_renderEffect(() => _setHtml(n0, _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > .prop modifier w/ no expression 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["fooBar"])
_renderEffect(() => _setDOMProp(n0, "fooBar", _ctx.fooBar))
return n0
}"
`;
exports[`compiler v-bind > .prop modifier w/ progress value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
const t0 = _template("<progress></progress>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["value"])
_renderEffect(() => _setDOMProp(n0, "value", _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > .prop modifier w/ textContent 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["textContent"])
_renderEffect(() => _setText(n0, _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > .prop modifier w/ value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setValue as _setValue, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setValue as _setValue, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["value"])
_renderEffect(() => _setValue(n0, _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > :innerHTML 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["innerHTML"])
_renderEffect(() => _setHtml(n0, _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > :textContext 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["textContent"])
_renderEffect(() => _setText(n0, _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > :value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setValue as _setValue, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setValue as _setValue, template as _template } from 'vue';
const t0 = _template("<input>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["value"])
_renderEffect(() => _setValue(n0, _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > :value w/ progress 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue';
const t0 = _template("<progress></progress>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["value"])
_renderEffect(() => _setDynamicProp(n0, "value", _ctx.foo))
return n0
}"
`;
exports[`compiler v-bind > HTML global attributes should set as dom prop 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["id", "title", "lang", "dir", "tabindex"])
_renderEffect(() => _setDOMProp(n0, "id", _ctx.id))
_renderEffect(() => _setDOMProp(n0, "title", _ctx.title))
_renderEffect(() => _setDOMProp(n0, "lang", _ctx.lang))
`;
exports[`compiler v-bind > MathML global attributes should set as dom prop 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
const t0 = _template("<math></math>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["autofucus", "dir", "displaystyle", "mathcolor", "tabindex"])
_renderEffect(() => _setDOMProp(n0, "autofucus", _ctx.autofucus))
_renderEffect(() => _setDOMProp(n0, "dir", _ctx.dir))
_renderEffect(() => _setDOMProp(n0, "displaystyle", _ctx.displaystyle))
`;
exports[`compiler v-bind > SVG global attributes should set as dom prop 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
const t0 = _template("<svg></svg>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["id", "lang", "tabindex"])
_renderEffect(() => _setDOMProp(n0, "id", _ctx.id))
_renderEffect(() => _setDOMProp(n0, "lang", _ctx.lang))
_renderEffect(() => _setDOMProp(n0, "tabindex", _ctx.tabindex))
`;
exports[`compiler v-bind > basic 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["id"])
_renderEffect(() => _setDOMProp(n0, "id", _ctx.id))
return n0
}"
`;
exports[`compiler v-bind > dynamic arg 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(true)
_renderEffect(() => _setDynamicProps(n0, [{ [_ctx.id]: _ctx.id, [_ctx.title]: _ctx.title }], true))
return n0
}"
`;
exports[`compiler v-bind > dynamic arg w/ static attribute 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(true)
_renderEffect(() => _setDynamicProps(n0, [{ [_ctx.id]: _ctx.id, foo: "bar", checked: "" }], true))
return n0
}"
`;
exports[`compiler v-bind > no expression (shorthand) 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["camel-case"])
_renderEffect(() => _setDynamicProp(n0, "camel-case", _ctx.camelCase))
return n0
}"
`;
exports[`compiler v-bind > no expression 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(["id"])
_renderEffect(() => _setDOMProp(n0, "id", _ctx.id))
return n0
}"
`;
exports[`compiler v-bind > should error if empty expression 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
+"import { template as _template } from 'vue';
const t0 = _template("<div arg></div>")
export function render(_ctx) {
const n0 = t0()
- _setInheritAttrs(false)
return n0
}"
`;
`;
exports[`compiler: v-for > multi effect 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, createFor as _createFor, template as _template } from 'vue';
+"import { renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, createFor as _createFor, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = _createFor(() => (_ctx.items), (_ctx0) => {
const n2 = t0()
- _setInheritAttrs(["item", "index"])
_renderEffect(() => _setDynamicProp(n2, "item", _ctx0[0].value))
_renderEffect(() => _setDynamicProp(n2, "index", _ctx0[1].value))
return n2
`;
exports[`compiler: vModel transform > should support input (checkbox) 1`] = `
-"import { vModelCheckbox as _vModelCheckbox, withDirectives as _withDirectives, delegate as _delegate, setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
+"import { vModelCheckbox as _vModelCheckbox, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue';
const t0 = _template("<input type=\\"checkbox\\">")
export function render(_ctx) {
const n0 = t0()
_withDirectives(n0, [[_vModelCheckbox, () => _ctx.model]])
_delegate(n0, "update:modelValue", () => $event => (_ctx.model = $event))
- _setInheritAttrs(false)
return n0
}"
`;
`;
exports[`compiler: vModel transform > should support input (radio) 1`] = `
-"import { vModelRadio as _vModelRadio, withDirectives as _withDirectives, delegate as _delegate, setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
+"import { vModelRadio as _vModelRadio, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue';
const t0 = _template("<input type=\\"radio\\">")
export function render(_ctx) {
const n0 = t0()
_withDirectives(n0, [[_vModelRadio, () => _ctx.model]])
_delegate(n0, "update:modelValue", () => $event => (_ctx.model = $event))
- _setInheritAttrs(false)
return n0
}"
`;
exports[`compiler: vModel transform > should support input (text) 1`] = `
-"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
+"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue';
const t0 = _template("<input type=\\"text\\">")
export function render(_ctx) {
const n0 = t0()
_withDirectives(n0, [[_vModelText, () => _ctx.model]])
_delegate(n0, "update:modelValue", () => $event => (_ctx.model = $event))
- _setInheritAttrs(false)
return n0
}"
`;
`;
exports[`compiler: vModel transform > should support w/ dynamic v-bind 1`] = `
-"import { vModelDynamic as _vModelDynamic, withDirectives as _withDirectives, delegate as _delegate, setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
+"import { vModelDynamic as _vModelDynamic, withDirectives as _withDirectives, delegate as _delegate, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
const t0 = _template("<input>")
export function render(_ctx) {
const n0 = t0()
_withDirectives(n0, [[_vModelDynamic, () => _ctx.model]])
_delegate(n0, "update:modelValue", () => $event => (_ctx.model = $event))
- _setInheritAttrs(true)
_renderEffect(() => _setDynamicProps(n0, [_ctx.obj], true))
return n0
}"
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`compiler: v-once > as root node 1`] = `
-"import { setDOMProp as _setDOMProp, setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
+"import { setDOMProp as _setDOMProp, template as _template } from 'vue';
const t0 = _template("<div></div>")
export function render(_ctx) {
const n0 = t0()
_setDOMProp(n0, "id", _ctx.foo)
- _setInheritAttrs(["id"])
return n0
}"
`;
ir: RootIRNode
code: string
helpers: Set<string>
- vaporHelpers: Set<string>
+ helpers: Set<string>
} => {
const ast = parse(template, {
prefixIdentifiers: true,
...options,
...overrideOptions,
})
- const { code, helpers, vaporHelpers } = generate(ir, {
+ const { code, helpers } = generate(ir, {
prefixIdentifiers: true,
...options,
...overrideOptions,
})
- return { ast, ir, code, helpers, vaporHelpers }
+ return { ast, ir, code, helpers }
}
}
test.todo('basic')
test('children & sibling references', () => {
- const { code, vaporHelpers } = compileWithElementTransform(
+ const { code, helpers } = compileWithElementTransform(
`<div>
<p>{{ first }}</p>
{{ second }}
</div>`,
)
expect(code).toMatchSnapshot()
- expect(Array.from(vaporHelpers)).containSubset([
+ expect(Array.from(helpers)).containSubset([
'next',
'setText',
'createTextNode',
describe('compiler: element transform', () => {
describe('component', () => {
test('import + resolve component', () => {
- const { code, ir, vaporHelpers } = compileWithElementTransform(`<Foo/>`)
+ const { code, ir, helpers } = compileWithElementTransform(`<Foo/>`)
expect(code).toMatchSnapshot()
- expect(vaporHelpers).contains.all.keys(
- 'resolveComponent',
- 'createComponentWithFallback',
- )
+ expect(helpers).contains.all.keys('resolveComponent')
+ expect(helpers).contains.all.keys('createComponentWithFallback')
expect(ir.block.operation).toMatchObject([
{
type: IRNodeTypes.CREATE_COMPONENT_NODE,
})
test.todo('resolve implicitly self-referencing component', () => {
- const { code, vaporHelpers } = compileWithElementTransform(`<Example/>`, {
+ const { code, helpers } = compileWithElementTransform(`<Example/>`, {
filename: `/foo/bar/Example.vue?vue&type=template`,
})
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('resolveComponent')
+ expect(helpers).toContain('resolveComponent')
})
test('resolve component from setup bindings', () => {
- const { code, ir, vaporHelpers } = compileWithElementTransform(
- `<Example/>`,
- {
- bindingMetadata: {
- Example: BindingTypes.SETUP_MAYBE_REF,
- },
+ const { code, ir, helpers } = compileWithElementTransform(`<Example/>`, {
+ bindingMetadata: {
+ Example: BindingTypes.SETUP_MAYBE_REF,
},
- )
+ })
expect(code).toMatchSnapshot()
- expect(vaporHelpers).not.toContain('resolveComponent')
+ expect(helpers).not.toContain('resolveComponent')
expect(ir.block.operation).toMatchObject([
{
type: IRNodeTypes.CREATE_COMPONENT_NODE,
})
test('resolve component from setup bindings (inline)', () => {
- const { code, vaporHelpers } = compileWithElementTransform(`<Example/>`, {
+ const { code, helpers } = compileWithElementTransform(`<Example/>`, {
inline: true,
bindingMetadata: {
Example: BindingTypes.SETUP_MAYBE_REF,
})
expect(code).toMatchSnapshot()
expect(code).contains(`unref(Example)`)
- expect(vaporHelpers).not.toContain('resolveComponent')
- expect(vaporHelpers).toContain('unref')
+ expect(helpers).not.toContain('resolveComponent')
+ expect(helpers).toContain('unref')
})
test('resolve component from setup bindings (inline const)', () => {
- const { code, vaporHelpers } = compileWithElementTransform(`<Example/>`, {
+ const { code, helpers } = compileWithElementTransform(`<Example/>`, {
inline: true,
bindingMetadata: {
Example: BindingTypes.SETUP_CONST,
},
})
expect(code).toMatchSnapshot()
- expect(vaporHelpers).not.toContain('resolveComponent')
+ expect(helpers).not.toContain('resolveComponent')
})
test('resolve namespaced component from setup bindings', () => {
- const { code, vaporHelpers } = compileWithElementTransform(
- `<Foo.Example/>`,
- {
- bindingMetadata: {
- Foo: BindingTypes.SETUP_MAYBE_REF,
- },
+ const { code, helpers } = compileWithElementTransform(`<Foo.Example/>`, {
+ bindingMetadata: {
+ Foo: BindingTypes.SETUP_MAYBE_REF,
},
- )
+ })
expect(code).toMatchSnapshot()
expect(code).contains(`_ctx.Foo.Example`)
- expect(vaporHelpers).not.toContain('resolveComponent')
+ expect(helpers).not.toContain('resolveComponent')
})
test('resolve namespaced component from setup bindings (inline const)', () => {
- const { code, vaporHelpers } = compileWithElementTransform(
- `<Foo.Example/>`,
- {
- inline: true,
- bindingMetadata: {
- Foo: BindingTypes.SETUP_CONST,
- },
+ const { code, helpers } = compileWithElementTransform(`<Foo.Example/>`, {
+ inline: true,
+ bindingMetadata: {
+ Foo: BindingTypes.SETUP_CONST,
},
- )
+ })
expect(code).toMatchSnapshot()
expect(code).contains(`Foo.Example`)
- expect(vaporHelpers).not.toContain('resolveComponent')
+ expect(helpers).not.toContain('resolveComponent')
})
test('resolve namespaced component from props bindings (inline)', () => {
- const { code, vaporHelpers } = compileWithElementTransform(
- `<Foo.Example/>`,
- {
- inline: true,
- bindingMetadata: {
- Foo: BindingTypes.PROPS,
- },
+ const { code, helpers } = compileWithElementTransform(`<Foo.Example/>`, {
+ inline: true,
+ bindingMetadata: {
+ Foo: BindingTypes.PROPS,
},
- )
+ })
expect(code).toMatchSnapshot()
expect(code).contains(`Foo.Example`)
- expect(vaporHelpers).not.toContain('resolveComponent')
+ expect(helpers).not.toContain('resolveComponent')
})
test('resolve namespaced component from props bindings (non-inline)', () => {
- const { code, vaporHelpers } = compileWithElementTransform(
- `<Foo.Example/>`,
- {
- inline: false,
- bindingMetadata: {
- Foo: BindingTypes.PROPS,
- },
+ const { code, helpers } = compileWithElementTransform(`<Foo.Example/>`, {
+ inline: false,
+ bindingMetadata: {
+ Foo: BindingTypes.PROPS,
},
- )
+ })
expect(code).toMatchSnapshot()
expect(code).contains('_ctx.Foo.Example')
- expect(vaporHelpers).not.toContain('resolveComponent')
+ expect(helpers).not.toContain('resolveComponent')
})
test('do not resolve component from non-script-setup bindings', () => {
Object.defineProperty(bindingMetadata, '__isScriptSetup', {
value: false,
})
- const { code, ir, vaporHelpers } = compileWithElementTransform(
- `<Example/>`,
- { bindingMetadata },
- )
+ const { code, ir, helpers } = compileWithElementTransform(`<Example/>`, {
+ bindingMetadata,
+ })
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('resolveComponent')
+ expect(helpers).toContain('resolveComponent')
expect(ir.block.operation).toMatchObject([
{
type: IRNodeTypes.CREATE_COMPONENT_NODE,
describe('dynamic component', () => {
test('static binding', () => {
- const { code, ir, vaporHelpers } = compileWithElementTransform(
+ const { code, ir, helpers } = compileWithElementTransform(
`<component is="foo" />`,
)
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('resolveDynamicComponent')
+ expect(helpers).toContain('resolveDynamicComponent')
expect(ir.block.operation).toMatchObject([
{
type: IRNodeTypes.CREATE_COMPONENT_NODE,
})
test('capitalized version w/ static binding', () => {
- const { code, ir, vaporHelpers } = compileWithElementTransform(
+ const { code, ir, helpers } = compileWithElementTransform(
`<Component is="foo" />`,
)
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('resolveDynamicComponent')
+ expect(helpers).toContain('resolveDynamicComponent')
expect(ir.block.operation).toMatchObject([
{
type: IRNodeTypes.CREATE_COMPONENT_NODE,
})
test('dynamic binding', () => {
- const { code, ir, vaporHelpers } = compileWithElementTransform(
+ const { code, ir, helpers } = compileWithElementTransform(
`<component :is="foo" />`,
)
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('resolveDynamicComponent')
+ expect(helpers).toContain('resolveDynamicComponent')
expect(ir.block.operation).toMatchObject([
{
type: IRNodeTypes.CREATE_COMPONENT_NODE,
})
test('dynamic binding shorthand', () => {
- const { code, ir, vaporHelpers } =
+ const { code, ir, helpers } =
compileWithElementTransform(`<component :is />`)
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('resolveDynamicComponent')
+ expect(helpers).toContain('resolveDynamicComponent')
expect(ir.block.operation).toMatchObject([
{
type: IRNodeTypes.CREATE_COMPONENT_NODE,
// #3934
test('normal component with is prop', () => {
- const { code, ir, vaporHelpers } = compileWithElementTransform(
+ const { code, ir, helpers } = compileWithElementTransform(
`<custom-input is="foo" />`,
{
isNativeTag: () => false,
},
)
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('resolveComponent')
- expect(vaporHelpers).not.toContain('resolveDynamicComponent')
+ expect(helpers).toContain('resolveComponent')
+ expect(helpers).not.toContain('resolveDynamicComponent')
expect(ir.block.operation).toMatchObject([
{
type: IRNodeTypes.CREATE_COMPONENT_NODE,
delegate: true,
effect: false,
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
})
describe('compiler: transform <slot> outlets', () => {
test('default slot outlet', () => {
- const { ir, code, vaporHelpers } = compileWithSlotsOutlet(`<slot />`)
+ const { ir, code, helpers } = compileWithSlotsOutlet(`<slot />`)
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('createSlot')
+ expect(helpers).toContain('createSlot')
expect(ir.block.effect).toEqual([])
expect(ir.block.operation).toMatchObject([
{
flags: DynamicFlag.REFERENCED,
})
expect(ir.template).toEqual(['<div></div>'])
- expect(ir.block.operation).lengthOf(2)
- expect(ir.block.operation[1]).toMatchObject({
+ expect(ir.block.operation).lengthOf(1)
+ expect(ir.block.operation[0]).toMatchObject({
type: IRNodeTypes.SET_TEMPLATE_REF,
element: 0,
value: {
})
expect(ir.template).toEqual(['<div></div>'])
expect(ir.block.operation).toMatchObject([
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
{
type: IRNodeTypes.DECLARE_OLD_REF,
id: 0,
const { positive } = ir.block.operation[0] as IfIRNode
expect(positive.operation).toMatchObject([
- { type: IRNodeTypes.SET_INHERIT_ATTRS },
{
type: IRNodeTypes.SET_TEMPLATE_REF,
element: 2,
const { render } = ir.block.operation[0] as ForIRNode
expect(render.operation).toMatchObject([
- { type: IRNodeTypes.SET_INHERIT_ATTRS },
{
type: IRNodeTypes.SET_TEMPLATE_REF,
element: 2,
describe('compiler: text transform', () => {
it('no consecutive text', () => {
- const { code, ir, vaporHelpers } = compileWithTextTransform(
+ const { code, ir, helpers } = compileWithTextTransform(
'{{ "hello world" }}',
)
expect(code).toMatchSnapshot()
- expect(vaporHelpers).contains.all.keys('createTextNode')
+ expect(helpers).contains.all.keys('createTextNode')
expect(ir.block.operation).toMatchObject([
{
type: IRNodeTypes.CREATE_TEXT_NODE,
})
it('consecutive text', () => {
- const { code, ir, vaporHelpers } = compileWithTextTransform('{{ msg }}')
+ const { code, ir, helpers } = compileWithTextTransform('{{ msg }}')
expect(code).toMatchSnapshot()
- expect(vaporHelpers).contains.all.keys('createTextNode')
+ expect(helpers).contains.all.keys('createTextNode')
expect(ir.block.operation).toMatchObject([
{
type: IRNodeTypes.CREATE_TEXT_NODE,
describe('compiler: v-for', () => {
test('basic v-for', () => {
- const { code, ir, vaporHelpers, helpers } = compileWithVFor(
+ const { code, ir, helpers } = compileWithVFor(
`<div v-for="item of items" :key="item.id" @click="remove(item)">{{ item }}</div>`,
)
expect(code).matchSnapshot()
- expect(vaporHelpers).contains('createFor')
- expect(helpers.size).toBe(0)
+ expect(helpers).contains('createFor')
expect(ir.template).toEqual(['<div></div>'])
expect(ir.block.operation).toMatchObject([
{
describe('v-html', () => {
test('should convert v-html to innerHTML', () => {
- const { code, ir, helpers, vaporHelpers } = compileWithVHtml(
+ const { code, ir, helpers } = compileWithVHtml(
`<div v-html="code"></div>`,
{
bindingMetadata: {
},
)
- expect(vaporHelpers).contains('setHtml')
- expect(helpers.size).toBe(0)
+ expect(helpers).contains('setHtml')
- expect(ir.block.operation).toMatchObject([
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
- ])
+ expect(ir.block.operation).toMatchObject([])
expect(ir.block.effect).toMatchObject([
{
expressions: [
test('should raise error and ignore children when v-html is present', () => {
const onError = vi.fn()
- const { code, ir, helpers, vaporHelpers } = compileWithVHtml(
+ const { code, ir, helpers } = compileWithVHtml(
`<div v-html="test">hello</div>`,
{
onError,
},
)
- expect(vaporHelpers).contains('setHtml')
- expect(helpers.size).toBe(0)
+ expect(helpers).contains('setHtml')
// children should have been removed
expect(ir.template).toEqual(['<div></div>'])
- expect(ir.block.operation).toMatchObject([
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
- ])
+ expect(ir.block.operation).toMatchObject([])
expect(ir.block.effect).toMatchObject([
{
expressions: [
describe('compiler: v-if', () => {
test('basic v-if', () => {
- const { code, vaporHelpers, ir, helpers } = compileWithVIf(
- `<div v-if="ok">{{msg}}</div>`,
- )
+ const { code, helpers, ir } = compileWithVIf(`<div v-if="ok">{{msg}}</div>`)
- expect(vaporHelpers).contains('createIf')
- expect(helpers.size).toBe(0)
+ expect(helpers).contains('createIf')
expect(ir.template).toEqual(['<div></div>'])
expect(ir.block.operation).toMatchObject([
test.todo('component v-if')
test('v-if + v-else', () => {
- const { code, ir, vaporHelpers, helpers } = compileWithVIf(
- `<div v-if="ok"/><p v-else/>`,
- )
+ const { code, ir, helpers } = compileWithVIf(`<div v-if="ok"/><p v-else/>`)
expect(code).matchSnapshot()
expect(ir.template).toEqual(['<div></div>', '<p></p>'])
- expect(vaporHelpers).contains('createIf')
+ expect(helpers).contains('createIf')
expect(ir.block.effect).lengthOf(0)
- expect(helpers).lengthOf(0)
expect(ir.block.operation).toMatchObject([
{
type: IRNodeTypes.IF,
describe('compiler: vModel transform', () => {
test('should support simple expression', () => {
- const { code, vaporHelpers } = compileWithVModel(
- '<input v-model="model" />',
- )
+ const { code, helpers } = compileWithVModel('<input v-model="model" />')
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('vModelText')
+ expect(helpers).toContain('vModelText')
})
test('should support input (text)', () => {
- const { code, vaporHelpers } = compileWithVModel(
+ const { code, helpers } = compileWithVModel(
'<input type="text" v-model="model" />',
)
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('vModelText')
+ expect(helpers).toContain('vModelText')
})
test('should support input (radio)', () => {
- const { code, vaporHelpers } = compileWithVModel(
+ const { code, helpers } = compileWithVModel(
'<input type="radio" v-model="model" />',
)
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('vModelRadio')
+ expect(helpers).toContain('vModelRadio')
})
test('should support input (checkbox)', () => {
- const { code, vaporHelpers } = compileWithVModel(
+ const { code, helpers } = compileWithVModel(
'<input type="checkbox" v-model="model" />',
)
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('vModelCheckbox')
+ expect(helpers).toContain('vModelCheckbox')
})
test('should support select', () => {
- const { code, vaporHelpers } = compileWithVModel(
- '<select v-model="model" />',
- )
+ const { code, helpers } = compileWithVModel('<select v-model="model" />')
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('vModelSelect')
+ expect(helpers).toContain('vModelSelect')
})
test('should support textarea', () => {
- const { code, vaporHelpers } = compileWithVModel(
- '<textarea v-model="model" />',
- )
+ const { code, helpers } = compileWithVModel('<textarea v-model="model" />')
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('vModelText')
+ expect(helpers).toContain('vModelText')
})
test('should support input (dynamic type)', () => {
- const { code, vaporHelpers } = compileWithVModel(
+ const { code, helpers } = compileWithVModel(
'<input :type="foo" v-model="model" />',
)
expect(code).toMatchSnapshot()
- expect(vaporHelpers).toContain('vModelDynamic')
+ expect(helpers).toContain('vModelDynamic')
})
test('should support w/ dynamic v-bind', () => {
const root1 = compileWithVModel('<input v-bind="obj" v-model="model" />')
expect(root1.code).toMatchSnapshot()
- expect(root1.vaporHelpers).toContain('vModelDynamic')
+ expect(root1.helpers).toContain('vModelDynamic')
const root2 = compileWithVModel(
'<input v-bind:[key]="val" v-model="model" />',
)
expect(root2.code).toMatchSnapshot()
- expect(root2.vaporHelpers).toContain('vModelDynamic')
+ expect(root2.helpers).toContain('vModelDynamic')
})
describe('errors', () => {
})
// TODO: component
- test.fails('should allow usage on custom element', () => {
+ test.todo('should allow usage on custom element', () => {
const onError = vi.fn()
const root = compileWithVModel('<my-input v-model="model" />', {
onError,
describe('v-on', () => {
test('simple expression', () => {
- const { code, ir, helpers, vaporHelpers } = compileWithVOn(
+ const { code, ir, helpers } = compileWithVOn(
`<div @click="handleClick"></div>`,
{
bindingMetadata: {
)
expect(code).matchSnapshot()
- expect(vaporHelpers).contains('delegate')
- expect(helpers.size).toBe(0)
+ expect(helpers).contains('delegate')
expect(ir.block.effect).toEqual([])
expect(ir.block.operation).toMatchObject([
{
keyOverride: undefined,
delegate: true,
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
})
})
test('dynamic arg', () => {
- const { code, ir, helpers, vaporHelpers } = compileWithVOn(
+ const { code, ir, helpers } = compileWithVOn(
`<div v-on:[event]="handler"/>`,
)
- expect(vaporHelpers).contains('on')
- expect(vaporHelpers).contains('renderEffect')
- expect(helpers.size).toBe(0)
- expect(ir.block.operation).toMatchObject([
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
- ])
+ expect(helpers).contains('on')
+ expect(helpers).contains('renderEffect')
+ expect(ir.block.operation).toMatchObject([])
expect(ir.block.effect[0].operations[0]).toMatchObject({
type: IRNodeTypes.SET_EVENT,
})
test('dynamic arg with complex exp prefixing', () => {
- const { ir, code, helpers, vaporHelpers } = compileWithVOn(
+ const { ir, code, helpers } = compileWithVOn(
`<div v-on:[event(foo)]="handler"/>`,
{
prefixIdentifiers: true,
},
)
- expect(vaporHelpers).contains('on')
- expect(vaporHelpers).contains('renderEffect')
- expect(helpers.size).toBe(0)
- expect(ir.block.operation).toMatchObject([
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
- ])
+ expect(helpers).contains('on')
+ expect(helpers).contains('renderEffect')
+ expect(ir.block.operation).toMatchObject([])
expect(ir.block.effect[0].operations[0]).toMatchObject({
type: IRNodeTypes.SET_EVENT,
})
test('should wrap as function if expression is inline statement', () => {
- const { code, ir, helpers, vaporHelpers } =
- compileWithVOn(`<div @click="i++"/>`)
+ const { code, ir, helpers } = compileWithVOn(`<div @click="i++"/>`)
expect(code).matchSnapshot()
- expect(vaporHelpers).contains('delegate')
- expect(helpers.size).toBe(0)
+ expect(helpers).contains('delegate')
expect(ir.block.effect).toEqual([])
expect(ir.block.operation).toMatchObject([
{
},
delegate: true,
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).contains(`_delegate(n0, "click", () => $event => (_ctx.i++))`)
})
test('should wrap in unref if identifier is setup-maybe-ref w/ inline: true', () => {
- const { code, helpers, vaporHelpers } = compileWithVOn(
+ const { code, helpers } = compileWithVOn(
`<div @click="x=y"/><div @click="x++"/><div @click="{ x } = y"/>`,
{
mode: 'module',
},
)
expect(code).matchSnapshot()
- expect(vaporHelpers).contains('unref')
- expect(helpers.size).toBe(0)
+ expect(helpers).contains('unref')
expect(code).contains(
`_delegate(n0, "click", () => $event => (x.value=_unref(y)))`,
)
type: IRNodeTypes.SET_EVENT,
value: { content: 'foo();bar()' },
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
// should wrap with `{` for multiple statements
// in this case the return value is discarded and the behavior is
type: IRNodeTypes.SET_EVENT,
value: { content: '\nfoo();\nbar()\n' },
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
// should wrap with `{` for multiple statements
// in this case the return value is discarded and the behavior is
type: IRNodeTypes.SET_EVENT,
value: { content: 'foo($event)' },
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
// should NOT prefix $event
expect(code).contains(
type: IRNodeTypes.SET_EVENT,
value: { content: 'foo($event);bar()' },
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
// should NOT prefix $event
expect(code).contains(
type: IRNodeTypes.SET_EVENT,
value: { content: '$event => foo($event)' },
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).contains(
`_delegate(n0, "click", () => $event => _ctx.foo($event))`,
type: IRNodeTypes.SET_EVENT,
value: { content: '(e: any): any => foo(e)' },
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).contains(
`_delegate(n0, "click", () => (e: any): any => _ctx.foo(e))`,
`,
},
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
})
type: IRNodeTypes.SET_EVENT,
value: { content: `a['b' + c]` },
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).matchSnapshot()
type: IRNodeTypes.SET_EVENT,
value: { content: `a['b' + c]` },
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).matchSnapshot()
type: IRNodeTypes.SET_EVENT,
value: { content: `e => foo(e)` },
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).contains(`_delegate(n0, "click", () => e => _ctx.foo(e))`)
})
})
test('should support multiple modifiers and event options w/ prefixIdentifiers: true', () => {
- const { code, ir, vaporHelpers } = compileWithVOn(
+ const { code, ir, helpers } = compileWithVOn(
`<div @click.stop.prevent.capture.once="test"/>`,
{
prefixIdentifiers: true,
)
expect(code).matchSnapshot()
- expect(vaporHelpers).contains('on')
+ expect(helpers).contains('on')
expect(ir.block.operation).toMatchObject([
{
type: IRNodeTypes.SET_EVENT,
keyOverride: undefined,
delegate: false,
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).contains(
`_on(n0, "click", () => _ctx.test, {
options: [],
},
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).matchSnapshot()
options: ['capture'],
},
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).matchSnapshot()
type: IRNodeTypes.SET_EVENT,
modifiers: { nonKeys: ['exact'] },
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).matchSnapshot()
options: [],
},
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).matchSnapshot()
modifiers: { nonKeys: ['right'] },
keyOverride: undefined,
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).matchSnapshot()
modifiers: { nonKeys: ['middle'] },
keyOverride: undefined,
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).matchSnapshot()
})
test('should delegate event', () => {
- const { code, ir, vaporHelpers } = compileWithVOn(`<div @click="test"/>`)
+ const { code, ir, helpers } = compileWithVOn(`<div @click="test"/>`)
expect(code).matchSnapshot()
expect(code).contains('_delegateEvents("click")')
- expect(vaporHelpers).contains('delegateEvents')
+ expect(helpers).contains('delegateEvents')
expect(ir.block.operation).toMatchObject([
{
type: IRNodeTypes.SET_EVENT,
delegate: true,
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
})
})
describe('compiler: v-once', () => {
test('basic', () => {
- const { ir, code, helpers } = compileWithOnce(
+ const { ir, code } = compileWithOnce(
`<div v-once>
{{ msg }}
<span :class="clz" />
)
expect(code).toMatchSnapshot()
- expect(helpers).lengthOf(0)
expect(ir.block.effect).lengthOf(0)
expect(ir.block.operation).toMatchObject([
{
elements: [0],
parent: 2,
},
- { type: IRNodeTypes.SET_INHERIT_ATTRS },
])
})
test('as root node', () => {
- const { ir, code, helpers } = compileWithOnce(`<div :id="foo" v-once />`)
+ const { ir, code } = compileWithOnce(`<div :id="foo" v-once />`)
expect(code).toMatchSnapshot()
- expect(helpers).lengthOf(0)
+
expect(ir.block.effect).lengthOf(0)
expect(ir.block.operation).toMatchObject([
{
],
},
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
expect(code).not.contains('effect')
})
test('on nested plain element', () => {
- const { ir, code, helpers } = compileWithOnce(
- `<div><div :id="foo" v-once /></div>`,
- )
+ const { ir, code } = compileWithOnce(`<div><div :id="foo" v-once /></div>`)
expect(code).toMatchSnapshot()
- expect(helpers).lengthOf(0)
+
expect(ir.block.effect).lengthOf(0)
expect(ir.block.operation).toMatchObject([
{
],
},
},
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
])
})
elements: [0],
parent: 1,
},
- { type: IRNodeTypes.SET_INHERIT_ATTRS },
])
})
test.todo('on slot outlet')
test('inside v-once', () => {
- const { ir, code, helpers } = compileWithOnce(
- `<div v-once><div v-once/></div>`,
- )
+ const { ir, code } = compileWithOnce(`<div v-once><div v-once/></div>`)
expect(code).toMatchSnapshot()
- expect(helpers).lengthOf(0)
+
expect(ir.block.effect).lengthOf(0)
- expect(ir.block.operation).lengthOf(1)
+ expect(ir.block.operation).lengthOf(0)
})
test.todo('with hoistStatic: true')
test('with v-if', () => {
- const { ir, code, helpers } = compileWithOnce(`<div v-if="expr" v-once />`)
+ const { ir, code } = compileWithOnce(`<div v-if="expr" v-once />`)
expect(code).toMatchSnapshot()
- expect(helpers).lengthOf(0)
+
expect(ir.block.effect).lengthOf(0)
expect(ir.block.operation).toMatchObject([
{
})
test('with v-if/else', () => {
- const { ir, code, helpers } = compileWithOnce(
+ const { ir, code } = compileWithOnce(
`<div v-if="expr" v-once /><p v-else/>`,
)
expect(code).toMatchSnapshot()
- expect(helpers).lengthOf(0)
+
expect(ir.block.effect).lengthOf(0)
expect(ir.block.operation).toMatchObject([
{
describe('v-text', () => {
test('should convert v-text to textContent', () => {
- const { code, ir, helpers, vaporHelpers } = compileWithVText(
- `<div v-text="str"></div>`,
- {
- bindingMetadata: {
- str: BindingTypes.SETUP_REF,
- },
+ const { code, ir, helpers } = compileWithVText(`<div v-text="str"></div>`, {
+ bindingMetadata: {
+ str: BindingTypes.SETUP_REF,
},
- )
-
- expect(vaporHelpers).contains('setText')
- expect(helpers.size).toBe(0)
+ })
- expect(ir.block.operation).toMatchObject([
- {
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- },
- ])
+ expect(helpers).contains('setText')
+ expect(ir.block.operation).toMatchObject([])
expect(ir.block.effect).toMatchObject([
{
CodegenOptions as BaseCodegenOptions,
BaseCodegenResult,
} from '@vue/compiler-dom'
-import type { BlockIRNode, RootIRNode, VaporHelper } from './ir'
+import type { BlockIRNode, CoreHelper, RootIRNode, VaporHelper } from './ir'
import { extend, remove } from '@vue/shared'
import { genBlockContent } from './generators/block'
import { genTemplates } from './generators/template'
options: Required<CodegenOptions>
helpers: Set<string> = new Set<string>([])
- vaporHelpers: Set<string> = new Set<string>([])
- helper = (name: string) => {
+
+ helper = (name: CoreHelper | VaporHelper) => {
this.helpers.add(name)
return `_${name}`
}
- vaporHelper = (name: VaporHelper) => {
- this.vaporHelpers.add(name)
- return `_${name}`
- }
delegates: Set<string> = new Set<string>()
export interface VaporCodegenResult extends BaseCodegenResult {
ast: RootIRNode
helpers: Set<string>
- vaporHelpers: Set<string>
}
// IR -> JS codegen
): VaporCodegenResult {
const [frag, push] = buildCodeFragment()
const context = new CodegenContext(ir, options)
- const { helpers, vaporHelpers } = context
+ const { helpers } = context
const { inline, bindingMetadata } = options
const functionName = 'render'
preamble,
map: map && map.toJSON(),
helpers,
- vaporHelpers,
}
}
-function genDelegates({ delegates, vaporHelper }: CodegenContext) {
+function genDelegates({ delegates, helper }: CodegenContext) {
return delegates.size
? genCall(
- vaporHelper('delegateEvents'),
+ helper('delegateEvents'),
...Array.from(delegates).map(v => `"${v}"`),
).join('') + '\n'
: ''
}
-function genHelperImports({ helpers, vaporHelpers, options }: CodegenContext) {
+function genHelperImports({ helpers, helper, options }: CodegenContext) {
let imports = ''
if (helpers.size) {
imports += `import { ${[...helpers]
.map(h => `${h} as _${h}`)
.join(', ')} } from '${options.runtimeModuleName}';\n`
}
- if (vaporHelpers.size) {
- imports += `import { ${[...vaporHelpers]
- .map(h => `${h} as _${h}`)
- .join(', ')} } from 'vue';\n`
- }
return imports
}
-import type { BlockIRNode, VaporHelper } from '../ir'
+import type { BlockIRNode, CoreHelper } from '../ir'
import {
type CodeFragment,
DELIMITERS_ARRAY,
function genResolveAssets(
kind: 'component' | 'directive',
- helper: VaporHelper,
+ helper: CoreHelper,
) {
for (const name of context.ir[kind]) {
push(
NEWLINE,
`const ${toValidAssetId(name, kind)} = `,
- ...genCall(context.vaporHelper(helper), JSON.stringify(name)),
+ ...genCall(context.helper(helper), JSON.stringify(name)),
)
}
}
} from '../ir'
import {
type CodeFragment,
- DELIMITERS_ARRAY,
DELIMITERS_ARRAY_NEWLINE,
DELIMITERS_OBJECT,
DELIMITERS_OBJECT_NEWLINE,
operation: CreateComponentIRNode,
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
const tag = genTag()
const { root, props, slots, once } = operation
`const n${operation.id} = `,
...genCall(
operation.asset
- ? vaporHelper('createComponentWithFallback')
- : vaporHelper('createComponent'),
+ ? helper('createComponentWithFallback')
+ : helper('createComponent'),
tag,
rawProps,
rawSlots,
function genTag() {
if (operation.dynamic) {
return genCall(
- vaporHelper('resolveDynamicComponent'),
+ helper('resolveDynamicComponent'),
genExpression(operation.dynamic, context),
)
} else if (operation.asset) {
props: IRProps[],
context: CodegenContext,
): CodeFragment[] | undefined {
- const { vaporHelper } = context
+ const { helper } = context
const frags: CodeFragment[][] = []
for (const p of props) {
let expr: CodeFragment[]
expr = genMulti(DELIMITERS_OBJECT, genProp(p, context))
else {
expr = genExpression(p.value, context)
- if (p.handler) expr = genCall(vaporHelper('toHandlers'), expr)
+ if (p.handler) expr = genCall(helper('toHandlers'), expr)
}
}
frags.push(['() => (', ...expr, ')'])
)
return [
...genCall(
- context.vaporHelper('createForSlots'),
+ context.helper('createForSlots'),
genExpression(source, context),
[
...genMulti(
opers: WithDirectiveIRNode[],
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
const element = `n${opers[0].element}`
const directiveItems = opers.map(genDirective)
const directives = genMulti(DELIMITERS_ARRAY, ...directiveItems)
- return [
- NEWLINE,
- ...genCall(vaporHelper('withDirectives'), element, directives),
- ]
+ return [NEWLINE, ...genCall(helper('withDirectives'), element, directives)]
function genDirective({
dir,
function genDirective() {
if (builtin) {
- return vaporHelper(name as any)
+ return helper(name as any)
} else if (asset) {
return toValidAssetId(name, 'directive')
} else {
export function genInsertNode(
{ parent, elements, anchor }: InsertNodeIRNode,
- { vaporHelper }: CodegenContext,
+ { helper }: CodegenContext,
): CodeFragment[] {
let element = elements.map(el => `n${el}`).join(', ')
if (elements.length > 1) element = `[${element}]`
return [
NEWLINE,
...genCall(
- vaporHelper('insert'),
+ helper('insert'),
element,
`n${parent}`,
anchor === undefined ? undefined : `n${anchor}`,
export function genPrependNode(
oper: PrependNodeIRNode,
- { vaporHelper }: CodegenContext,
+ { helper }: CodegenContext,
): CodeFragment[] {
return [
NEWLINE,
...genCall(
- vaporHelper('prepend'),
+ helper('prepend'),
`n${oper.parent}`,
...oper.elements.map(el => `n${el}`),
),
oper: SetEventIRNode,
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
const { element, key, keyOverride, value, modifiers, delegate, effect } = oper
const name = genName()
return [
NEWLINE,
...genCall(
- vaporHelper(delegate ? 'delegate' : 'on'),
+ helper(delegate ? 'delegate' : 'on'),
`n${element}`,
name,
handler,
oper: SetDynamicEventsIRNode,
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
return [
NEWLINE,
...genCall(
- vaporHelper('setDynamicEvents'),
+ helper('setDynamicEvents'),
`n${oper.element}`,
genExpression(oper.event, context),
),
function genIdentifier(
raw: string,
- { options, vaporHelper, identifiers }: CodegenContext,
+ { options, helper, identifiers }: CodegenContext,
loc?: SourceLocation,
assignment?: string,
id?: Identifier,
isAssignmentLVal || isUpdateArg || isDestructureAssignment
? (name = `${raw}.value`)
: assignment
- ? `${vaporHelper('isRef')}(${raw}) ? (${raw}.value = ${assignment}) : null`
+ ? `${helper('isRef')}(${raw}) ? (${raw}.value = ${assignment}) : null`
: unref()
break
default:
return assignment ? `${s} = ${assignment}` : s
}
function unref() {
- return `${vaporHelper('unref')}(${raw})`
+ return `${helper('unref')}(${raw})`
}
}
oper: ForIRNode,
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
const { source, value, key, index, render, keyProp, once, id, container } =
oper
]
blockFn = genCall(
- vaporHelper('withDestructure'),
+ helper('withDestructure'),
destructureAssignmentFn,
blockFn,
)
NEWLINE,
`const n${id} = `,
...genCall(
- vaporHelper('createFor'),
+ helper('createFor'),
sourceExpr,
blockFn,
genCallback(keyProp),
oper: SetHtmlIRNode,
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
return [
NEWLINE,
...genCall(
- vaporHelper('setHtml'),
+ helper('setHtml'),
`n${oper.element}`,
genExpression(oper.value, context),
),
context: CodegenContext,
isNested = false,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
const { condition, positive, negative, once } = oper
const [frag, push] = buildCodeFragment()
if (!isNested) push(NEWLINE, `const n${oper.id} = `)
push(
...genCall(
- vaporHelper('createIf'),
+ helper('createIf'),
conditionExpr,
positiveArg,
negativeArg,
oper: SetModelValueIRNode,
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
const name = oper.key.isStatic
? [JSON.stringify(`update:${camelize(oper.key.content)}`)]
: ['`update:${', ...genExpression(oper.key, context), '}`']
return [
NEWLINE,
- ...genCall(vaporHelper('delegate'), `n${oper.element}`, name, handler),
+ ...genCall(helper('delegate'), `n${oper.element}`, name, handler),
]
}
import { genSetHtml } from './html'
import { genIf } from './if'
import { genSetModelValue } from './modelValue'
-import { genDynamicProps, genSetInheritAttrs, genSetProp } from './prop'
+import { genDynamicProps, genSetProp } from './prop'
import { genDeclareOldRef, genSetTemplateRef } from './templateRef'
import { genCreateTextNode, genSetText } from './text'
import {
return genDeclareOldRef(oper)
case IRNodeTypes.SLOT_OUTLET_NODE:
return genSlotOutlet(oper, context)
- case IRNodeTypes.SET_INHERIT_ATTRS:
- return genSetInheritAttrs(oper, context)
}
return []
{ operations }: IREffect,
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
const [frag, push] = buildCodeFragment(
NEWLINE,
- `${vaporHelper('renderEffect')}(() => `,
+ `${helper('renderEffect')}(() => `,
)
const [operationsExps, pushOps] = buildCodeFragment()
IRDynamicPropsKind,
type IRProp,
type SetDynamicPropsIRNode,
- type SetInheritAttrsIRNode,
type SetPropIRNode,
type VaporHelper,
} from '../ir'
oper: SetPropIRNode,
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
const {
prop: { key, values, modifier },
tag,
return [
NEWLINE,
...genCall(
- [vaporHelper(helperName), null],
+ [helper(helperName), null],
`n${oper.element}`,
omitKey ? false : genExpression(key, context),
genPropValue(values, context),
oper: SetDynamicPropsIRNode,
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
return [
NEWLINE,
...genCall(
- vaporHelper('setDynamicProps'),
+ helper('setDynamicProps'),
`n${oper.element}`,
genMulti(
DELIMITERS_ARRAY,
)
}
-export function genSetInheritAttrs(
- { staticProps, dynamicProps }: SetInheritAttrsIRNode,
- context: CodegenContext,
-): CodeFragment[] {
- const { vaporHelper } = context
-
- // - `undefined` : no props
- // - `false` : all props are static
- // - `string[]` : list of props are dynamic
- // - `true` : all props as dynamic
- const value =
- dynamicProps === true
- ? 'true'
- : dynamicProps.length
- ? genMulti(
- DELIMITERS_ARRAY,
- ...dynamicProps.map(p => JSON.stringify(p)),
- )
- : staticProps
- ? 'false'
- : null
- if (value == null) return []
- return [NEWLINE, ...genCall(vaporHelper('setInheritAttrs'), value)]
-}
-
function getRuntimeHelper(
tag: string,
keyName: string,
oper: SlotOutletIRNode,
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
const { id, name, fallback } = oper
const [frag, push] = buildCodeFragment()
NEWLINE,
`const n${id} = `,
...genCall(
- vaporHelper('createSlot'),
+ helper('createSlot'),
nameExpr,
genRawProps(oper.props, context) || 'null',
fallbackArg,
export function genTemplates(
templates: string[],
- { vaporHelper }: CodegenContext,
+ { helper }: CodegenContext,
): string {
return templates
.map(
(template, i) =>
- `const t${i} = ${vaporHelper('template')}(${JSON.stringify(template)})\n`,
+ `const t${i} = ${helper('template')}(${JSON.stringify(template)})\n`,
)
.join('')
}
from: number,
paths: number[] = [],
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
const [frag, push] = buildCodeFragment()
let offset = 0
const { children, id, template } = dynamic
if (offset === 1) {
push(`n${prev[0]}.nextSibling`)
} else {
- push(...genCall(vaporHelper('next'), `n${prev[0]}`, String(offset)))
+ push(...genCall(helper('next'), `n${prev[0]}`, String(offset)))
}
} else {
if (newPaths.length === 1 && newPaths[0] === 0) {
push(`n${from}.firstChild`)
} else {
push(
- ...genCall(
- vaporHelper('children'),
- `n${from}`,
- ...newPaths.map(String),
- ),
+ ...genCall(helper('children'), `n${from}`, ...newPaths.map(String)),
)
}
}
oper: SetTemplateRefIRNode,
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
return [
NEWLINE,
oper.effect && `r${oper.element} = `,
...genCall(
- vaporHelper('setRef'),
+ helper('setRef'),
`n${oper.element}`,
genExpression(oper.value, context),
oper.effect ? `r${oper.element}` : oper.refFor ? 'void 0' : undefined,
oper: SetTextIRNode,
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
const { element, values } = oper
return [
NEWLINE,
...genCall(
- vaporHelper('setText'),
+ helper('setText'),
`n${element}`,
...values.map(value => genExpression(value, context)),
),
oper: CreateTextNodeIRNode,
context: CodegenContext,
): CodeFragment[] {
- const { vaporHelper } = context
+ const { helper } = context
const { id, values, effect } = oper
return [
NEWLINE,
`const n${id} = `,
- ...genCall(vaporHelper('createTextNode'), [
+ ...genCall(helper('createTextNode'), [
effect && '() => ',
...genMulti(
DELIMITERS_ARRAY,
SET_HTML,
SET_TEMPLATE_REF,
SET_MODEL_VALUE,
- SET_INHERIT_ATTRS,
INSERT_NODE,
PREPEND_NODE,
type: IRNodeTypes
}
+export type CoreHelper = keyof typeof import('packages/runtime-core/src')
+
export type VaporHelper = keyof typeof import('packages/runtime-vapor/src')
export interface BlockIRNode extends BaseIRNode {
isComponent: boolean
}
-export interface SetInheritAttrsIRNode extends BaseIRNode {
- type: IRNodeTypes.SET_INHERIT_ATTRS
- staticProps: boolean
- dynamicProps: true | string[]
-}
-
export interface CreateTextNodeIRNode extends BaseIRNode {
type: IRNodeTypes.CREATE_TEXT_NODE
id: number
| SetHtmlIRNode
| SetTemplateRefIRNode
| SetModelValueIRNode
- | SetInheritAttrsIRNode
| CreateTextNodeIRNode
| InsertNodeIRNode
| PrependNodeIRNode
template += `<${tag}`
if (scopeId) template += ` ${scopeId}`
- let staticProps = false
const dynamicProps: string[] = []
if (propsResult[0] /* dynamic props */) {
const [, dynamicArgs, expressions] = propsResult
for (const prop of propsResult[1]) {
const { key, values } = prop
if (key.isStatic && values.length === 1 && values[0].isStatic) {
- staticProps = true
template += ` ${key.content}`
if (values[0].content) template += `="${values[0].content}"`
} else {
}
}
- if (singleRoot) {
- context.registerOperation({
- type: IRNodeTypes.SET_INHERIT_ATTRS,
- staticProps: staticProps,
- dynamicProps: propsResult[0] ? true : dynamicProps,
- })
- }
-
template += `>` + context.childrenTemplate.join('')
// TODO remove unnecessary close tag, e.g. if it's the last element of the template
if (!isVoidTag(tag)) {