@vue/compat 3.2.32 → 3.2.33

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.
@@ -612,10 +612,17 @@ class ReactiveEffect {
612
612
  activeEffect = this.parent;
613
613
  shouldTrack = lastShouldTrack;
614
614
  this.parent = undefined;
615
+ if (this.deferStop) {
616
+ this.stop();
617
+ }
615
618
  }
616
619
  }
617
620
  stop() {
618
- if (this.active) {
621
+ // stopped while running itself - defer the cleanup
622
+ if (activeEffect === this) {
623
+ this.deferStop = true;
624
+ }
625
+ else if (this.active) {
619
626
  cleanupEffect(this);
620
627
  if (this.onStop) {
621
628
  this.onStop();
@@ -790,7 +797,9 @@ function triggerEffects(dep, debuggerEventExtraInfo) {
790
797
  }
791
798
 
792
799
  const isNonTrackableKeys = /*#__PURE__*/ makeMap(`__proto__,__v_isRef,__isVue`);
793
- const builtInSymbols = new Set(Object.getOwnPropertyNames(Symbol)
800
+ const builtInSymbols = new Set(
801
+ /*#__PURE__*/
802
+ Object.getOwnPropertyNames(Symbol)
794
803
  .map(key => Symbol[key])
795
804
  .filter(isSymbol));
796
805
  const get = /*#__PURE__*/ createGetter();
@@ -942,13 +951,13 @@ const readonlyHandlers = {
942
951
  get: readonlyGet,
943
952
  set(target, key) {
944
953
  {
945
- console.warn(`Set operation on key "${String(key)}" failed: target is readonly.`, target);
954
+ warn(`Set operation on key "${String(key)}" failed: target is readonly.`, target);
946
955
  }
947
956
  return true;
948
957
  },
949
958
  deleteProperty(target, key) {
950
959
  {
951
- console.warn(`Delete operation on key "${String(key)}" failed: target is readonly.`, target);
960
+ warn(`Delete operation on key "${String(key)}" failed: target is readonly.`, target);
952
961
  }
953
962
  return true;
954
963
  }
@@ -1776,7 +1785,7 @@ let preFlushIndex = 0;
1776
1785
  const pendingPostFlushCbs = [];
1777
1786
  let activePostFlushCbs = null;
1778
1787
  let postFlushIndex = 0;
1779
- const resolvedPromise = Promise.resolve();
1788
+ const resolvedPromise = /*#__PURE__*/ Promise.resolve();
1780
1789
  let currentFlushPromise = null;
1781
1790
  let currentPreFlushParentJob = null;
1782
1791
  const RECURSION_LIMIT = 100;
@@ -2710,6 +2719,8 @@ function compatModelEmit(instance, event, args) {
2710
2719
  }
2711
2720
 
2712
2721
  function emit$2(instance, event, ...rawArgs) {
2722
+ if (instance.isUnmounted)
2723
+ return;
2713
2724
  const props = instance.vnode.props || EMPTY_OBJ;
2714
2725
  {
2715
2726
  const { emitsOptions, propsOptions: [propsOptions] } = instance;
@@ -4029,10 +4040,22 @@ const BaseTransitionImpl = {
4029
4040
  if (!children || !children.length) {
4030
4041
  return;
4031
4042
  }
4032
- // warn multiple elements
4043
+ let child = children[0];
4033
4044
  if (children.length > 1) {
4034
- warn$1('<transition> can only be used on a single element or component. Use ' +
4035
- '<transition-group> for lists.');
4045
+ let hasFound = false;
4046
+ // locate first non-comment child
4047
+ for (const c of children) {
4048
+ if (c.type !== Comment) {
4049
+ if (hasFound) {
4050
+ // warn more than one non-comment child
4051
+ warn$1('<transition> can only be used on a single element or component. ' +
4052
+ 'Use <transition-group> for lists.');
4053
+ break;
4054
+ }
4055
+ child = c;
4056
+ hasFound = true;
4057
+ }
4058
+ }
4036
4059
  }
4037
4060
  // there's no need to track reactivity for these props so use the raw
4038
4061
  // props for a bit better perf
@@ -4045,8 +4068,6 @@ const BaseTransitionImpl = {
4045
4068
  mode !== 'default') {
4046
4069
  warn$1(`invalid <transition> mode: ${mode}`);
4047
4070
  }
4048
- // at this point children has a guaranteed length of 1.
4049
- const child = children[0];
4050
4071
  if (state.isLeaving) {
4051
4072
  return emptyPlaceholder(child);
4052
4073
  }
@@ -6057,7 +6078,7 @@ function createCompatVue(createApp, createSingletonApp) {
6057
6078
  return vm;
6058
6079
  }
6059
6080
  }
6060
- Vue.version = `2.6.14-compat:${"3.2.32"}`;
6081
+ Vue.version = `2.6.14-compat:${"3.2.33"}`;
6061
6082
  Vue.config = singletonApp.config;
6062
6083
  Vue.use = (p, ...options) => {
6063
6084
  if (p && isFunction(p.install)) {
@@ -8221,7 +8242,22 @@ function baseCreateRenderer(options, createHydrationFns) {
8221
8242
  const remove = vnode => {
8222
8243
  const { type, el, anchor, transition } = vnode;
8223
8244
  if (type === Fragment) {
8224
- removeFragment(el, anchor);
8245
+ if (vnode.patchFlag > 0 &&
8246
+ vnode.patchFlag & 2048 /* DEV_ROOT_FRAGMENT */ &&
8247
+ transition &&
8248
+ !transition.persisted) {
8249
+ vnode.children.forEach(child => {
8250
+ if (child.type === Comment) {
8251
+ hostRemove(child.el);
8252
+ }
8253
+ else {
8254
+ remove(child);
8255
+ }
8256
+ });
8257
+ }
8258
+ else {
8259
+ removeFragment(el, anchor);
8260
+ }
8225
8261
  return;
8226
8262
  }
8227
8263
  if (type === Static) {
@@ -9614,7 +9650,10 @@ function renderSlot(slots, name, props = {},
9614
9650
  // this is not a user-facing function, so the fallback is always generated by
9615
9651
  // the compiler and guaranteed to be a function returning an array
9616
9652
  fallback, noSlotted) {
9617
- if (currentRenderingInstance.isCE) {
9653
+ if (currentRenderingInstance.isCE ||
9654
+ (currentRenderingInstance.parent &&
9655
+ isAsyncWrapper(currentRenderingInstance.parent) &&
9656
+ currentRenderingInstance.parent.isCE)) {
9618
9657
  return createVNode('slot', name === 'default' ? null : { name }, fallback && fallback());
9619
9658
  }
9620
9659
  let slot = slots[name];
@@ -9904,7 +9943,10 @@ const getPublicInstance = (i) => {
9904
9943
  return getExposeProxy(i) || i.proxy;
9905
9944
  return getPublicInstance(i.parent);
9906
9945
  };
9907
- const publicPropertiesMap = extend(Object.create(null), {
9946
+ const publicPropertiesMap =
9947
+ // Move PURE marker to new line to workaround compiler discarding it
9948
+ // due to type annotation
9949
+ /*#__PURE__*/ extend(Object.create(null), {
9908
9950
  $: i => i,
9909
9951
  $el: i => i.vnode.el,
9910
9952
  $data: i => i.data,
@@ -10017,7 +10059,9 @@ const PublicInstanceProxyHandlers = {
10017
10059
  }
10018
10060
  else {
10019
10061
  const val = globalProperties[key];
10020
- return isFunction(val) ? val.bind(instance.proxy) : val;
10062
+ return isFunction(val)
10063
+ ? Object.assign(val.bind(instance.proxy), val)
10064
+ : val;
10021
10065
  }
10022
10066
  }
10023
10067
  }
@@ -10084,7 +10128,7 @@ const PublicInstanceProxyHandlers = {
10084
10128
  defineProperty(target, key, descriptor) {
10085
10129
  if (descriptor.get != null) {
10086
10130
  // invalidate key cache of a getter based property #5417
10087
- target.$.accessCache[key] = 0;
10131
+ target._.accessCache[key] = 0;
10088
10132
  }
10089
10133
  else if (hasOwn(descriptor, 'value')) {
10090
10134
  this.set(target, key, descriptor.value, null);
@@ -10292,6 +10336,7 @@ function setupComponent(instance, isSSR = false) {
10292
10336
  return setupResult;
10293
10337
  }
10294
10338
  function setupStatefulComponent(instance, isSSR) {
10339
+ var _a;
10295
10340
  const Component = instance.type;
10296
10341
  {
10297
10342
  if (Component.name) {
@@ -10349,6 +10394,13 @@ function setupStatefulComponent(instance, isSSR) {
10349
10394
  // async setup returned Promise.
10350
10395
  // bail here and wait for re-entry.
10351
10396
  instance.asyncDep = setupResult;
10397
+ if (!instance.suspense) {
10398
+ const name = (_a = Component.name) !== null && _a !== void 0 ? _a : 'Anonymous';
10399
+ warn$1(`Component <${name}>: setup function returned a promise, but no ` +
10400
+ `<Suspense> boundary was found in the parent component tree. ` +
10401
+ `A component with async setup() must be nested in a <Suspense> ` +
10402
+ `in order to be rendered.`);
10403
+ }
10352
10404
  }
10353
10405
  }
10354
10406
  else {
@@ -10980,7 +11032,7 @@ function isMemoSame(cached, memo) {
10980
11032
  }
10981
11033
 
10982
11034
  // Core API ------------------------------------------------------------------
10983
- const version = "3.2.32";
11035
+ const version = "3.2.33";
10984
11036
  /**
10985
11037
  * SSR utils for \@vue/server-renderer. Only exposed in cjs builds.
10986
11038
  * @internal
@@ -11004,7 +11056,7 @@ const compatUtils = (_compatUtils );
11004
11056
 
11005
11057
  const svgNS = 'http://www.w3.org/2000/svg';
11006
11058
  const doc = (typeof document !== 'undefined' ? document : null);
11007
- const templateContainer = doc && doc.createElement('template');
11059
+ const templateContainer = doc && /*#__PURE__*/ doc.createElement('template');
11008
11060
  const nodeOps = {
11009
11061
  insert: (child, parent, anchor) => {
11010
11062
  parent.insertBefore(child, anchor || null);
@@ -11155,6 +11207,8 @@ function setStyle(style, name, val) {
11155
11207
  val.forEach(v => setStyle(style, name, v));
11156
11208
  }
11157
11209
  else {
11210
+ if (val == null)
11211
+ val = '';
11158
11212
  if (name.startsWith('--')) {
11159
11213
  // custom property definition
11160
11214
  style.setProperty(name, val);
@@ -11276,41 +11330,39 @@ prevChildren, parentComponent, parentSuspense, unmountChildren) {
11276
11330
  }
11277
11331
  return;
11278
11332
  }
11333
+ let needRemove = false;
11279
11334
  if (value === '' || value == null) {
11280
11335
  const type = typeof el[key];
11281
11336
  if (type === 'boolean') {
11282
11337
  // e.g. <select multiple> compiles to { multiple: '' }
11283
- el[key] = includeBooleanAttr(value);
11284
- return;
11338
+ value = includeBooleanAttr(value);
11285
11339
  }
11286
11340
  else if (value == null && type === 'string') {
11287
11341
  // e.g. <div :id="null">
11288
- el[key] = '';
11289
- el.removeAttribute(key);
11290
- return;
11342
+ value = '';
11343
+ needRemove = true;
11291
11344
  }
11292
11345
  else if (type === 'number') {
11293
11346
  // e.g. <img :width="null">
11294
11347
  // the value of some IDL attr must be greater than 0, e.g. input.size = 0 -> error
11295
- try {
11296
- el[key] = 0;
11297
- }
11298
- catch (_a) { }
11299
- el.removeAttribute(key);
11300
- return;
11348
+ value = 0;
11349
+ needRemove = true;
11301
11350
  }
11302
11351
  }
11303
- if (value === false &&
11304
- compatUtils.isCompatEnabled("ATTR_FALSE_VALUE" /* ATTR_FALSE_VALUE */, parentComponent)) {
11305
- const type = typeof el[key];
11306
- if (type === 'string' || type === 'number') {
11307
- compatUtils.warnDeprecation("ATTR_FALSE_VALUE" /* ATTR_FALSE_VALUE */, parentComponent, key);
11308
- el[key] = type === 'number' ? 0 : '';
11309
- el.removeAttribute(key);
11310
- return;
11352
+ else {
11353
+ if (value === false &&
11354
+ compatUtils.isCompatEnabled("ATTR_FALSE_VALUE" /* ATTR_FALSE_VALUE */, parentComponent)) {
11355
+ const type = typeof el[key];
11356
+ if (type === 'string' || type === 'number') {
11357
+ compatUtils.warnDeprecation("ATTR_FALSE_VALUE" /* ATTR_FALSE_VALUE */, parentComponent, key);
11358
+ value = type === 'number' ? 0 : '';
11359
+ needRemove = true;
11360
+ }
11311
11361
  }
11312
11362
  }
11313
- // some properties perform value validation and throw
11363
+ // some properties perform value validation and throw,
11364
+ // some properties has getter, no setter, will error in 'use strict'
11365
+ // eg. <select :type="null"></select> <select :willValidate="null"></select>
11314
11366
  try {
11315
11367
  el[key] = value;
11316
11368
  }
@@ -11320,31 +11372,35 @@ prevChildren, parentComponent, parentSuspense, unmountChildren) {
11320
11372
  `value ${value} is invalid.`, e);
11321
11373
  }
11322
11374
  }
11375
+ needRemove && el.removeAttribute(key);
11323
11376
  }
11324
11377
 
11325
11378
  // Async edge case fix requires storing an event listener's attach timestamp.
11326
- let _getNow = Date.now;
11327
- let skipTimestampCheck = false;
11328
- if (typeof window !== 'undefined') {
11329
- // Determine what event timestamp the browser is using. Annoyingly, the
11330
- // timestamp can either be hi-res (relative to page load) or low-res
11331
- // (relative to UNIX epoch), so in order to compare time we have to use the
11332
- // same timestamp type when saving the flush timestamp.
11333
- if (_getNow() > document.createEvent('Event').timeStamp) {
11334
- // if the low-res timestamp which is bigger than the event timestamp
11335
- // (which is evaluated AFTER) it means the event is using a hi-res timestamp,
11336
- // and we need to use the hi-res version for event listeners as well.
11337
- _getNow = () => performance.now();
11338
- }
11339
- // #3485: Firefox <= 53 has incorrect Event.timeStamp implementation
11340
- // and does not fire microtasks in between event propagation, so safe to exclude.
11341
- const ffMatch = navigator.userAgent.match(/firefox\/(\d+)/i);
11342
- skipTimestampCheck = !!(ffMatch && Number(ffMatch[1]) <= 53);
11343
- }
11379
+ const [_getNow, skipTimestampCheck] = /*#__PURE__*/ (() => {
11380
+ let _getNow = Date.now;
11381
+ let skipTimestampCheck = false;
11382
+ if (typeof window !== 'undefined') {
11383
+ // Determine what event timestamp the browser is using. Annoyingly, the
11384
+ // timestamp can either be hi-res (relative to page load) or low-res
11385
+ // (relative to UNIX epoch), so in order to compare time we have to use the
11386
+ // same timestamp type when saving the flush timestamp.
11387
+ if (Date.now() > document.createEvent('Event').timeStamp) {
11388
+ // if the low-res timestamp which is bigger than the event timestamp
11389
+ // (which is evaluated AFTER) it means the event is using a hi-res timestamp,
11390
+ // and we need to use the hi-res version for event listeners as well.
11391
+ _getNow = () => performance.now();
11392
+ }
11393
+ // #3485: Firefox <= 53 has incorrect Event.timeStamp implementation
11394
+ // and does not fire microtasks in between event propagation, so safe to exclude.
11395
+ const ffMatch = navigator.userAgent.match(/firefox\/(\d+)/i);
11396
+ skipTimestampCheck = !!(ffMatch && Number(ffMatch[1]) <= 53);
11397
+ }
11398
+ return [_getNow, skipTimestampCheck];
11399
+ })();
11344
11400
  // To avoid the overhead of repeatedly calling performance.now(), we cache
11345
11401
  // and use the same timestamp for all event listeners attached in the same tick.
11346
11402
  let cachedNow = 0;
11347
- const p = Promise.resolve();
11403
+ const p = /*#__PURE__*/ Promise.resolve();
11348
11404
  const reset = () => {
11349
11405
  cachedNow = 0;
11350
11406
  };
@@ -11469,13 +11525,13 @@ function shouldSetAsProp(el, key, value, isSVG) {
11469
11525
  }
11470
11526
  return false;
11471
11527
  }
11472
- // spellcheck and draggable are numerated attrs, however their
11473
- // corresponding DOM properties are actually booleans - this leads to
11474
- // setting it with a string "false" value leading it to be coerced to
11475
- // `true`, so we need to always treat them as attributes.
11528
+ // these are enumerated attrs, however their corresponding DOM properties
11529
+ // are actually booleans - this leads to setting it with a string "false"
11530
+ // value leading it to be coerced to `true`, so we need to always treat
11531
+ // them as attributes.
11476
11532
  // Note that `contentEditable` doesn't have this problem: its DOM
11477
11533
  // property is also enumerated string values.
11478
- if (key === 'spellcheck' || key === 'draggable') {
11534
+ if (key === 'spellcheck' || key === 'draggable' || key === 'translate') {
11479
11535
  return false;
11480
11536
  }
11481
11537
  // #1787, #2840 form property on form elements is readonly and must be set as
@@ -12617,7 +12673,7 @@ function setDisplay(el, value) {
12617
12673
  el.style.display = value ? el._vod : 'none';
12618
12674
  }
12619
12675
 
12620
- const rendererOptions = extend({ patchProp }, nodeOps);
12676
+ const rendererOptions = /*#__PURE__*/ extend({ patchProp }, nodeOps);
12621
12677
  // lazy create the renderer - this makes core renderer logic tree-shakable
12622
12678
  // in case the user only imports reactivity utilities from Vue.
12623
12679
  let renderer;