vue 3.3.7 → 3.3.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -936,7 +936,7 @@ function createReadonlyMethod(type) {
936
936
  toRaw(this)
937
937
  );
938
938
  }
939
- return type === "delete" ? false : this;
939
+ return type === "delete" ? false : type === "clear" ? void 0 : this;
940
940
  };
941
941
  }
942
942
  function createInstrumentations() {
@@ -2207,9 +2207,19 @@ function renderComponentRoot(instance) {
2207
2207
  try {
2208
2208
  if (vnode.shapeFlag & 4) {
2209
2209
  const proxyToUse = withProxy || proxy;
2210
+ const thisProxy = setupState.__isScriptSetup ? new Proxy(proxyToUse, {
2211
+ get(target, key, receiver) {
2212
+ warn(
2213
+ `Property '${String(
2214
+ key
2215
+ )}' was accessed via 'this'. Avoid using 'this' in templates.`
2216
+ );
2217
+ return Reflect.get(target, key, receiver);
2218
+ }
2219
+ }) : proxyToUse;
2210
2220
  result = normalizeVNode(
2211
2221
  render.call(
2212
- proxyToUse,
2222
+ thisProxy,
2213
2223
  proxyToUse,
2214
2224
  renderCache,
2215
2225
  props,
@@ -2444,6 +2454,61 @@ function updateHOCHostEl({ vnode, parent }, el) {
2444
2454
  }
2445
2455
  }
2446
2456
 
2457
+ const COMPONENTS = "components";
2458
+ const DIRECTIVES = "directives";
2459
+ function resolveComponent(name, maybeSelfReference) {
2460
+ return resolveAsset(COMPONENTS, name, true, maybeSelfReference) || name;
2461
+ }
2462
+ const NULL_DYNAMIC_COMPONENT = Symbol.for("v-ndc");
2463
+ function resolveDynamicComponent(component) {
2464
+ if (isString(component)) {
2465
+ return resolveAsset(COMPONENTS, component, false) || component;
2466
+ } else {
2467
+ return component || NULL_DYNAMIC_COMPONENT;
2468
+ }
2469
+ }
2470
+ function resolveDirective(name) {
2471
+ return resolveAsset(DIRECTIVES, name);
2472
+ }
2473
+ function resolveAsset(type, name, warnMissing = true, maybeSelfReference = false) {
2474
+ const instance = currentRenderingInstance || currentInstance;
2475
+ if (instance) {
2476
+ const Component = instance.type;
2477
+ if (type === COMPONENTS) {
2478
+ const selfName = getComponentName(
2479
+ Component,
2480
+ false
2481
+ /* do not include inferred name to avoid breaking existing code */
2482
+ );
2483
+ if (selfName && (selfName === name || selfName === camelize(name) || selfName === capitalize(camelize(name)))) {
2484
+ return Component;
2485
+ }
2486
+ }
2487
+ const res = (
2488
+ // local registration
2489
+ // check instance[type] first which is resolved for options API
2490
+ resolve(instance[type] || Component[type], name) || // global registration
2491
+ resolve(instance.appContext[type], name)
2492
+ );
2493
+ if (!res && maybeSelfReference) {
2494
+ return Component;
2495
+ }
2496
+ if (warnMissing && !res) {
2497
+ const extra = type === COMPONENTS ? `
2498
+ If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.` : ``;
2499
+ warn(`Failed to resolve ${type.slice(0, -1)}: ${name}${extra}`);
2500
+ }
2501
+ return res;
2502
+ } else {
2503
+ warn(
2504
+ `resolve${capitalize(type.slice(0, -1))} can only be used in render() or setup().`
2505
+ );
2506
+ }
2507
+ }
2508
+ function resolve(registry, name) {
2509
+ return registry && (registry[name] || registry[camelize(name)] || registry[capitalize(camelize(name))]);
2510
+ }
2511
+
2447
2512
  const isSuspense = (type) => type.__isSuspense;
2448
2513
  const SuspenseImpl = {
2449
2514
  name: "Suspense",
@@ -2978,7 +3043,7 @@ function normalizeSuspenseSlot(s) {
2978
3043
  }
2979
3044
  if (isArray(s)) {
2980
3045
  const singleChild = filterSingleRoot(s);
2981
- if (!singleChild) {
3046
+ if (!singleChild && s.filter((child) => child !== NULL_DYNAMIC_COMPONENT).length > 0) {
2982
3047
  warn(`<Suspense> slots expect a single root node.`);
2983
3048
  }
2984
3049
  s = singleChild;
@@ -3116,6 +3181,7 @@ function doWatch(source, cb, { immediate, deep, flush, onTrack, onTrigger } = EM
3116
3181
  let onCleanup = (fn) => {
3117
3182
  cleanup = effect.onStop = () => {
3118
3183
  callWithErrorHandling(fn, instance, 4);
3184
+ cleanup = effect.onStop = void 0;
3119
3185
  };
3120
3186
  };
3121
3187
  let oldValue = isMultiSource ? new Array(source.length).fill(INITIAL_WATCHER_VALUE) : INITIAL_WATCHER_VALUE;
@@ -3586,7 +3652,11 @@ function emptyPlaceholder(vnode) {
3586
3652
  }
3587
3653
  }
3588
3654
  function getKeepAliveChild(vnode) {
3589
- return isKeepAlive(vnode) ? vnode.children ? vnode.children[0] : void 0 : vnode;
3655
+ return isKeepAlive(vnode) ? (
3656
+ // #7121 ensure get the child component subtree in case
3657
+ // it's been replaced during HMR
3658
+ vnode.component ? vnode.component.subTree : vnode.children ? vnode.children[0] : void 0
3659
+ ) : vnode;
3590
3660
  }
3591
3661
  function setTransitionHooks(vnode, hooks) {
3592
3662
  if (vnode.shapeFlag & 6 && vnode.component) {
@@ -4063,61 +4133,6 @@ function onErrorCaptured(hook, target = currentInstance) {
4063
4133
  injectHook("ec", hook, target);
4064
4134
  }
4065
4135
 
4066
- const COMPONENTS = "components";
4067
- const DIRECTIVES = "directives";
4068
- function resolveComponent(name, maybeSelfReference) {
4069
- return resolveAsset(COMPONENTS, name, true, maybeSelfReference) || name;
4070
- }
4071
- const NULL_DYNAMIC_COMPONENT = Symbol.for("v-ndc");
4072
- function resolveDynamicComponent(component) {
4073
- if (isString(component)) {
4074
- return resolveAsset(COMPONENTS, component, false) || component;
4075
- } else {
4076
- return component || NULL_DYNAMIC_COMPONENT;
4077
- }
4078
- }
4079
- function resolveDirective(name) {
4080
- return resolveAsset(DIRECTIVES, name);
4081
- }
4082
- function resolveAsset(type, name, warnMissing = true, maybeSelfReference = false) {
4083
- const instance = currentRenderingInstance || currentInstance;
4084
- if (instance) {
4085
- const Component = instance.type;
4086
- if (type === COMPONENTS) {
4087
- const selfName = getComponentName(
4088
- Component,
4089
- false
4090
- /* do not include inferred name to avoid breaking existing code */
4091
- );
4092
- if (selfName && (selfName === name || selfName === camelize(name) || selfName === capitalize(camelize(name)))) {
4093
- return Component;
4094
- }
4095
- }
4096
- const res = (
4097
- // local registration
4098
- // check instance[type] first which is resolved for options API
4099
- resolve(instance[type] || Component[type], name) || // global registration
4100
- resolve(instance.appContext[type], name)
4101
- );
4102
- if (!res && maybeSelfReference) {
4103
- return Component;
4104
- }
4105
- if (warnMissing && !res) {
4106
- const extra = type === COMPONENTS ? `
4107
- If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.` : ``;
4108
- warn(`Failed to resolve ${type.slice(0, -1)}: ${name}${extra}`);
4109
- }
4110
- return res;
4111
- } else {
4112
- warn(
4113
- `resolve${capitalize(type.slice(0, -1))} can only be used in render() or setup().`
4114
- );
4115
- }
4116
- }
4117
- function resolve(registry, name) {
4118
- return registry && (registry[name] || registry[camelize(name)] || registry[capitalize(camelize(name))]);
4119
- }
4120
-
4121
4136
  function renderList(source, renderItem, cache, index) {
4122
4137
  let ret;
4123
4138
  const cached = cache && cache[index];
@@ -5634,6 +5649,9 @@ function assertType(value, type) {
5634
5649
  };
5635
5650
  }
5636
5651
  function getInvalidTypeMessage(name, value, expectedTypes) {
5652
+ if (expectedTypes.length === 0) {
5653
+ return `Prop type [] for prop "${name}" won't match anything. Did you mean to use type Array instead?`;
5654
+ }
5637
5655
  let message = `Invalid prop: type check failed for prop "${name}". Expected ${expectedTypes.map(capitalize).join(" | ")}`;
5638
5656
  const expectedType = expectedTypes[0];
5639
5657
  const receivedType = toRawType(value);
@@ -5903,6 +5921,20 @@ function createHydrationFunctions(rendererInternals) {
5903
5921
  const { type, ref, shapeFlag, patchFlag } = vnode;
5904
5922
  let domType = node.nodeType;
5905
5923
  vnode.el = node;
5924
+ {
5925
+ if (!("__vnode" in node)) {
5926
+ Object.defineProperty(node, "__vnode", {
5927
+ value: vnode,
5928
+ enumerable: false
5929
+ });
5930
+ }
5931
+ if (!("__vueParentComponent" in node)) {
5932
+ Object.defineProperty(node, "__vueParentComponent", {
5933
+ value: parentComponent,
5934
+ enumerable: false
5935
+ });
5936
+ }
5937
+ }
5906
5938
  if (patchFlag === -2) {
5907
5939
  optimized = false;
5908
5940
  vnode.dynamicChildren = null;
@@ -5933,15 +5965,15 @@ function createHydrationFunctions(rendererInternals) {
5933
5965
  }
5934
5966
  break;
5935
5967
  case Comment:
5936
- if (domType !== 8 /* COMMENT */ || isFragmentStart) {
5937
- if (node.tagName.toLowerCase() === "template") {
5938
- const content = vnode.el.content.firstChild;
5939
- replaceNode(content, node, parentComponent);
5940
- vnode.el = node = content;
5941
- nextNode = nextSibling(node);
5942
- } else {
5943
- nextNode = onMismatch();
5944
- }
5968
+ if (isTemplateNode(node)) {
5969
+ nextNode = nextSibling(node);
5970
+ replaceNode(
5971
+ vnode.el = node.content.firstChild,
5972
+ node,
5973
+ parentComponent
5974
+ );
5975
+ } else if (domType !== 8 /* COMMENT */ || isFragmentStart) {
5976
+ nextNode = onMismatch();
5945
5977
  } else {
5946
5978
  nextNode = nextSibling(node);
5947
5979
  }
@@ -6064,15 +6096,16 @@ function createHydrationFunctions(rendererInternals) {
6064
6096
  const hydrateElement = (el, vnode, parentComponent, parentSuspense, slotScopeIds, optimized) => {
6065
6097
  optimized = optimized || !!vnode.dynamicChildren;
6066
6098
  const { type, props, patchFlag, shapeFlag, dirs, transition } = vnode;
6067
- const forcePatchValue = type === "input" && dirs || type === "option";
6099
+ const forcePatch = type === "input" || type === "option";
6068
6100
  {
6069
6101
  if (dirs) {
6070
6102
  invokeDirectiveHook(vnode, null, parentComponent, "created");
6071
6103
  }
6072
6104
  if (props) {
6073
- if (forcePatchValue || !optimized || patchFlag & (16 | 32)) {
6105
+ if (forcePatch || !optimized || patchFlag & (16 | 32)) {
6074
6106
  for (const key in props) {
6075
- if (forcePatchValue && key.endsWith("value") || isOn(key) && !isReservedProp(key)) {
6107
+ if (forcePatch && (key.endsWith("value") || key === "indeterminate") || isOn(key) && !isReservedProp(key) || // force hydrate v-bind with .prop modifiers
6108
+ key[0] === ".") {
6076
6109
  patchProp(
6077
6110
  el,
6078
6111
  key,
@@ -6285,8 +6318,7 @@ function createHydrationFunctions(rendererInternals) {
6285
6318
  let parent = parentComponent;
6286
6319
  while (parent) {
6287
6320
  if (parent.vnode.el === oldNode) {
6288
- parent.vnode.el = newNode;
6289
- parent.subTree.el = newNode;
6321
+ parent.vnode.el = parent.subTree.el = newNode;
6290
6322
  }
6291
6323
  parent = parent.parent;
6292
6324
  }
@@ -7830,6 +7862,7 @@ const resolveTarget = (props, select) => {
7830
7862
  }
7831
7863
  };
7832
7864
  const TeleportImpl = {
7865
+ name: "Teleport",
7833
7866
  __isTeleport: true,
7834
7867
  process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals) {
7835
7868
  const {
@@ -8251,7 +8284,7 @@ function _createVNode(type, props = null, children = null, patchFlag = 0, dynami
8251
8284
  if (shapeFlag & 4 && isProxy(type)) {
8252
8285
  type = toRaw(type);
8253
8286
  warn(
8254
- `Vue received a Component which was made a reactive object. This can lead to unnecessary performance overhead, and should be avoided by marking the component with \`markRaw\` or using \`shallowRef\` instead of \`ref\`.`,
8287
+ `Vue received a Component that was made a reactive object. This can lead to unnecessary performance overhead and should be avoided by marking the component with \`markRaw\` or using \`shallowRef\` instead of \`ref\`.`,
8255
8288
  `
8256
8289
  Component that was made reactive: `,
8257
8290
  type
@@ -9072,7 +9105,7 @@ function isMemoSame(cached, memo) {
9072
9105
  return true;
9073
9106
  }
9074
9107
 
9075
- const version = "3.3.7";
9108
+ const version = "3.3.9";
9076
9109
  const ssrUtils = null;
9077
9110
  const resolveFilter = null;
9078
9111
  const compatUtils = null;
@@ -10217,21 +10250,20 @@ const vModelText = {
10217
10250
  el[assignKey] = getModelAssigner(vnode);
10218
10251
  if (el.composing)
10219
10252
  return;
10253
+ const elValue = number || el.type === "number" ? looseToNumber(el.value) : el.value;
10254
+ const newValue = value == null ? "" : value;
10255
+ if (elValue === newValue) {
10256
+ return;
10257
+ }
10220
10258
  if (document.activeElement === el && el.type !== "range") {
10221
10259
  if (lazy) {
10222
10260
  return;
10223
10261
  }
10224
- if (trim && el.value.trim() === value) {
10225
- return;
10226
- }
10227
- if ((number || el.type === "number") && looseToNumber(el.value) === value) {
10262
+ if (trim && el.value.trim() === newValue) {
10228
10263
  return;
10229
10264
  }
10230
10265
  }
10231
- const newValue = value == null ? "" : value;
10232
- if (el.value !== newValue) {
10233
- el.value = newValue;
10234
- }
10266
+ el.value = newValue;
10235
10267
  }
10236
10268
  };
10237
10269
  const vModelCheckbox = {