@vue/compiler-ssr - npm Package Compare versions

Comparing version 3.0.0-beta.15 to 3.0.0-beta.16

dist/compiler-ssr.cjs.js

@@ -396,19 +396,25 @@ 'use strict';
 const ssrTransformElement = (node, context) => {
-    if (node.type === 1 /* ELEMENT */ &&
-        node.tagType === 0 /* ELEMENT */) {
-        return function ssrPostTransformElement() {
-            // element
-            // generate the template literal representing the open tag.
-            const openTag = [`<${node.tag}`];
-            // some tags need to be pasesd to runtime for special checks
-            const needTagForRuntime = node.tag === 'textarea' || node.tag.indexOf('-') > 0;
-            // v-bind="obj" or v-bind:[key] can potentially overwrite other static
-            // attrs and can affect final rendering result, so when they are present
-            // we need to bail out to full `renderAttrs`
-            const hasDynamicVBind = compilerDom.hasDynamicKeyVBind(node);
-            if (hasDynamicVBind) {
-                const { props } = compilerDom.buildProps(node, context, node.props, true /* ssr */);
-                if (props) {
-                    const propsExp = compilerDom.createCallExpression(context.helper(SSR_RENDER_ATTRS), [props]);
-                    if (node.tag === 'textarea') {
+    if (node.type !== 1 /* ELEMENT */ ||
+        node.tagType !== 0 /* ELEMENT */) {
+        return;
+    }
+    return function ssrPostTransformElement() {
+        // element
+        // generate the template literal representing the open tag.
+        const openTag = [`<${node.tag}`];
+        // some tags need to be pasesd to runtime for special checks
+        const needTagForRuntime = node.tag === 'textarea' || node.tag.indexOf('-') > 0;
+        // v-bind="obj" or v-bind:[key] can potentially overwrite other static
+        // attrs and can affect final rendering result, so when they are present
+        // we need to bail out to full `renderAttrs`
+        const hasDynamicVBind = compilerDom.hasDynamicKeyVBind(node);
+        if (hasDynamicVBind) {
+            const { props } = compilerDom.buildProps(node, context, node.props, true /* ssr */);
+            if (props) {
+                const propsExp = compilerDom.createCallExpression(context.helper(SSR_RENDER_ATTRS), [props]);
+                if (node.tag === 'textarea') {
+                    const existingText = node.children[0];
+                    // If interpolation, this is dynamic <textarea> content, potentially
+                    // injected by v-model and takes higher priority than v-bind value
+                    if (!existingText || existingText.type !== 5 /* INTERPOLATION */) {
                         // <textarea> with dynamic v-bind. We don't know if the final props
@@ -422,3 +428,2 @@ // will contain .value, so we will have to do something special:
                         ];
-                        const existingText = node.children[0];
                         rawChildrenMap.set(node, compilerDom.createCallExpression(context.helper(SSR_INTERPOLATE), [
@@ -428,143 +433,143 @@ compilerDom.createConditionalExpression(compilerDom.createSimpleExpression(`"value" in ${tempId}`, false), compilerDom.createSimpleExpression(`${tempId}.value`, false), compilerDom.createSimpleExpression(existingText ? existingText.content : ``, true), false)
                     }
-                    else if (node.tag === 'input') {
-                        // <input v-bind="obj" v-model>
-                        // we need to determine the props to render for the dynamic v-model
-                        // and merge it with the v-bind expression.
-                        const vModel = findVModel(node);
-                        if (vModel) {
-                            // 1. save the props (san v-model) in a temp variable
-                            const tempId = `_temp${context.temps++}`;
-                            const tempExp = compilerDom.createSimpleExpression(tempId, false);
-                            propsExp.arguments = [
-                                compilerDom.createSequenceExpression([
-                                    compilerDom.createAssignmentExpression(tempExp, props),
-                                    compilerDom.createCallExpression(context.helper(compilerDom.MERGE_PROPS), [
+                }
+                else if (node.tag === 'input') {
+                    // <input v-bind="obj" v-model>
+                    // we need to determine the props to render for the dynamic v-model
+                    // and merge it with the v-bind expression.
+                    const vModel = findVModel(node);
+                    if (vModel) {
+                        // 1. save the props (san v-model) in a temp variable
+                        const tempId = `_temp${context.temps++}`;
+                        const tempExp = compilerDom.createSimpleExpression(tempId, false);
+                        propsExp.arguments = [
+                            compilerDom.createSequenceExpression([
+                                compilerDom.createAssignmentExpression(tempExp, props),
+                                compilerDom.createCallExpression(context.helper(compilerDom.MERGE_PROPS), [
+                                    tempExp,
+                                    compilerDom.createCallExpression(context.helper(SSR_GET_DYNAMIC_MODEL_PROPS), [
                                         tempExp,
-                                        compilerDom.createCallExpression(context.helper(SSR_GET_DYNAMIC_MODEL_PROPS), [
-                                            tempExp,
-                                            vModel.exp // model
-                                        ])
+                                        vModel.exp // model
                                     ])
                                 ])
-                            ];
-                        }
+                            ])
+                        ];
                     }
-                    if (needTagForRuntime) {
-                        propsExp.arguments.push(`"${node.tag}"`);
-                    }
-                    openTag.push(propsExp);
                 }
+                if (needTagForRuntime) {
+                    propsExp.arguments.push(`"${node.tag}"`);
+                }
+                openTag.push(propsExp);
             }
-            // book keeping static/dynamic class merging.
-            let dynamicClassBinding = undefined;
-            let staticClassBinding = undefined;
-            // all style bindings are converted to dynamic by transformStyle.
-            // but we need to make sure to merge them.
-            let dynamicStyleBinding = undefined;
-            for (let i = 0; i < node.props.length; i++) {
-                const prop = node.props[i];
-                // special cases with children override
-                if (prop.type === 7 /* DIRECTIVE */) {
-                    if (prop.name === 'html' && prop.exp) {
-                        rawChildrenMap.set(node, prop.exp);
-                    }
-                    else if (prop.name === 'text' && prop.exp) {
+        }
+        // book keeping static/dynamic class merging.
+        let dynamicClassBinding = undefined;
+        let staticClassBinding = undefined;
+        // all style bindings are converted to dynamic by transformStyle.
+        // but we need to make sure to merge them.
+        let dynamicStyleBinding = undefined;
+        for (let i = 0; i < node.props.length; i++) {
+            const prop = node.props[i];
+            // special cases with children override
+            if (prop.type === 7 /* DIRECTIVE */) {
+                if (prop.name === 'html' && prop.exp) {
+                    rawChildrenMap.set(node, prop.exp);
+                }
+                else if (prop.name === 'text' && prop.exp) {
+                    node.children = [compilerDom.createInterpolation(prop.exp, prop.loc)];
+                }
+                else if (prop.name === 'slot') {
+                    context.onError(compilerDom.createCompilerError(37 /* X_V_SLOT_MISPLACED */, prop.loc));
+                }
+                else if (isTextareaWithValue(node, prop) && prop.exp) {
+                    if (!hasDynamicVBind) {
                         node.children = [compilerDom.createInterpolation(prop.exp, prop.loc)];
                     }
-                    else if (prop.name === 'slot') {
-                        context.onError(compilerDom.createCompilerError(37 /* X_V_SLOT_MISPLACED */, prop.loc));
+                }
+                else {
+                    // Directive transforms.
+                    const directiveTransform = context.directiveTransforms[prop.name];
+                    if (!directiveTransform) {
+                        // no corresponding ssr directive transform found.
+                        context.onError(createSSRCompilerError(57 /* X_SSR_CUSTOM_DIRECTIVE_NO_TRANSFORM */, prop.loc));
                     }
-                    else if (isTextareaWithValue(node, prop) && prop.exp) {
-                        if (!hasDynamicVBind) {
-                            node.children = [compilerDom.createInterpolation(prop.exp, prop.loc)];
+                    else if (!hasDynamicVBind) {
+                        const { props, ssrTagParts } = directiveTransform(prop, node, context);
+                        if (ssrTagParts) {
+                            openTag.push(...ssrTagParts);
                         }
-                    }
-                    else {
-                        // Directive transforms.
-                        const directiveTransform = context.directiveTransforms[prop.name];
-                        if (!directiveTransform) {
-                            // no corresponding ssr directive transform found.
-                            context.onError(createSSRCompilerError(57 /* X_SSR_CUSTOM_DIRECTIVE_NO_TRANSFORM */, prop.loc));
-                        }
-                        else if (!hasDynamicVBind) {
-                            const { props, ssrTagParts } = directiveTransform(prop, node, context);
-                            if (ssrTagParts) {
-                                openTag.push(...ssrTagParts);
-                            }
-                            for (let j = 0; j < props.length; j++) {
-                                const { key, value } = props[j];
-                                if (key.type === 4 /* SIMPLE_EXPRESSION */ && key.isStatic) {
-                                    let attrName = key.content;
-                                    // static key attr
-                                    if (attrName === 'class') {
-                                        openTag.push(` class="`, (dynamicClassBinding = compilerDom.createCallExpression(context.helper(SSR_RENDER_CLASS), [value])), `"`);
+                        for (let j = 0; j < props.length; j++) {
+                            const { key, value } = props[j];
+                            if (key.type === 4 /* SIMPLE_EXPRESSION */ && key.isStatic) {
+                                let attrName = key.content;
+                                // static key attr
+                                if (attrName === 'class') {
+                                    openTag.push(` class="`, (dynamicClassBinding = compilerDom.createCallExpression(context.helper(SSR_RENDER_CLASS), [value])), `"`);
+                                }
+                                else if (attrName === 'style') {
+                                    if (dynamicStyleBinding) {
+                                        // already has style binding, merge into it.
+                                        mergeCall(dynamicStyleBinding, value);
                                     }
-                                    else if (attrName === 'style') {
-                                        if (dynamicStyleBinding) {
-                                            // already has style binding, merge into it.
-                                            mergeCall(dynamicStyleBinding, value);
-                                        }
-                                        else {
-                                            openTag.push(` style="`, (dynamicStyleBinding = compilerDom.createCallExpression(context.helper(SSR_RENDER_STYLE), [value])), `"`);
-                                        }
-                                    }
                                     else {
-                                        attrName =
-                                            node.tag.indexOf('-') > 0
-                                                ? attrName // preserve raw name on custom elements
-                                                : shared.propsToAttrMap[attrName] || attrName.toLowerCase();
-                                        if (shared.isBooleanAttr(attrName)) {
-                                            openTag.push(compilerDom.createConditionalExpression(value, compilerDom.createSimpleExpression(' ' + attrName, true), compilerDom.createSimpleExpression('', true), false /* no newline */));
-                                        }
-                                        else if (shared.isSSRSafeAttrName(attrName)) {
-                                            openTag.push(compilerDom.createCallExpression(context.helper(SSR_RENDER_ATTR), [
-                                                key,
-                                                value
-                                            ]));
-                                        }
-                                        else {
-                                            context.onError(createSSRCompilerError(58 /* X_SSR_UNSAFE_ATTR_NAME */, key.loc));
-                                        }
+                                        openTag.push(` style="`, (dynamicStyleBinding = compilerDom.createCallExpression(context.helper(SSR_RENDER_STYLE), [value])), `"`);
                                     }
                                 }
                                 else {
-                                    // dynamic key attr
-                                    // this branch is only encountered for custom directive
-                                    // transforms that returns properties with dynamic keys
-                                    const args = [key, value];
-                                    if (needTagForRuntime) {
-                                        args.push(`"${node.tag}"`);
+                                    attrName =
+                                        node.tag.indexOf('-') > 0
+                                            ? attrName // preserve raw name on custom elements
+                                            : shared.propsToAttrMap[attrName] || attrName.toLowerCase();
+                                    if (shared.isBooleanAttr(attrName)) {
+                                        openTag.push(compilerDom.createConditionalExpression(value, compilerDom.createSimpleExpression(' ' + attrName, true), compilerDom.createSimpleExpression('', true), false /* no newline */));
                                     }
-                                    openTag.push(compilerDom.createCallExpression(context.helper(SSR_RENDER_DYNAMIC_ATTR), args));
+                                    else if (shared.isSSRSafeAttrName(attrName)) {
+                                        openTag.push(compilerDom.createCallExpression(context.helper(SSR_RENDER_ATTR), [
+                                            key,
+                                            value
+                                        ]));
+                                    }
+                                    else {
+                                        context.onError(createSSRCompilerError(58 /* X_SSR_UNSAFE_ATTR_NAME */, key.loc));
+                                    }
                                 }
                             }
+                            else {
+                                // dynamic key attr
+                                // this branch is only encountered for custom directive
+                                // transforms that returns properties with dynamic keys
+                                const args = [key, value];
+                                if (needTagForRuntime) {
+                                    args.push(`"${node.tag}"`);
+                                }
+                                openTag.push(compilerDom.createCallExpression(context.helper(SSR_RENDER_DYNAMIC_ATTR), args));
+                            }
                         }
                     }
                 }
-                else {
-                    // special case: value on <textarea>
-                    if (node.tag === 'textarea' && prop.name === 'value' && prop.value) {
-                        rawChildrenMap.set(node, shared.escapeHtml(prop.value.content));
+            }
+            else {
+                // special case: value on <textarea>
+                if (node.tag === 'textarea' && prop.name === 'value' && prop.value) {
+                    rawChildrenMap.set(node, shared.escapeHtml(prop.value.content));
+                }
+                else if (!hasDynamicVBind) {
+                    // static prop
+                    if (prop.name === 'class' && prop.value) {
+                        staticClassBinding = JSON.stringify(prop.value.content);
                     }
-                    else if (!hasDynamicVBind) {
-                        // static prop
-                        if (prop.name === 'class' && prop.value) {
-                            staticClassBinding = JSON.stringify(prop.value.content);
-                        }
-                        openTag.push(` ${prop.name}` +
-                            (prop.value ? `="${shared.escapeHtml(prop.value.content)}"` : ``));
-                    }
+                    openTag.push(` ${prop.name}` +
+                        (prop.value ? `="${shared.escapeHtml(prop.value.content)}"` : ``));
                 }
             }
-            // handle co-existence of dynamic + static class bindings
-            if (dynamicClassBinding && staticClassBinding) {
-                mergeCall(dynamicClassBinding, staticClassBinding);
-                removeStaticBinding(openTag, 'class');
-            }
-            if (context.scopeId) {
-                openTag.push(` ${context.scopeId}`);
-            }
-            node.ssrCodegenNode = compilerDom.createTemplateLiteral(openTag);
-        };
-    }
+        }
+        // handle co-existence of dynamic + static class bindings
+        if (dynamicClassBinding && staticClassBinding) {
+            mergeCall(dynamicClassBinding, staticClassBinding);
+            removeStaticBinding(openTag, 'class');
+        }
+        if (context.scopeId) {
+            openTag.push(` ${context.scopeId}`);
+        }
+        node.ssrCodegenNode = compilerDom.createTemplateLiteral(openTag);
+    };
 };
@@ -852,2 +857,37 @@ function isTextareaWithValue(node, prop) {
 
+const hasSingleChild = (node) => node.children.filter(n => n.type !== 3 /* COMMENT */).length === 1;
+const ssrInjectFallthroughAttrs = (node, context) => {
+    // _attrs is provided as a function argument.
+    // mark it as a known identifier so that it doesn't get prefixed by
+    // transformExpression.
+    if (node.type === 0 /* ROOT */) {
+        context.identifiers._attrs = 1;
+    }
+    const parent = context.parent;
+    if (!parent || parent.type !== 0 /* ROOT */) {
+        return;
+    }
+    if (node.type === 10 /* IF_BRANCH */ && hasSingleChild(node)) {
+        injectFallthroughAttrs(node.children[0]);
+    }
+    else if (hasSingleChild(parent)) {
+        injectFallthroughAttrs(node);
+    }
+};
+function injectFallthroughAttrs(node) {
+    if (node.type === 1 /* ELEMENT */ &&
+        (node.tagType === 0 /* ELEMENT */ ||
+            node.tagType === 1 /* COMPONENT */) &&
+        !compilerDom.findDir(node, 'for')) {
+        node.props.push({
+            type: 7 /* DIRECTIVE */,
+            name: 'bind',
+            arg: undefined,
+            exp: compilerDom.createSimpleExpression(`_attrs`, false),
+            modifiers: [],
+            loc: compilerDom.locStub
+        });
+    }
+}
+
 function compile(template, options = {}) {
@@ -878,2 +918,3 @@ options = {
             ssrTransformSlotOutlet,
+            ssrInjectFallthroughAttrs,
             ssrTransformElement,
@@ -880,0 +921,0 @@ ssrTransformComponent,

package.json

 {
   "name": "@vue/compiler-ssr",
-  "version": "3.0.0-beta.15",
+  "version": "3.0.0-beta.16",
   "description": "@vue/compiler-ssr",
@@ -30,5 +30,5 @@ "main": "dist/compiler-ssr.cjs.js",
   "dependencies": {
-    "@vue/shared": "3.0.0-beta.15",
-    "@vue/compiler-dom": "3.0.0-beta.15"
+    "@vue/shared": "3.0.0-beta.16",
+    "@vue/compiler-dom": "3.0.0-beta.16"
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

43029

increased by2.27%

Lines of code

927

increased by4.51%

Dependency changes

• + Added@vue/compiler-core@3.0.0-beta.16(transitive)

• + Added@vue/compiler-dom@3.0.0-beta.16(transitive)

• + Added@vue/shared@3.0.0-beta.16(transitive)

• - Removed@vue/compiler-core@3.0.0-beta.15(transitive)

• - Removed@vue/compiler-dom@3.0.0-beta.15(transitive)

• - Removed@vue/shared@3.0.0-beta.15(transitive)

• Updated@vue/compiler-dom@3.0.0-beta.16

• Updated@vue/shared@3.0.0-beta.16