@vue/compat 3.5.0-beta.3 → 3.5.0

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.
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @vue/compat v3.5.0-beta.3
2
+ * @vue/compat v3.5.0
3
3
  * (c) 2018-present Yuxi (Evan) You and Vue contributors
4
4
  * @license MIT
5
5
  **/
@@ -214,6 +214,14 @@ function isRenderableAttrValue(value) {
214
214
  return type === "string" || type === "number" || type === "boolean";
215
215
  }
216
216
 
217
+ const cssVarNameEscapeSymbolsRE = /[ !"#$%&'()*+,./:;<=>?@[\\\]^`{|}~]/g;
218
+ function getEscapedCssVarName(key, doubleEscape) {
219
+ return key.replace(
220
+ cssVarNameEscapeSymbolsRE,
221
+ (s) => `\\${s}`
222
+ );
223
+ }
224
+
217
225
  function looseCompareArrays(a, b) {
218
226
  if (a.length !== b.length) return false;
219
227
  let equal = true;
@@ -337,12 +345,13 @@ class EffectScope {
337
345
  pause() {
338
346
  if (this._active) {
339
347
  this._isPaused = true;
348
+ let i, l;
340
349
  if (this.scopes) {
341
- for (let i = 0, l = this.scopes.length; i < l; i++) {
350
+ for (i = 0, l = this.scopes.length; i < l; i++) {
342
351
  this.scopes[i].pause();
343
352
  }
344
353
  }
345
- for (let i = 0, l = this.effects.length; i < l; i++) {
354
+ for (i = 0, l = this.effects.length; i < l; i++) {
346
355
  this.effects[i].pause();
347
356
  }
348
357
  }
@@ -354,12 +363,13 @@ class EffectScope {
354
363
  if (this._active) {
355
364
  if (this._isPaused) {
356
365
  this._isPaused = false;
366
+ let i, l;
357
367
  if (this.scopes) {
358
- for (let i = 0, l = this.scopes.length; i < l; i++) {
368
+ for (i = 0, l = this.scopes.length; i < l; i++) {
359
369
  this.scopes[i].resume();
360
370
  }
361
371
  }
362
- for (let i = 0, l = this.effects.length; i < l; i++) {
372
+ for (i = 0, l = this.effects.length; i < l; i++) {
363
373
  this.effects[i].resume();
364
374
  }
365
375
  }
@@ -552,11 +562,9 @@ function startBatch() {
552
562
  batchDepth++;
553
563
  }
554
564
  function endBatch() {
555
- if (batchDepth > 1) {
556
- batchDepth--;
565
+ if (--batchDepth > 0) {
557
566
  return;
558
567
  }
559
- batchDepth--;
560
568
  let error;
561
569
  while (batchedEffect) {
562
570
  let e = batchedEffect;
@@ -1077,7 +1085,7 @@ function apply(self, method, fn, thisArg, wrappedRetFn, args) {
1077
1085
  const needsWrap = arr !== self && !isShallow(self);
1078
1086
  const methodFn = arr[method];
1079
1087
  if (methodFn !== arrayProto[method]) {
1080
- const result2 = methodFn.apply(arr, args);
1088
+ const result2 = methodFn.apply(self, args);
1081
1089
  return needsWrap ? toReactive(result2) : result2;
1082
1090
  }
1083
1091
  let wrappedFn = fn;
@@ -1219,7 +1227,12 @@ class MutableReactiveHandler extends BaseReactiveHandler {
1219
1227
  }
1220
1228
  }
1221
1229
  const hadKey = isArray(target) && isIntegerKey(key) ? Number(key) < target.length : hasOwn(target, key);
1222
- const result = Reflect.set(target, key, value, receiver);
1230
+ const result = Reflect.set(
1231
+ target,
1232
+ key,
1233
+ value,
1234
+ isRef(target) ? target : receiver
1235
+ );
1223
1236
  if (target === toRaw(receiver)) {
1224
1237
  if (!hadKey) {
1225
1238
  trigger(target, "add", key, value);
@@ -2038,18 +2051,25 @@ function watch$1(source, cb, options = EMPTY_OBJ) {
2038
2051
  const depth = deep === true ? Infinity : deep;
2039
2052
  getter = () => traverse(baseGetter(), depth);
2040
2053
  }
2054
+ const scope = getCurrentScope();
2055
+ const watchHandle = () => {
2056
+ effect.stop();
2057
+ if (scope) {
2058
+ remove(scope.effects, effect);
2059
+ }
2060
+ };
2041
2061
  if (once) {
2042
2062
  if (cb) {
2043
2063
  const _cb = cb;
2044
2064
  cb = (...args) => {
2045
2065
  _cb(...args);
2046
- effect.stop();
2066
+ watchHandle();
2047
2067
  };
2048
2068
  } else {
2049
2069
  const _getter = getter;
2050
2070
  getter = () => {
2051
2071
  _getter();
2052
- effect.stop();
2072
+ watchHandle();
2053
2073
  };
2054
2074
  }
2055
2075
  }
@@ -2118,13 +2138,6 @@ function watch$1(source, cb, options = EMPTY_OBJ) {
2118
2138
  } else {
2119
2139
  effect.run();
2120
2140
  }
2121
- const scope = getCurrentScope();
2122
- const watchHandle = () => {
2123
- effect.stop();
2124
- if (scope) {
2125
- remove(scope.effects, effect);
2126
- }
2127
- };
2128
2141
  watchHandle.pause = effect.pause.bind(effect);
2129
2142
  watchHandle.resume = effect.resume.bind(effect);
2130
2143
  watchHandle.stop = watchHandle;
@@ -4113,7 +4126,7 @@ function getTransitionRawChildren(children, keepComment = false, parentKey) {
4113
4126
  // @__NO_SIDE_EFFECTS__
4114
4127
  function defineComponent(options, extraOptions) {
4115
4128
  return isFunction(options) ? (
4116
- // #8326: extend call and options.name access are considered side-effects
4129
+ // #8236: extend call and options.name access are considered side-effects
4117
4130
  // by Rollup, so we have to wrap it in a pure-annotated IIFE.
4118
4131
  /* @__PURE__ */ (() => extend({ name: options.name }, extraOptions, { setup: options }))()
4119
4132
  ) : options;
@@ -4560,8 +4573,7 @@ Server rendered element contains more child nodes than client vdom.`
4560
4573
  const isText = vnode.type === Text;
4561
4574
  if (node) {
4562
4575
  if (isText && !optimized) {
4563
- let next = children[i + 1];
4564
- if (next && (next = normalizeVNode(next)).type === Text) {
4576
+ if (i + 1 < l && normalizeVNode(children[i + 1]).type === Text) {
4565
4577
  insert(
4566
4578
  createText(
4567
4579
  node.data.slice(vnode.children.length)
@@ -4817,7 +4829,10 @@ function resolveCssVars(instance, vnode, expectedMap) {
4817
4829
  if (instance.getCssVars && (vnode === root || root && root.type === Fragment && root.children.includes(vnode))) {
4818
4830
  const cssVars = instance.getCssVars();
4819
4831
  for (const key in cssVars) {
4820
- expectedMap.set(`--${key}`, String(cssVars[key]));
4832
+ expectedMap.set(
4833
+ `--${getEscapedCssVarName(key)}`,
4834
+ String(cssVars[key])
4835
+ );
4821
4836
  }
4822
4837
  }
4823
4838
  if (vnode === root && instance.parent) {
@@ -5251,6 +5266,7 @@ const KeepAliveImpl = {
5251
5266
  );
5252
5267
  const { include, exclude, max } = props;
5253
5268
  if (include && (!name || !matches(include, name)) || exclude && name && matches(exclude, name)) {
5269
+ vnode.shapeFlag &= ~256;
5254
5270
  current = vnode;
5255
5271
  return rawVNode;
5256
5272
  }
@@ -7001,7 +7017,7 @@ function createCompatVue$1(createApp, createSingletonApp) {
7001
7017
  return vm;
7002
7018
  }
7003
7019
  }
7004
- Vue.version = `2.6.14-compat:${"3.5.0-beta.3"}`;
7020
+ Vue.version = `2.6.14-compat:${"3.5.0"}`;
7005
7021
  Vue.config = singletonApp.config;
7006
7022
  Vue.use = (plugin, ...options) => {
7007
7023
  if (plugin && isFunction(plugin.install)) {
@@ -12191,7 +12207,7 @@ function isMemoSame(cached, memo) {
12191
12207
  return true;
12192
12208
  }
12193
12209
 
12194
- const version = "3.5.0-beta.3";
12210
+ const version = "3.5.0";
12195
12211
  const warn = !!(process.env.NODE_ENV !== "production") ? warn$1 : NOOP;
12196
12212
  const ErrorTypeStrings = ErrorTypeStrings$1 ;
12197
12213
  const devtools = !!(process.env.NODE_ENV !== "production") || true ? devtools$1 : void 0;
@@ -12890,15 +12906,20 @@ function compatCoerceAttr(el, key, value, instance = null) {
12890
12906
 
12891
12907
  function patchDOMProp(el, key, value, parentComponent) {
12892
12908
  if (key === "innerHTML" || key === "textContent") {
12893
- if (value == null) return;
12894
- el[key] = value;
12909
+ if (value != null) {
12910
+ el[key] = key === "innerHTML" ? unsafeToTrustedHTML(value) : value;
12911
+ }
12895
12912
  return;
12896
12913
  }
12897
12914
  const tag = el.tagName;
12898
12915
  if (key === "value" && tag !== "PROGRESS" && // custom elements may use _value internally
12899
12916
  !tag.includes("-")) {
12900
12917
  const oldValue = tag === "OPTION" ? el.getAttribute("value") || "" : el.value;
12901
- const newValue = value == null ? "" : String(value);
12918
+ const newValue = value == null ? (
12919
+ // #11647: value should be set as empty string for null and undefined,
12920
+ // but <input type="checkbox"> should be set as 'on'.
12921
+ el.type === "checkbox" ? "on" : ""
12922
+ ) : String(value);
12902
12923
  if (oldValue !== newValue || !("_value" in el)) {
12903
12924
  el.value = newValue;
12904
12925
  }
@@ -13334,6 +13355,9 @@ class VueElement extends BaseClass {
13334
13355
  delete this._props[key];
13335
13356
  } else {
13336
13357
  this._props[key] = val;
13358
+ if (key === "key" && this._app) {
13359
+ this._app._ceVNode.key = val;
13360
+ }
13337
13361
  }
13338
13362
  if (shouldUpdate && this._instance) {
13339
13363
  this._update();
@@ -13781,12 +13805,16 @@ const vModelCheckbox = {
13781
13805
  };
13782
13806
  function setChecked(el, { value, oldValue }, vnode) {
13783
13807
  el._modelValue = value;
13808
+ let checked;
13784
13809
  if (isArray(value)) {
13785
- el.checked = looseIndexOf(value, vnode.props.value) > -1;
13810
+ checked = looseIndexOf(value, vnode.props.value) > -1;
13786
13811
  } else if (isSet(value)) {
13787
- el.checked = value.has(vnode.props.value);
13788
- } else if (value !== oldValue) {
13789
- el.checked = looseEqual(value, getCheckboxValue(el, true));
13812
+ checked = value.has(vnode.props.value);
13813
+ } else {
13814
+ checked = looseEqual(value, getCheckboxValue(el, true));
13815
+ }
13816
+ if (el.checked !== checked) {
13817
+ el.checked = checked;
13790
13818
  }
13791
13819
  }
13792
13820
  const vModelRadio = {
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @vue/compat v3.5.0-beta.3
2
+ * @vue/compat v3.5.0
3
3
  * (c) 2018-present Yuxi (Evan) You and Vue contributors
4
4
  * @license MIT
5
5
  **/
@@ -217,6 +217,14 @@ var Vue = (function () {
217
217
  return type === "string" || type === "number" || type === "boolean";
218
218
  }
219
219
 
220
+ const cssVarNameEscapeSymbolsRE = /[ !"#$%&'()*+,./:;<=>?@[\\\]^`{|}~]/g;
221
+ function getEscapedCssVarName(key, doubleEscape) {
222
+ return key.replace(
223
+ cssVarNameEscapeSymbolsRE,
224
+ (s) => `\\${s}`
225
+ );
226
+ }
227
+
220
228
  function looseCompareArrays(a, b) {
221
229
  if (a.length !== b.length) return false;
222
230
  let equal = true;
@@ -340,12 +348,13 @@ var Vue = (function () {
340
348
  pause() {
341
349
  if (this._active) {
342
350
  this._isPaused = true;
351
+ let i, l;
343
352
  if (this.scopes) {
344
- for (let i = 0, l = this.scopes.length; i < l; i++) {
353
+ for (i = 0, l = this.scopes.length; i < l; i++) {
345
354
  this.scopes[i].pause();
346
355
  }
347
356
  }
348
- for (let i = 0, l = this.effects.length; i < l; i++) {
357
+ for (i = 0, l = this.effects.length; i < l; i++) {
349
358
  this.effects[i].pause();
350
359
  }
351
360
  }
@@ -357,12 +366,13 @@ var Vue = (function () {
357
366
  if (this._active) {
358
367
  if (this._isPaused) {
359
368
  this._isPaused = false;
369
+ let i, l;
360
370
  if (this.scopes) {
361
- for (let i = 0, l = this.scopes.length; i < l; i++) {
371
+ for (i = 0, l = this.scopes.length; i < l; i++) {
362
372
  this.scopes[i].resume();
363
373
  }
364
374
  }
365
- for (let i = 0, l = this.effects.length; i < l; i++) {
375
+ for (i = 0, l = this.effects.length; i < l; i++) {
366
376
  this.effects[i].resume();
367
377
  }
368
378
  }
@@ -555,11 +565,9 @@ var Vue = (function () {
555
565
  batchDepth++;
556
566
  }
557
567
  function endBatch() {
558
- if (batchDepth > 1) {
559
- batchDepth--;
568
+ if (--batchDepth > 0) {
560
569
  return;
561
570
  }
562
- batchDepth--;
563
571
  let error;
564
572
  while (batchedEffect) {
565
573
  let e = batchedEffect;
@@ -1076,7 +1084,7 @@ var Vue = (function () {
1076
1084
  const needsWrap = arr !== self && !isShallow(self);
1077
1085
  const methodFn = arr[method];
1078
1086
  if (methodFn !== arrayProto[method]) {
1079
- const result2 = methodFn.apply(arr, args);
1087
+ const result2 = methodFn.apply(self, args);
1080
1088
  return needsWrap ? toReactive(result2) : result2;
1081
1089
  }
1082
1090
  let wrappedFn = fn;
@@ -1218,7 +1226,12 @@ var Vue = (function () {
1218
1226
  }
1219
1227
  }
1220
1228
  const hadKey = isArray(target) && isIntegerKey(key) ? Number(key) < target.length : hasOwn(target, key);
1221
- const result = Reflect.set(target, key, value, receiver);
1229
+ const result = Reflect.set(
1230
+ target,
1231
+ key,
1232
+ value,
1233
+ isRef(target) ? target : receiver
1234
+ );
1222
1235
  if (target === toRaw(receiver)) {
1223
1236
  if (!hadKey) {
1224
1237
  trigger(target, "add", key, value);
@@ -2031,18 +2044,25 @@ var Vue = (function () {
2031
2044
  const depth = deep === true ? Infinity : deep;
2032
2045
  getter = () => traverse(baseGetter(), depth);
2033
2046
  }
2047
+ const scope = getCurrentScope();
2048
+ const watchHandle = () => {
2049
+ effect.stop();
2050
+ if (scope) {
2051
+ remove(scope.effects, effect);
2052
+ }
2053
+ };
2034
2054
  if (once) {
2035
2055
  if (cb) {
2036
2056
  const _cb = cb;
2037
2057
  cb = (...args) => {
2038
2058
  _cb(...args);
2039
- effect.stop();
2059
+ watchHandle();
2040
2060
  };
2041
2061
  } else {
2042
2062
  const _getter = getter;
2043
2063
  getter = () => {
2044
2064
  _getter();
2045
- effect.stop();
2065
+ watchHandle();
2046
2066
  };
2047
2067
  }
2048
2068
  }
@@ -2111,13 +2131,6 @@ var Vue = (function () {
2111
2131
  } else {
2112
2132
  effect.run();
2113
2133
  }
2114
- const scope = getCurrentScope();
2115
- const watchHandle = () => {
2116
- effect.stop();
2117
- if (scope) {
2118
- remove(scope.effects, effect);
2119
- }
2120
- };
2121
2134
  watchHandle.pause = effect.pause.bind(effect);
2122
2135
  watchHandle.resume = effect.resume.bind(effect);
2123
2136
  watchHandle.stop = watchHandle;
@@ -4097,7 +4110,7 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
4097
4110
  // @__NO_SIDE_EFFECTS__
4098
4111
  function defineComponent(options, extraOptions) {
4099
4112
  return isFunction(options) ? (
4100
- // #8326: extend call and options.name access are considered side-effects
4113
+ // #8236: extend call and options.name access are considered side-effects
4101
4114
  // by Rollup, so we have to wrap it in a pure-annotated IIFE.
4102
4115
  /* @__PURE__ */ (() => extend({ name: options.name }, extraOptions, { setup: options }))()
4103
4116
  ) : options;
@@ -4533,8 +4546,7 @@ Server rendered element contains more child nodes than client vdom.`
4533
4546
  const isText = vnode.type === Text;
4534
4547
  if (node) {
4535
4548
  if (isText && !optimized) {
4536
- let next = children[i + 1];
4537
- if (next && (next = normalizeVNode(next)).type === Text) {
4549
+ if (i + 1 < l && normalizeVNode(children[i + 1]).type === Text) {
4538
4550
  insert(
4539
4551
  createText(
4540
4552
  node.data.slice(vnode.children.length)
@@ -4790,7 +4802,10 @@ Server rendered element contains fewer child nodes than client vdom.`
4790
4802
  if (instance.getCssVars && (vnode === root || root && root.type === Fragment && root.children.includes(vnode))) {
4791
4803
  const cssVars = instance.getCssVars();
4792
4804
  for (const key in cssVars) {
4793
- expectedMap.set(`--${key}`, String(cssVars[key]));
4805
+ expectedMap.set(
4806
+ `--${getEscapedCssVarName(key)}`,
4807
+ String(cssVars[key])
4808
+ );
4794
4809
  }
4795
4810
  }
4796
4811
  if (vnode === root && instance.parent) {
@@ -5218,6 +5233,7 @@ Server rendered element contains fewer child nodes than client vdom.`
5218
5233
  );
5219
5234
  const { include, exclude, max } = props;
5220
5235
  if (include && (!name || !matches(include, name)) || exclude && name && matches(exclude, name)) {
5236
+ vnode.shapeFlag &= ~256;
5221
5237
  current = vnode;
5222
5238
  return rawVNode;
5223
5239
  }
@@ -6963,7 +6979,7 @@ If this is a native custom element, make sure to exclude it from component resol
6963
6979
  return vm;
6964
6980
  }
6965
6981
  }
6966
- Vue.version = `2.6.14-compat:${"3.5.0-beta.3"}`;
6982
+ Vue.version = `2.6.14-compat:${"3.5.0"}`;
6967
6983
  Vue.config = singletonApp.config;
6968
6984
  Vue.use = (plugin, ...options) => {
6969
6985
  if (plugin && isFunction(plugin.install)) {
@@ -12063,7 +12079,7 @@ Component that was made reactive: `,
12063
12079
  return true;
12064
12080
  }
12065
12081
 
12066
- const version = "3.5.0-beta.3";
12082
+ const version = "3.5.0";
12067
12083
  const warn = warn$1 ;
12068
12084
  const ErrorTypeStrings = ErrorTypeStrings$1 ;
12069
12085
  const devtools = devtools$1 ;
@@ -12745,15 +12761,20 @@ Component that was made reactive: `,
12745
12761
 
12746
12762
  function patchDOMProp(el, key, value, parentComponent) {
12747
12763
  if (key === "innerHTML" || key === "textContent") {
12748
- if (value == null) return;
12749
- el[key] = value;
12764
+ if (value != null) {
12765
+ el[key] = key === "innerHTML" ? unsafeToTrustedHTML(value) : value;
12766
+ }
12750
12767
  return;
12751
12768
  }
12752
12769
  const tag = el.tagName;
12753
12770
  if (key === "value" && tag !== "PROGRESS" && // custom elements may use _value internally
12754
12771
  !tag.includes("-")) {
12755
12772
  const oldValue = tag === "OPTION" ? el.getAttribute("value") || "" : el.value;
12756
- const newValue = value == null ? "" : String(value);
12773
+ const newValue = value == null ? (
12774
+ // #11647: value should be set as empty string for null and undefined,
12775
+ // but <input type="checkbox"> should be set as 'on'.
12776
+ el.type === "checkbox" ? "on" : ""
12777
+ ) : String(value);
12757
12778
  if (oldValue !== newValue || !("_value" in el)) {
12758
12779
  el.value = newValue;
12759
12780
  }
@@ -13189,6 +13210,9 @@ Expected function or array of functions, received type ${typeof value}.`
13189
13210
  delete this._props[key];
13190
13211
  } else {
13191
13212
  this._props[key] = val;
13213
+ if (key === "key" && this._app) {
13214
+ this._app._ceVNode.key = val;
13215
+ }
13192
13216
  }
13193
13217
  if (shouldUpdate && this._instance) {
13194
13218
  this._update();
@@ -13624,12 +13648,16 @@ Expected function or array of functions, received type ${typeof value}.`
13624
13648
  };
13625
13649
  function setChecked(el, { value, oldValue }, vnode) {
13626
13650
  el._modelValue = value;
13651
+ let checked;
13627
13652
  if (isArray(value)) {
13628
- el.checked = looseIndexOf(value, vnode.props.value) > -1;
13653
+ checked = looseIndexOf(value, vnode.props.value) > -1;
13629
13654
  } else if (isSet(value)) {
13630
- el.checked = value.has(vnode.props.value);
13631
- } else if (value !== oldValue) {
13632
- el.checked = looseEqual(value, getCheckboxValue(el, true));
13655
+ checked = value.has(vnode.props.value);
13656
+ } else {
13657
+ checked = looseEqual(value, getCheckboxValue(el, true));
13658
+ }
13659
+ if (el.checked !== checked) {
13660
+ el.checked = checked;
13633
13661
  }
13634
13662
  }
13635
13663
  const vModelRadio = {