@vue/runtime-core 3.4.0-beta.2 → 3.4.0-beta.4

package/dist/runtime-core.cjs.js

@@ -412,8 +412,10 @@ function checkRecursiveUpdates(seen, fn) {
     if (count > RECURSION_LIMIT) {
       const instance = fn.ownerInstance;
       const componentName = instance && getComponentName(instance.type);
-      warn(
-        `Maximum recursive updates exceeded${componentName ? ` in component <${componentName}>` : ``}. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function.`
+      handleError(
+        `Maximum recursive updates exceeded${componentName ? ` in component <${componentName}>` : ``}. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function.`,
+        null,
+        10
       );
       return true;
     } else {
@@ -1091,6 +1093,8 @@ function hasPropsChanged(prevProps, nextProps, emitsOptions) {
   return false;
 }
 function updateHOCHostEl({ vnode, parent }, el) {
+  if (!el)
+    return;
   while (parent) {
     const root = parent.subTree;
     if (root.suspense && root.suspense.activeBranch === vnode) {
@@ -3262,24 +3266,30 @@ function useModel(props, name) {
     warn(`useModel() called with prop "${name}" which is not declared.`);
     return reactivity.ref();
   }
-  let localValue;
-  watchSyncEffect(() => {
-    localValue = props[name];
-  });
-  return reactivity.customRef((track, trigger) => ({
-    get() {
-      track();
-      return localValue;
-    },
-    set(value) {
-      const rawProps = i.vnode.props;
-      if (!(rawProps && name in rawProps) && shared.hasChanged(value, localValue)) {
-        localValue = value;
+  return reactivity.customRef((track, trigger) => {
+    let localValue;
+    watchSyncEffect(() => {
+      const propValue = props[name];
+      if (shared.hasChanged(localValue, propValue)) {
+        localValue = propValue;
         trigger();
       }
-      i.emit(`update:${name}`, value);
-    }
-  }));
+    });
+    return {
+      get() {
+        track();
+        return localValue;
+      },
+      set(value) {
+        const rawProps = i.vnode.props;
+        if (!(rawProps && name in rawProps) && shared.hasChanged(value, localValue)) {
+          localValue = value;
+          trigger();
+        }
+        i.emit(`update:${name}`, value);
+      }
+    };
+  });
 }
 function getContext() {
   const i = getCurrentInstance();
@@ -5045,7 +5055,7 @@ function propHasMismatch(el, key, clientValue) {
   let actual;
   let expected;
   if (key === "class") {
-    actual = el.className;
+    actual = el.getAttribute("class");
     expected = shared.normalizeClass(clientValue);
     if (actual !== expected) {
       mismatchType = mismatchKey = `class`;
@@ -7935,7 +7945,7 @@ function isMemoSame(cached, memo) {
   return true;
 }
 
-const version = "3.4.0-beta.2";
+const version = "3.4.0-beta.4";
 const ErrorTypeStrings = ErrorTypeStrings$1 ;
 const _ssrUtils = {
   createComponentInstance,

package/dist/runtime-core.cjs.prod.js

@@ -607,6 +607,8 @@ function hasPropsChanged(prevProps, nextProps, emitsOptions) {
   return false;
 }
 function updateHOCHostEl({ vnode, parent }, el) {
+  if (!el)
+    return;
   while (parent) {
     const root = parent.subTree;
     if (root.suspense && root.suspense.activeBranch === vnode) {
@@ -2511,24 +2513,30 @@ function useAttrs() {
 }
 function useModel(props, name) {
   const i = getCurrentInstance();
-  let localValue;
-  watchSyncEffect(() => {
-    localValue = props[name];
-  });
-  return reactivity.customRef((track, trigger) => ({
-    get() {
-      track();
-      return localValue;
-    },
-    set(value) {
-      const rawProps = i.vnode.props;
-      if (!(rawProps && name in rawProps) && shared.hasChanged(value, localValue)) {
-        localValue = value;
+  return reactivity.customRef((track, trigger) => {
+    let localValue;
+    watchSyncEffect(() => {
+      const propValue = props[name];
+      if (shared.hasChanged(localValue, propValue)) {
+        localValue = propValue;
         trigger();
       }
-      i.emit(`update:${name}`, value);
-    }
-  }));
+    });
+    return {
+      get() {
+        track();
+        return localValue;
+      },
+      set(value) {
+        const rawProps = i.vnode.props;
+        if (!(rawProps && name in rawProps) && shared.hasChanged(value, localValue)) {
+          localValue = value;
+          trigger();
+        }
+        i.emit(`update:${name}`, value);
+      }
+    };
+  });
 }
 function getContext() {
   const i = getCurrentInstance();
@@ -6224,7 +6232,7 @@ function isMemoSame(cached, memo) {
   return true;
 }
 
-const version = "3.4.0-beta.2";
+const version = "3.4.0-beta.4";
 const ErrorTypeStrings = null;
 const _ssrUtils = {
   createComponentInstance,

package/dist/runtime-core.esm-bundler.js

@@ -416,8 +416,10 @@ function checkRecursiveUpdates(seen, fn) {
     if (count > RECURSION_LIMIT) {
       const instance = fn.ownerInstance;
       const componentName = instance && getComponentName(instance.type);
-      warn(
-        `Maximum recursive updates exceeded${componentName ? ` in component <${componentName}>` : ``}. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function.`
+      handleError(
+        `Maximum recursive updates exceeded${componentName ? ` in component <${componentName}>` : ``}. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function.`,
+        null,
+        10
       );
       return true;
     } else {
@@ -1095,6 +1097,8 @@ function hasPropsChanged(prevProps, nextProps, emitsOptions) {
   return false;
 }
 function updateHOCHostEl({ vnode, parent }, el) {
+  if (!el)
+    return;
   while (parent) {
     const root = parent.subTree;
     if (root.suspense && root.suspense.activeBranch === vnode) {
@@ -3268,24 +3272,30 @@ function useModel(props, name) {
     warn(`useModel() called with prop "${name}" which is not declared.`);
     return ref();
   }
-  let localValue;
-  watchSyncEffect(() => {
-    localValue = props[name];
-  });
-  return customRef((track, trigger) => ({
-    get() {
-      track();
-      return localValue;
-    },
-    set(value) {
-      const rawProps = i.vnode.props;
-      if (!(rawProps && name in rawProps) && hasChanged(value, localValue)) {
-        localValue = value;
+  return customRef((track, trigger) => {
+    let localValue;
+    watchSyncEffect(() => {
+      const propValue = props[name];
+      if (hasChanged(localValue, propValue)) {
+        localValue = propValue;
         trigger();
       }
-      i.emit(`update:${name}`, value);
-    }
-  }));
+    });
+    return {
+      get() {
+        track();
+        return localValue;
+      },
+      set(value) {
+        const rawProps = i.vnode.props;
+        if (!(rawProps && name in rawProps) && hasChanged(value, localValue)) {
+          localValue = value;
+          trigger();
+        }
+        i.emit(`update:${name}`, value);
+      }
+    };
+  });
 }
 function getContext() {
   const i = getCurrentInstance();
@@ -5065,7 +5075,7 @@ function propHasMismatch(el, key, clientValue) {
   let actual;
   let expected;
   if (key === "class") {
-    actual = el.className;
+    actual = el.getAttribute("class");
     expected = normalizeClass(clientValue);
     if (actual !== expected) {
       mismatchType = mismatchKey = `class`;
@@ -8009,7 +8019,7 @@ function isMemoSame(cached, memo) {
   return true;
 }
 
-const version = "3.4.0-beta.2";
+const version = "3.4.0-beta.4";
 const ErrorTypeStrings = ErrorTypeStrings$1 ;
 const _ssrUtils = {
   createComponentInstance,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue/runtime-core",
-  "version": "3.4.0-beta.2",
+  "version": "3.4.0-beta.4",
   "description": "@vue/runtime-core",
   "main": "index.js",
   "module": "dist/runtime-core.esm-bundler.js",
@@ -32,7 +32,7 @@
   },
   "homepage": "https://github.com/vuejs/core/tree/main/packages/runtime-core#readme",
   "dependencies": {
-    "@vue/shared": "3.4.0-beta.2",
-    "@vue/reactivity": "3.4.0-beta.2"
+    "@vue/shared": "3.4.0-beta.4",
+    "@vue/reactivity": "3.4.0-beta.4"
   }
 }