@vue/runtime-dom 3.5.0-beta.3 → 3.5.0

package/dist/runtime-dom.global.js

@@ -1,5 +1,5 @@
 /**
-* @vue/runtime-dom v3.5.0-beta.3
+* @vue/runtime-dom v3.5.0
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
@@ -217,6 +217,14 @@ var VueRuntimeDOM = (function (exports) {
     return type === "string" || type === "number" || type === "boolean";
   }
 
+  const cssVarNameEscapeSymbolsRE = /[ !"#$%&'()*+,./:;<=>?@[\\\]^`{|}~]/g;
+  function getEscapedCssVarName(key, doubleEscape) {
+    return key.replace(
+      cssVarNameEscapeSymbolsRE,
+      (s) => `\\${s}`
+    );
+  }
+
   function looseCompareArrays(a, b) {
     if (a.length !== b.length) return false;
     let equal = true;
@@ -340,12 +348,13 @@ var VueRuntimeDOM = (function (exports) {
     pause() {
       if (this._active) {
         this._isPaused = true;
+        let i, l;
         if (this.scopes) {
-          for (let i = 0, l = this.scopes.length; i < l; i++) {
+          for (i = 0, l = this.scopes.length; i < l; i++) {
             this.scopes[i].pause();
           }
         }
-        for (let i = 0, l = this.effects.length; i < l; i++) {
+        for (i = 0, l = this.effects.length; i < l; i++) {
           this.effects[i].pause();
         }
       }
@@ -357,12 +366,13 @@ var VueRuntimeDOM = (function (exports) {
       if (this._active) {
         if (this._isPaused) {
           this._isPaused = false;
+          let i, l;
           if (this.scopes) {
-            for (let i = 0, l = this.scopes.length; i < l; i++) {
+            for (i = 0, l = this.scopes.length; i < l; i++) {
               this.scopes[i].resume();
             }
           }
-          for (let i = 0, l = this.effects.length; i < l; i++) {
+          for (i = 0, l = this.effects.length; i < l; i++) {
             this.effects[i].resume();
           }
         }
@@ -555,11 +565,9 @@ var VueRuntimeDOM = (function (exports) {
     batchDepth++;
   }
   function endBatch() {
-    if (batchDepth > 1) {
-      batchDepth--;
+    if (--batchDepth > 0) {
       return;
     }
-    batchDepth--;
     let error;
     while (batchedEffect) {
       let e = batchedEffect;
@@ -1076,7 +1084,7 @@ var VueRuntimeDOM = (function (exports) {
     const needsWrap = arr !== self && !isShallow(self);
     const methodFn = arr[method];
     if (methodFn !== arrayProto[method]) {
-      const result2 = methodFn.apply(arr, args);
+      const result2 = methodFn.apply(self, args);
       return needsWrap ? toReactive(result2) : result2;
     }
     let wrappedFn = fn;
@@ -1218,7 +1226,12 @@ var VueRuntimeDOM = (function (exports) {
         }
       }
       const hadKey = isArray(target) && isIntegerKey(key) ? Number(key) < target.length : hasOwn(target, key);
-      const result = Reflect.set(target, key, value, receiver);
+      const result = Reflect.set(
+        target,
+        key,
+        value,
+        isRef(target) ? target : receiver
+      );
       if (target === toRaw(receiver)) {
         if (!hadKey) {
           trigger(target, "add", key, value);
@@ -2031,18 +2044,25 @@ var VueRuntimeDOM = (function (exports) {
       const depth = deep === true ? Infinity : deep;
       getter = () => traverse(baseGetter(), depth);
     }
+    const scope = getCurrentScope();
+    const watchHandle = () => {
+      effect.stop();
+      if (scope) {
+        remove(scope.effects, effect);
+      }
+    };
     if (once) {
       if (cb) {
         const _cb = cb;
         cb = (...args) => {
           _cb(...args);
-          effect.stop();
+          watchHandle();
         };
       } else {
         const _getter = getter;
         getter = () => {
           _getter();
-          effect.stop();
+          watchHandle();
         };
       }
     }
@@ -2111,13 +2131,6 @@ var VueRuntimeDOM = (function (exports) {
     } else {
       effect.run();
     }
-    const scope = getCurrentScope();
-    const watchHandle = () => {
-      effect.stop();
-      if (scope) {
-        remove(scope.effects, effect);
-      }
-    };
     watchHandle.pause = effect.pause.bind(effect);
     watchHandle.resume = effect.resume.bind(effect);
     watchHandle.stop = watchHandle;
@@ -3566,7 +3579,7 @@ var VueRuntimeDOM = (function (exports) {
   // @__NO_SIDE_EFFECTS__
   function defineComponent(options, extraOptions) {
     return isFunction(options) ? (
-      // #8326: extend call and options.name access are considered side-effects
+      // #8236: extend call and options.name access are considered side-effects
       // by Rollup, so we have to wrap it in a pure-annotated IIFE.
       /* @__PURE__ */ (() => extend({ name: options.name }, extraOptions, { setup: options }))()
     ) : options;
