@vue/compat 3.3.8 → 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.
@@ -940,7 +940,7 @@ function createReadonlyMethod(type) {
940
940
  toRaw(this)
941
941
  );
942
942
  }
943
- return type === "delete" ? false : this;
943
+ return type === "delete" ? false : type === "clear" ? void 0 : this;
944
944
  };
945
945
  }
946
946
  function createInstrumentations() {
@@ -2681,9 +2681,19 @@ function renderComponentRoot(instance) {
2681
2681
  try {
2682
2682
  if (vnode.shapeFlag & 4) {
2683
2683
  const proxyToUse = withProxy || proxy;
2684
+ const thisProxy = !!(process.env.NODE_ENV !== "production") && setupState.__isScriptSetup ? new Proxy(proxyToUse, {
2685
+ get(target, key, receiver) {
2686
+ warn(
2687
+ `Property '${String(
2688
+ key
2689
+ )}' was accessed via 'this'. Avoid using 'this' in templates.`
2690
+ );
2691
+ return Reflect.get(target, key, receiver);
2692
+ }
2693
+ }) : proxyToUse;
2684
2694
  result = normalizeVNode(
2685
2695
  render.call(
2686
- proxyToUse,
2696
+ thisProxy,
2687
2697
  proxyToUse,
2688
2698
  renderCache,
2689
2699
  props,
@@ -3713,6 +3723,7 @@ function doWatch(source, cb, { immediate, deep, flush, onTrack, onTrigger } = EM
3713
3723
  let onCleanup = (fn) => {
3714
3724
  cleanup = effect.onStop = () => {
3715
3725
  callWithErrorHandling(fn, instance, 4);
3726
+ cleanup = effect.onStop = void 0;
3716
3727
  };
3717
3728
  };
3718
3729
  let ssrCleanup;
@@ -4212,7 +4223,11 @@ function emptyPlaceholder(vnode) {
4212
4223
  }
4213
4224
  }
4214
4225
  function getKeepAliveChild(vnode) {
4215
- return isKeepAlive(vnode) ? vnode.children ? vnode.children[0] : void 0 : vnode;
4226
+ return isKeepAlive(vnode) ? (
4227
+ // #7121 ensure get the child component subtree in case
4228
+ // it's been replaced during HMR
4229
+ !!(process.env.NODE_ENV !== "production") && vnode.component ? vnode.component.subTree : vnode.children ? vnode.children[0] : void 0
4230
+ ) : vnode;
4216
4231
  }
4217
4232
  function setTransitionHooks(vnode, hooks) {
4218
4233
  if (vnode.shapeFlag & 6 && vnode.component) {
@@ -6237,7 +6252,7 @@ function createCompatVue$1(createApp, createSingletonApp) {
6237
6252
  return vm;
6238
6253
  }
6239
6254
  }
6240
- Vue.version = `2.6.14-compat:${"3.3.8"}`;
6255
+ Vue.version = `2.6.14-compat:${"3.3.9"}`;
6241
6256
  Vue.config = singletonApp.config;
6242
6257
  Vue.use = (p, ...options) => {
6243
6258
  if (p && isFunction(p.install)) {
@@ -7268,6 +7283,9 @@ function assertType(value, type) {
7268
7283
  };
7269
7284
  }
7270
7285
  function getInvalidTypeMessage(name, value, expectedTypes) {
7286
+ if (expectedTypes.length === 0) {
7287
+ return `Prop type [] for prop "${name}" won't match anything. Did you mean to use type Array instead?`;
7288
+ }
7271
7289
  let message = `Invalid prop: type check failed for prop "${name}". Expected ${expectedTypes.map(capitalize).join(" | ")}`;
7272
7290
  const expectedType = expectedTypes[0];
7273
7291
  const receivedType = toRawType(value);
@@ -7539,6 +7557,20 @@ function createHydrationFunctions(rendererInternals) {
7539
7557
  const { type, ref, shapeFlag, patchFlag } = vnode;
7540
7558
  let domType = node.nodeType;
7541
7559
  vnode.el = node;
7560
+ if (!!(process.env.NODE_ENV !== "production") || __VUE_PROD_DEVTOOLS__) {
7561
+ if (!("__vnode" in node)) {
7562
+ Object.defineProperty(node, "__vnode", {
7563
+ value: vnode,
7564
+ enumerable: false
7565
+ });
7566
+ }
7567
+ if (!("__vueParentComponent" in node)) {
7568
+ Object.defineProperty(node, "__vueParentComponent", {
7569
+ value: parentComponent,
7570
+ enumerable: false
7571
+ });
7572
+ }
7573
+ }
7542
7574
  if (patchFlag === -2) {
7543
7575
  optimized = false;
7544
7576
  vnode.dynamicChildren = null;
@@ -7700,15 +7732,16 @@ function createHydrationFunctions(rendererInternals) {
7700
7732
  const hydrateElement = (el, vnode, parentComponent, parentSuspense, slotScopeIds, optimized) => {
7701
7733
  optimized = optimized || !!vnode.dynamicChildren;
7702
7734
  const { type, props, patchFlag, shapeFlag, dirs, transition } = vnode;
7703
- const forcePatchValue = type === "input" && dirs || type === "option";
7704
- if (!!(process.env.NODE_ENV !== "production") || forcePatchValue || patchFlag !== -1) {
7735
+ const forcePatch = type === "input" || type === "option";
7736
+ if (!!(process.env.NODE_ENV !== "production") || forcePatch || patchFlag !== -1) {
7705
7737
  if (dirs) {
7706
7738
  invokeDirectiveHook(vnode, null, parentComponent, "created");
7707
7739
  }
7708
7740
  if (props) {
7709
- if (forcePatchValue || !optimized || patchFlag & (16 | 32)) {
7741
+ if (forcePatch || !optimized || patchFlag & (16 | 32)) {
7710
7742
  for (const key in props) {
7711
- if (forcePatchValue && key.endsWith("value") || isOn(key) && !isReservedProp(key)) {
7743
+ if (forcePatch && (key.endsWith("value") || key === "indeterminate") || isOn(key) && !isReservedProp(key) || // force hydrate v-bind with .prop modifiers
7744
+ key[0] === ".") {
7712
7745
  patchProp(
7713
7746
  el,
7714
7747
  key,
@@ -9533,6 +9566,7 @@ const resolveTarget = (props, select) => {
9533
9566
  }
9534
9567
  };
9535
9568
  const TeleportImpl = {
9569
+ name: "Teleport",
9536
9570
  __isTeleport: true,
9537
9571
  process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals) {
9538
9572
  const {
@@ -10012,7 +10046,7 @@ function _createVNode(type, props = null, children = null, patchFlag = 0, dynami
10012
10046
  if (!!(process.env.NODE_ENV !== "production") && shapeFlag & 4 && isProxy(type)) {
10013
10047
  type = toRaw(type);
10014
10048
  warn(
10015
- `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\`.`,
10049
+ `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\`.`,
10016
10050
  `
10017
10051
  Component that was made reactive: `,
10018
10052
  type
@@ -10876,7 +10910,7 @@ function isMemoSame(cached, memo) {
10876
10910
  return true;
10877
10911
  }
10878
10912
 
10879
- const version = "3.3.8";
10913
+ const version = "3.3.9";
10880
10914
  const _ssrUtils = {
10881
10915
  createComponentInstance,
10882
10916
  setupComponent,
@@ -12132,21 +12166,20 @@ const vModelText = {
12132
12166
  el[assignKey] = getModelAssigner(vnode);
12133
12167
  if (el.composing)
12134
12168
  return;
12169
+ const elValue = number || el.type === "number" ? looseToNumber(el.value) : el.value;
12170
+ const newValue = value == null ? "" : value;
12171
+ if (elValue === newValue) {
12172
+ return;
12173
+ }
12135
12174
  if (document.activeElement === el && el.type !== "range") {
12136
12175
  if (lazy) {
12137
12176
  return;
12138
12177
  }
12139
- if (trim && el.value.trim() === value) {
12178
+ if (trim && el.value.trim() === newValue) {
12140
12179
  return;
12141
12180
  }
12142
- if ((number || el.type === "number") && looseToNumber(el.value) === value) {
12143
- return;
12144
- }
12145
- }
12146
- const newValue = value == null ? "" : value;
12147
- if (el.value !== newValue) {
12148
- el.value = newValue;
12149
12181
  }
12182
+ el.value = newValue;
12150
12183
  }
12151
12184
  };
12152
12185
  const vModelCheckbox = {
@@ -939,7 +939,7 @@ var Vue = (function () {
939
939
  toRaw(this)
940
940
  );
941
941
  }
942
- return type === "delete" ? false : this;
942
+ return type === "delete" ? false : type === "clear" ? void 0 : this;
943
943
  };
944
944
  }
945
945
  function createInstrumentations() {
@@ -2667,9 +2667,19 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
2667
2667
  try {
2668
2668
  if (vnode.shapeFlag & 4) {
2669
2669
  const proxyToUse = withProxy || proxy;
2670
+ const thisProxy = setupState.__isScriptSetup ? new Proxy(proxyToUse, {
2671
+ get(target, key, receiver) {
2672
+ warn(
2673
+ `Property '${String(
2674
+ key
2675
+ )}' was accessed via 'this'. Avoid using 'this' in templates.`
2676
+ );
2677
+ return Reflect.get(target, key, receiver);
2678
+ }
2679
+ }) : proxyToUse;
2670
2680
  result = normalizeVNode(
2671
2681
  render.call(
2672
- proxyToUse,
2682
+ thisProxy,
2673
2683
  proxyToUse,
2674
2684
  renderCache,
2675
2685
  props,
@@ -3699,6 +3709,7 @@ If this is a native custom element, make sure to exclude it from component resol
3699
3709
  let onCleanup = (fn) => {
3700
3710
  cleanup = effect.onStop = () => {
3701
3711
  callWithErrorHandling(fn, instance, 4);
3712
+ cleanup = effect.onStop = void 0;
3702
3713
  };
3703
3714
  };
3704
3715
  let oldValue = isMultiSource ? new Array(source.length).fill(INITIAL_WATCHER_VALUE) : INITIAL_WATCHER_VALUE;
@@ -4175,7 +4186,11 @@ If this is a native custom element, make sure to exclude it from component resol
4175
4186
  }
4176
4187
  }
4177
4188
  function getKeepAliveChild(vnode) {
4178
- return isKeepAlive(vnode) ? vnode.children ? vnode.children[0] : void 0 : vnode;
4189
+ return isKeepAlive(vnode) ? (
4190
+ // #7121 ensure get the child component subtree in case
4191
+ // it's been replaced during HMR
4192
+ vnode.component ? vnode.component.subTree : vnode.children ? vnode.children[0] : void 0
4193
+ ) : vnode;
4179
4194
  }
4180
4195
  function setTransitionHooks(vnode, hooks) {
4181
4196
  if (vnode.shapeFlag & 6 && vnode.component) {
@@ -6192,7 +6207,7 @@ If this is a native custom element, make sure to exclude it from component resol
6192
6207
  return vm;
6193
6208
  }
6194
6209
  }
6195
- Vue.version = `2.6.14-compat:${"3.3.8"}`;
6210
+ Vue.version = `2.6.14-compat:${"3.3.9"}`;
6196
6211
  Vue.config = singletonApp.config;
6197
6212
  Vue.use = (p, ...options) => {
6198
6213
  if (p && isFunction(p.install)) {
@@ -7220,6 +7235,9 @@ If you want to remount the same app, move your app creation logic into a factory
7220
7235
  };
7221
7236
  }
7222
7237
  function getInvalidTypeMessage(name, value, expectedTypes) {
7238
+ if (expectedTypes.length === 0) {
7239
+ return `Prop type [] for prop "${name}" won't match anything. Did you mean to use type Array instead?`;
7240
+ }
7223
7241
  let message = `Invalid prop: type check failed for prop "${name}". Expected ${expectedTypes.map(capitalize).join(" | ")}`;
7224
7242
  const expectedType = expectedTypes[0];
7225
7243
  const receivedType = toRawType(value);
@@ -7491,6 +7509,20 @@ If you want to remount the same app, move your app creation logic into a factory
7491
7509
  const { type, ref, shapeFlag, patchFlag } = vnode;
7492
7510
  let domType = node.nodeType;
7493
7511
  vnode.el = node;
7512
+ {
7513
+ if (!("__vnode" in node)) {
7514
+ Object.defineProperty(node, "__vnode", {
7515
+ value: vnode,
7516
+ enumerable: false
7517
+ });
7518
+ }
7519
+ if (!("__vueParentComponent" in node)) {
7520
+ Object.defineProperty(node, "__vueParentComponent", {
7521
+ value: parentComponent,
7522
+ enumerable: false
7523
+ });
7524
+ }
7525
+ }
7494
7526
  if (patchFlag === -2) {
7495
7527
  optimized = false;
7496
7528
  vnode.dynamicChildren = null;
@@ -7652,15 +7684,16 @@ If you want to remount the same app, move your app creation logic into a factory
7652
7684
  const hydrateElement = (el, vnode, parentComponent, parentSuspense, slotScopeIds, optimized) => {
7653
7685
  optimized = optimized || !!vnode.dynamicChildren;
7654
7686
  const { type, props, patchFlag, shapeFlag, dirs, transition } = vnode;
7655
- const forcePatchValue = type === "input" && dirs || type === "option";
7687
+ const forcePatch = type === "input" || type === "option";
7656
7688
  {
7657
7689
  if (dirs) {
7658
7690
  invokeDirectiveHook(vnode, null, parentComponent, "created");
7659
7691
  }
7660
7692
  if (props) {
7661
- if (forcePatchValue || !optimized || patchFlag & (16 | 32)) {
7693
+ if (forcePatch || !optimized || patchFlag & (16 | 32)) {
7662
7694
  for (const key in props) {
7663
- if (forcePatchValue && key.endsWith("value") || isOn(key) && !isReservedProp(key)) {
7695
+ if (forcePatch && (key.endsWith("value") || key === "indeterminate") || isOn(key) && !isReservedProp(key) || // force hydrate v-bind with .prop modifiers
7696
+ key[0] === ".") {
7664
7697
  patchProp(
7665
7698
  el,
7666
7699
  key,
@@ -9451,6 +9484,7 @@ If you want to remount the same app, move your app creation logic into a factory
9451
9484
  }
9452
9485
  };
9453
9486
  const TeleportImpl = {
9487
+ name: "Teleport",
9454
9488
  __isTeleport: true,
9455
9489
  process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals) {
9456
9490
  const {
@@ -9930,7 +9964,7 @@ If you want to remount the same app, move your app creation logic into a factory
9930
9964
  if (shapeFlag & 4 && isProxy(type)) {
9931
9965
  type = toRaw(type);
9932
9966
  warn(
9933
- `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\`.`,
9967
+ `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\`.`,
9934
9968
  `
9935
9969
  Component that was made reactive: `,
9936
9970
  type
@@ -10760,7 +10794,7 @@ Component that was made reactive: `,
10760
10794
  return true;
10761
10795
  }
10762
10796
 
10763
- const version = "3.3.8";
10797
+ const version = "3.3.9";
10764
10798
  const ssrUtils = null;
10765
10799
  const resolveFilter = resolveFilter$1 ;
10766
10800
  const _compatUtils = {
@@ -11989,21 +12023,20 @@ Component that was made reactive: `,
11989
12023
  el[assignKey] = getModelAssigner(vnode);
11990
12024
  if (el.composing)
11991
12025
  return;
12026
+ const elValue = number || el.type === "number" ? looseToNumber(el.value) : el.value;
12027
+ const newValue = value == null ? "" : value;
12028
+ if (elValue === newValue) {
12029
+ return;
12030
+ }
11992
12031
  if (document.activeElement === el && el.type !== "range") {
11993
12032
  if (lazy) {
11994
12033
  return;
11995
12034
  }
11996
- if (trim && el.value.trim() === value) {
12035
+ if (trim && el.value.trim() === newValue) {
11997
12036
  return;
11998
12037
  }
11999
- if ((number || el.type === "number") && looseToNumber(el.value) === value) {
12000
- return;
12001
- }
12002
- }
12003
- const newValue = value == null ? "" : value;
12004
- if (el.value !== newValue) {
12005
- el.value = newValue;
12006
12038
  }
12039
+ el.value = newValue;
12007
12040
  }
12008
12041
  };
12009
12042
  const vModelCheckbox = {