@vue/runtime-dom 3.2.20 → 3.2.21

package/dist/runtime-dom.global.js

@@ -1574,11 +1574,12 @@ var VueRuntimeDOM = (function (exports) {
   }
 
   let buffer = [];
+  let devtoolsNotInstalled = false;
   function emit(event, ...args) {
       if (exports.devtools) {
           exports.devtools.emit(event, ...args);
       }
-      else {
+      else if (!devtoolsNotInstalled) {
           buffer.push({ event, args });
       }
   }
@@ -1589,7 +1590,13 @@ var VueRuntimeDOM = (function (exports) {
           buffer.forEach(({ event, args }) => exports.devtools.emit(event, ...args));
           buffer = [];
       }
-      else {
+      else if (
+      // handle late devtools injection - only do this if we are in an actual
+      // browser environment to avoid the timer handle stalling test runner exit
+      // (#4815)
+      // eslint-disable-next-line no-restricted-globals
+      typeof window !== 'undefined' &&
+          !navigator.userAgent.includes('jsdom')) {
           const replay = (target.__VUE_DEVTOOLS_HOOK_REPLAY__ =
               target.__VUE_DEVTOOLS_HOOK_REPLAY__ || []);
           replay.push((newHook) => {
@@ -1598,9 +1605,18 @@ var VueRuntimeDOM = (function (exports) {
           // clear buffer after 3s - the user probably doesn't have devtools installed
           // at all, and keeping the buffer will cause memory leaks (#4738)
           setTimeout(() => {
-              buffer = [];
+              if (!exports.devtools) {
+                  target.__VUE_DEVTOOLS_HOOK_REPLAY__ = null;
+                  devtoolsNotInstalled = true;
+                  buffer = [];
+              }
           }, 3000);
       }
+      else {
+          // non-browser env, assume not installed
+          devtoolsNotInstalled = true;
+          buffer = [];
+      }
   }
   function devtoolsInitApp(app, version) {
       emit("app:init" /* APP_INIT */, app, version, {
@@ -4388,7 +4404,7 @@ var VueRuntimeDOM = (function (exports) {
     [bar, this.y]
   ])
   */
-  const isBuiltInDirective = /*#__PURE__*/ makeMap('bind,cloak,else-if,else,for,html,if,model,on,once,pre,show,slot,text');
+  const isBuiltInDirective = /*#__PURE__*/ makeMap('bind,cloak,else-if,else,for,html,if,model,on,once,pre,show,slot,text,memo');
   function validateDirectiveName(name) {
       if (isBuiltInDirective(name)) {
           warn$1('Do not use built-in directive ids as custom directive id: ' + name);
@@ -8945,7 +8961,7 @@ var VueRuntimeDOM = (function (exports) {
   }
 
   // Core API ------------------------------------------------------------------
-  const version = "3.2.20";
+  const version = "3.2.21";
   /**
    * SSR utils for \@vue/server-renderer. Only exposed in cjs builds.
    * @internal
@@ -9067,16 +9083,8 @@ var VueRuntimeDOM = (function (exports) {
 
   function patchStyle(el, prev, next) {
       const style = el.style;
-      const currentDisplay = style.display;
-      if (!next) {
-          el.removeAttribute('style');
-      }
-      else if (isString(next)) {
-          if (prev !== next) {
-              style.cssText = next;
-          }
-      }
-      else {
+      const isCssString = isString(next);
+      if (next && !isCssString) {
           for (const key in next) {
               setStyle(style, key, next[key]);
           }
@@ -9088,11 +9096,22 @@ var VueRuntimeDOM = (function (exports) {
               }
           }
       }
-      // indicates that the `display` of the element is controlled by `v-show`,
-      // so we always keep the current `display` value regardless of the `style` value,
-      // thus handing over control to `v-show`.
-      if ('_vod' in el) {
-          style.display = currentDisplay;
+      else {
+          const currentDisplay = style.display;
+          if (isCssString) {
+              if (prev !== next) {
+                  style.cssText = next;
+              }
+          }
+          else if (prev) {
+              el.removeAttribute('style');
+          }
+          // indicates that the `display` of the element is controlled by `v-show`,
+          // so we always keep the current `display` value regardless of the `style`
+          // value, thus handing over control to `v-show`.
+          if ('_vod' in el) {
+              style.display = currentDisplay;
+          }
       }
   }
   const importantRE = /\s*!important$/;
@@ -9438,22 +9457,11 @@ var VueRuntimeDOM = (function (exports) {
               }
               this.attachShadow({ mode: 'open' });
           }
-          // set initial attrs
-          for (let i = 0; i < this.attributes.length; i++) {
-              this._setAttr(this.attributes[i].name);
-          }
-          // watch future attr changes
-          new MutationObserver(mutations => {
-              for (const m of mutations) {
-                  this._setAttr(m.attributeName);
-              }
-          }).observe(this, { attributes: true });
       }
       connectedCallback() {
           this._connected = true;
           if (!this._instance) {
               this._resolveDef();
-              this._update();
           }
       }
       disconnectedCallback() {
@@ -9472,8 +9480,18 @@ var VueRuntimeDOM = (function (exports) {
           if (this._resolved) {
               return;
           }
+          this._resolved = true;
+          // set initial attrs
+          for (let i = 0; i < this.attributes.length; i++) {
+              this._setAttr(this.attributes[i].name);
+          }
+          // watch future attr changes
+          new MutationObserver(mutations => {
+              for (const m of mutations) {
+                  this._setAttr(m.attributeName);
+              }
+          }).observe(this, { attributes: true });
           const resolve = (def) => {
-              this._resolved = true;
               const { props, styles } = def;
               const hasOptions = !isArray(props);
               const rawKeys = props ? (hasOptions ? Object.keys(props) : props) : [];
@@ -9488,14 +9506,11 @@ var VueRuntimeDOM = (function (exports) {
                       }
                   }
               }
-              if (numberProps) {
-                  this._numberProps = numberProps;
-                  this._update();
-              }
+              this._numberProps = numberProps;
               // check if there are props set pre-upgrade or connect
               for (const key of Object.keys(this)) {
                   if (key[0] !== '_') {
-                      this._setProp(key, this[key]);
+                      this._setProp(key, this[key], true, false);
                   }
               }
               // defining getter/setters on prototype
@@ -9509,7 +9524,10 @@ var VueRuntimeDOM = (function (exports) {
                       }
                   });
               }
+              // apply CSS
               this._applyStyles(styles);
+              // initial render
+              this._update();
           };
           const asyncDef = this._def.__asyncLoader;
           if (asyncDef) {
@@ -9535,10 +9553,10 @@ var VueRuntimeDOM = (function (exports) {
       /**
        * @internal
        */
-      _setProp(key, val, shouldReflect = true) {
+      _setProp(key, val, shouldReflect = true, shouldUpdate = true) {
           if (val !== this._props[key]) {
               this._props[key] = val;
-              if (this._instance) {
+              if (shouldUpdate && this._instance) {
                   this._update();
               }
               // reflect