@@ -4002,8 +4015,7 @@ Server rendered element contains more child nodes than client vdom.`
         const isText = vnode.type === Text;
         if (node) {
           if (isText && !optimized) {
-            let next = children[i + 1];
-            if (next && (next = normalizeVNode(next)).type === Text) {
+            if (i + 1 < l && normalizeVNode(children[i + 1]).type === Text) {
               insert(
                 createText(
                   node.data.slice(vnode.children.length)
@@ -4259,7 +4271,10 @@ Server rendered element contains fewer child nodes than client vdom.`
     if (instance.getCssVars && (vnode === root || root && root.type === Fragment && root.children.includes(vnode))) {
       const cssVars = instance.getCssVars();
       for (const key in cssVars) {
-        expectedMap.set(`--${key}`, String(cssVars[key]));
+        expectedMap.set(
+          `--${getEscapedCssVarName(key)}`,
+          String(cssVars[key])
+        );
       }
     }
     if (vnode === root && instance.parent) {
@@ -4687,6 +4702,7 @@ Server rendered element contains fewer child nodes than client vdom.`
         );
         const { include, exclude, max } = props;
         if (include && (!name || !matches(include, name)) || exclude && name && matches(exclude, name)) {
+          vnode.shapeFlag &= ~256;
           current = vnode;
           return rawVNode;
         }
@@ -10302,7 +10318,7 @@ Component that was made reactive: `,
     return true;
   }
 
-  const version = "3.5.0-beta.3";
+  const version = "3.5.0";
   const warn = warn$1 ;
   const ErrorTypeStrings = ErrorTypeStrings$1 ;
   const devtools = devtools$1 ;
@@ -10912,15 +10928,20 @@ Component that was made reactive: `,
 
   function patchDOMProp(el, key, value, parentComponent) {
     if (key === "innerHTML" || key === "textContent") {
-      if (value == null) return;
-      el[key] = value;
+      if (value != null) {
+        el[key] = key === "innerHTML" ? unsafeToTrustedHTML(value) : value;
+      }
       return;
     }
     const tag = el.tagName;
     if (key === "value" && tag !== "PROGRESS" && // custom elements may use _value internally
     !tag.includes("-")) {
       const oldValue = tag === "OPTION" ? el.getAttribute("value") || "" : el.value;
-      const newValue = value == null ? "" : String(value);
+      const newValue = value == null ? (
+        // #11647: value should be set as empty string for null and undefined,
+        // but <input type="checkbox"> should be set as 'on'.
+        el.type === "checkbox" ? "on" : ""
+      ) : String(value);
       if (oldValue !== newValue || !("_value" in el)) {
         el.value = newValue;
       }
@@ -11340,6 +11361,9 @@ Expected function or array of functions, received type ${typeof value}.`
           delete this._props[key];
         } else {
           this._props[key] = val;
+          if (key === "key" && this._app) {
+            this._app._ceVNode.key = val;
+          }
         }
         if (shouldUpdate && this._instance) {
           this._update();
@@ -11766,12 +11790,16 @@ Expected function or array of functions, received type ${typeof value}.`
   };
   function setChecked(el, { value, oldValue }, vnode) {
     el._modelValue = value;
+    let checked;
     if (isArray(value)) {
-      el.checked = looseIndexOf(value, vnode.props.value) > -1;
+      checked = looseIndexOf(value, vnode.props.value) > -1;
     } else if (isSet(value)) {
-      el.checked = value.has(vnode.props.value);
-    } else if (value !== oldValue) {
-      el.checked = looseEqual(value, getCheckboxValue(el, true));
+      checked = value.has(vnode.props.value);
+    } else {
+      checked = looseEqual(value, getCheckboxValue(el, true));
+    }
+    if (el.checked !== checked) {
+      el.checked = checked;
     }
   }
   const vModelRadio = {