@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.
@@ -533,10 +533,17 @@ class ReactiveEffect {
533
533
  activeEffect = this.parent;
534
534
  shouldTrack = lastShouldTrack;
535
535
  this.parent = undefined;
536
+ if (this.deferStop) {
537
+ this.stop();
538
+ }
536
539
  }
537
540
  }
538
541
  stop() {
539
- if (this.active) {
542
+ // stopped while running itself - defer the cleanup
543
+ if (activeEffect === this) {
544
+ this.deferStop = true;
545
+ }
546
+ else if (this.active) {
540
547
  cleanupEffect(this);
541
548
  if (this.onStop) {
542
549
  this.onStop();
@@ -711,7 +718,9 @@ function triggerEffects(dep, debuggerEventExtraInfo) {
711
718
  }
712
719
 
713
720
  const isNonTrackableKeys = /*#__PURE__*/ makeMap(`__proto__,__v_isRef,__isVue`);
714
- const builtInSymbols = new Set(Object.getOwnPropertyNames(Symbol)
721
+ const builtInSymbols = new Set(
722
+ /*#__PURE__*/
723
+ Object.getOwnPropertyNames(Symbol)
715
724
  .map(key => Symbol[key])
716
725
  .filter(isSymbol));
717
726
  const get = /*#__PURE__*/ createGetter();
@@ -863,13 +872,13 @@ const readonlyHandlers = {
863
872
  get: readonlyGet,
864
873
  set(target, key) {
865
874
  {
866
- console.warn(`Set operation on key "${String(key)}" failed: target is readonly.`, target);
875
+ warn(`Set operation on key "${String(key)}" failed: target is readonly.`, target);
867
876
  }
868
877
  return true;
869
878
  },
870
879
  deleteProperty(target, key) {
871
880
  {
872
- console.warn(`Delete operation on key "${String(key)}" failed: target is readonly.`, target);
881
+ warn(`Delete operation on key "${String(key)}" failed: target is readonly.`, target);
873
882
  }
874
883
  return true;
875
884
  }
@@ -1697,7 +1706,7 @@ let preFlushIndex = 0;
1697
1706
  const pendingPostFlushCbs = [];
1698
1707
  let activePostFlushCbs = null;
1699
1708
  let postFlushIndex = 0;
1700
- const resolvedPromise = Promise.resolve();
1709
+ const resolvedPromise = /*#__PURE__*/ Promise.resolve();
1701
1710
  let currentFlushPromise = null;
1702
1711
  let currentPreFlushParentJob = null;
1703
1712
  const RECURSION_LIMIT = 100;
@@ -2631,6 +2640,8 @@ function compatModelEmit(instance, event, args) {
2631
2640
  }
2632
2641
 
2633
2642
  function emit$2(instance, event, ...rawArgs) {
2643
+ if (instance.isUnmounted)
2644
+ return;
2634
2645
  const props = instance.vnode.props || EMPTY_OBJ;
2635
2646
  {
2636
2647
  const { emitsOptions, propsOptions: [propsOptions] } = instance;
@@ -3950,10 +3961,22 @@ const BaseTransitionImpl = {
3950
3961
  if (!children || !children.length) {
3951
3962
  return;
3952
3963
  }
3953
- // warn multiple elements
3964
+ let child = children[0];
3954
3965
  if (children.length > 1) {
3955
- warn$1('<transition> can only be used on a single element or component. Use ' +
3956
- '<transition-group> for lists.');
3966
+ let hasFound = false;
3967
+ // locate first non-comment child
3968
+ for (const c of children) {
3969
+ if (c.type !== Comment) {
3970
+ if (hasFound) {
3971
+ // warn more than one non-comment child
3972
+ warn$1('<transition> can only be used on a single element or component. ' +
3973
+ 'Use <transition-group> for lists.');
3974
+ break;
3975
+ }
3976
+ child = c;
3977
+ hasFound = true;
3978
+ }
3979
+ }
3957
3980
  }
3958
3981
  // there's no need to track reactivity for these props so use the raw
3959
3982
  // props for a bit better perf
@@ -3966,8 +3989,6 @@ const BaseTransitionImpl = {
3966
3989
  mode !== 'default') {
3967
3990
  warn$1(`invalid <transition> mode: ${mode}`);
3968
3991
  }
3969
- // at this point children has a guaranteed length of 1.
3970
- const child = children[0];
3971
3992
  if (state.isLeaving) {
3972
3993
  return emptyPlaceholder(child);
3973
3994
  }
@@ -5978,7 +5999,7 @@ function createCompatVue(createApp, createSingletonApp) {
5978
5999
  return vm;
5979
6000
  }
5980
6001
  }
5981
- Vue.version = `2.6.14-compat:${"3.2.32"}`;
6002
+ Vue.version = `2.6.14-compat:${"3.2.33"}`;
5982
6003
  Vue.config = singletonApp.config;
5983
6004
  Vue.use = (p, ...options) => {
5984
6005
  if (p && isFunction(p.install)) {
@@ -8142,7 +8163,22 @@ function baseCreateRenderer(options, createHydrationFns) {
8142
8163
  const remove = vnode => {
8143
8164
  const { type, el, anchor, transition } = vnode;
8144
8165
  if (type === Fragment) {
8145
- removeFragment(el, anchor);
8166
+ if (vnode.patchFlag > 0 &&
8167
+ vnode.patchFlag & 2048 /* DEV_ROOT_FRAGMENT */ &&
8168
+ transition &&
8169
+ !transition.persisted) {
8170
+ vnode.children.forEach(child => {
8171
+ if (child.type === Comment) {
8172
+ hostRemove(child.el);
8173
+ }
8174
+ else {
8175
+ remove(child);
8176
+ }
8177
+ });
8178
+ }
8179
+ else {
8180
+ removeFragment(el, anchor);
8181
+ }
8146
8182
  return;
8147
8183
  }
8148
8184
  if (type === Static) {
@@ -9535,7 +9571,10 @@ function renderSlot(slots, name, props = {},
9535
9571
  // this is not a user-facing function, so the fallback is always generated by
9536
9572
  // the compiler and guaranteed to be a function returning an array
9537
9573
  fallback, noSlotted) {
9538
- if (currentRenderingInstance.isCE) {
9574
+ if (currentRenderingInstance.isCE ||
9575
+ (currentRenderingInstance.parent &&
9576
+ isAsyncWrapper(currentRenderingInstance.parent) &&
9577
+ currentRenderingInstance.parent.isCE)) {
9539
9578
  return createVNode('slot', name === 'default' ? null : { name }, fallback && fallback());
9540
9579
  }
9541
9580
  let slot = slots[name];
@@ -9825,7 +9864,10 @@ const getPublicInstance = (i) => {
9825
9864
  return getExposeProxy(i) || i.proxy;
9826
9865
  return getPublicInstance(i.parent);
9827
9866
  };
9828
- const publicPropertiesMap = extend(Object.create(null), {
9867
+ const publicPropertiesMap =
9868
+ // Move PURE marker to new line to workaround compiler discarding it
9869
+ // due to type annotation
9870
+ /*#__PURE__*/ extend(Object.create(null), {
9829
9871
  $: i => i,
9830
9872
  $el: i => i.vnode.el,
9831
9873
  $data: i => i.data,
@@ -9938,7 +9980,9 @@ const PublicInstanceProxyHandlers = {
9938
9980
  }
9939
9981
  else {
9940
9982
  const val = globalProperties[key];
9941
- return isFunction(val) ? val.bind(instance.proxy) : val;
9983
+ return isFunction(val)
9984
+ ? Object.assign(val.bind(instance.proxy), val)
9985
+ : val;
9942
9986
  }
9943
9987
  }
9944
9988
  }
@@ -10005,7 +10049,7 @@ const PublicInstanceProxyHandlers = {
10005
10049
  defineProperty(target, key, descriptor) {
10006
10050
  if (descriptor.get != null) {
10007
10051
  // invalidate key cache of a getter based property #5417
10008
- target.$.accessCache[key] = 0;
10052
+ target._.accessCache[key] = 0;
10009
10053
  }
10010
10054
  else if (hasOwn(descriptor, 'value')) {
10011
10055
  this.set(target, key, descriptor.value, null);
@@ -10213,6 +10257,7 @@ function setupComponent(instance, isSSR = false) {
10213
10257
  return setupResult;
10214
10258
  }
10215
10259
  function setupStatefulComponent(instance, isSSR) {
10260
+ var _a;
10216
10261
  const Component = instance.type;
10217
10262
  {
10218
10263
  if (Component.name) {
@@ -10270,6 +10315,13 @@ function setupStatefulComponent(instance, isSSR) {
10270
10315
  // async setup returned Promise.
10271
10316
  // bail here and wait for re-entry.
10272
10317
  instance.asyncDep = setupResult;
10318
+ if (!instance.suspense) {
10319
+ const name = (_a = Component.name) !== null && _a !== void 0 ? _a : 'Anonymous';
10320
+ warn$1(`Component <${name}>: setup function returned a promise, but no ` +
10321
+ `<Suspense> boundary was found in the parent component tree. ` +
10322
+ `A component with async setup() must be nested in a <Suspense> ` +
10323
+ `in order to be rendered.`);
10324
+ }
10273
10325
  }
10274
10326
  }
10275
10327
  else {
@@ -10901,7 +10953,7 @@ function isMemoSame(cached, memo) {
10901
10953
  }
10902
10954
 
10903
10955
  // Core API ------------------------------------------------------------------
10904
- const version = "3.2.32";
10956
+ const version = "3.2.33";
10905
10957
  /**
10906
10958
  * SSR utils for \@vue/server-renderer. Only exposed in cjs builds.
10907
10959
  * @internal
@@ -10925,7 +10977,7 @@ const compatUtils = (_compatUtils );
10925
10977
 
10926
10978
  const svgNS = 'http://www.w3.org/2000/svg';
10927
10979
  const doc = (typeof document !== 'undefined' ? document : null);
10928
- const templateContainer = doc && doc.createElement('template');
10980
+ const templateContainer = doc && /*#__PURE__*/ doc.createElement('template');
10929
10981
  const nodeOps = {
10930
10982
  insert: (child, parent, anchor) => {
10931
10983
  parent.insertBefore(child, anchor || null);
@@ -11076,6 +11128,8 @@ function setStyle(style, name, val) {
11076
11128
  val.forEach(v => setStyle(style, name, v));
11077
11129
  }
11078
11130
  else {
11131
+ if (val == null)
11132
+ val = '';
11079
11133
  if (name.startsWith('--')) {
11080
11134
  // custom property definition
11081
11135
  style.setProperty(name, val);
@@ -11197,41 +11251,39 @@ prevChildren, parentComponent, parentSuspense, unmountChildren) {
11197
11251
  }
11198
11252
  return;
11199
11253
  }
11254
+ let needRemove = false;
11200
11255
  if (value === '' || value == null) {
11201
11256
  const type = typeof el[key];
11202
11257
  if (type === 'boolean') {
11203
11258
  // e.g. <select multiple> compiles to { multiple: '' }
11204
- el[key] = includeBooleanAttr(value);
11205
- return;
11259
+ value = includeBooleanAttr(value);
11206
11260
  }
11207
11261
  else if (value == null && type === 'string') {
11208
11262
  // e.g. <div :id="null">
11209
- el[key] = '';
11210
- el.removeAttribute(key);
11211
- return;
11263
+ value = '';
11264
+ needRemove = true;
11212
11265
  }
11213
11266
  else if (type === 'number') {
11214
11267
  // e.g. <img :width="null">
11215
11268
  // the value of some IDL attr must be greater than 0, e.g. input.size = 0 -> error
11216
- try {
11217
- el[key] = 0;
11218
- }
11219
- catch (_a) { }
11220
- el.removeAttribute(key);
11221
- return;
11269
+ value = 0;
11270
+ needRemove = true;
11222
11271
  }
11223
11272
  }
11224
- if (value === false &&
11225
- compatUtils.isCompatEnabled("ATTR_FALSE_VALUE" /* ATTR_FALSE_VALUE */, parentComponent)) {
11226
- const type = typeof el[key];
11227
- if (type === 'string' || type === 'number') {
11228
- compatUtils.warnDeprecation("ATTR_FALSE_VALUE" /* ATTR_FALSE_VALUE */, parentComponent, key);
11229
- el[key] = type === 'number' ? 0 : '';
11230
- el.removeAttribute(key);
11231
- return;
11273
+ else {
11274
+ if (value === false &&
11275
+ compatUtils.isCompatEnabled("ATTR_FALSE_VALUE" /* ATTR_FALSE_VALUE */, parentComponent)) {
11276
+ const type = typeof el[key];
11277
+ if (type === 'string' || type === 'number') {
11278
+ compatUtils.warnDeprecation("ATTR_FALSE_VALUE" /* ATTR_FALSE_VALUE */, parentComponent, key);
11279
+ value = type === 'number' ? 0 : '';
11280
+ needRemove = true;
11281
+ }
11232
11282
  }
11233
11283
  }
11234
- // some properties perform value validation and throw
11284
+ // some properties perform value validation and throw,
11285
+ // some properties has getter, no setter, will error in 'use strict'
11286
+ // eg. <select :type="null"></select> <select :willValidate="null"></select>
11235
11287
  try {
11236
11288
  el[key] = value;
11237
11289
  }
@@ -11241,31 +11293,35 @@ prevChildren, parentComponent, parentSuspense, unmountChildren) {
11241
11293
  `value ${value} is invalid.`, e);
11242
11294
  }
11243
11295
  }
11296
+ needRemove && el.removeAttribute(key);
11244
11297
  }
11245
11298
 
11246
11299
  // Async edge case fix requires storing an event listener's attach timestamp.
11247
- let _getNow = Date.now;
11248
- let skipTimestampCheck = false;
11249
- if (typeof window !== 'undefined') {
11250
- // Determine what event timestamp the browser is using. Annoyingly, the
11251
- // timestamp can either be hi-res (relative to page load) or low-res
11252
- // (relative to UNIX epoch), so in order to compare time we have to use the
11253
- // same timestamp type when saving the flush timestamp.
11254
- if (_getNow() > document.createEvent('Event').timeStamp) {
11255
- // if the low-res timestamp which is bigger than the event timestamp
11256
- // (which is evaluated AFTER) it means the event is using a hi-res timestamp,
11257
- // and we need to use the hi-res version for event listeners as well.
11258
- _getNow = () => performance.now();
11259
- }
11260
- // #3485: Firefox <= 53 has incorrect Event.timeStamp implementation
11261
- // and does not fire microtasks in between event propagation, so safe to exclude.
11262
- const ffMatch = navigator.userAgent.match(/firefox\/(\d+)/i);
11263
- skipTimestampCheck = !!(ffMatch && Number(ffMatch[1]) <= 53);
11264
- }
11300
+ const [_getNow, skipTimestampCheck] = /*#__PURE__*/ (() => {
11301
+ let _getNow = Date.now;
11302
+ let skipTimestampCheck = false;
11303
+ if (typeof window !== 'undefined') {
11304
+ // Determine what event timestamp the browser is using. Annoyingly, the
11305
+ // timestamp can either be hi-res (relative to page load) or low-res
11306
+ // (relative to UNIX epoch), so in order to compare time we have to use the
11307
+ // same timestamp type when saving the flush timestamp.
11308
+ if (Date.now() > document.createEvent('Event').timeStamp) {
11309
+ // if the low-res timestamp which is bigger than the event timestamp
11310
+ // (which is evaluated AFTER) it means the event is using a hi-res timestamp,
11311
+ // and we need to use the hi-res version for event listeners as well.
11312
+ _getNow = () => performance.now();
11313
+ }
11314
+ // #3485: Firefox <= 53 has incorrect Event.timeStamp implementation
11315
+ // and does not fire microtasks in between event propagation, so safe to exclude.
11316
+ const ffMatch = navigator.userAgent.match(/firefox\/(\d+)/i);
11317
+ skipTimestampCheck = !!(ffMatch && Number(ffMatch[1]) <= 53);
11318
+ }
11319
+ return [_getNow, skipTimestampCheck];
11320
+ })();
11265
11321
  // To avoid the overhead of repeatedly calling performance.now(), we cache
11266
11322
  // and use the same timestamp for all event listeners attached in the same tick.
11267
11323
  let cachedNow = 0;
11268
- const p = Promise.resolve();
11324
+ const p = /*#__PURE__*/ Promise.resolve();
11269
11325
  const reset = () => {
11270
11326
  cachedNow = 0;
11271
11327
  };
@@ -11390,13 +11446,13 @@ function shouldSetAsProp(el, key, value, isSVG) {
11390
11446
  }
11391
11447
  return false;
11392
11448
  }
11393
- // spellcheck and draggable are numerated attrs, however their
11394
- // corresponding DOM properties are actually booleans - this leads to
11395
- // setting it with a string "false" value leading it to be coerced to
11396
- // `true`, so we need to always treat them as attributes.
11449
+ // these are enumerated attrs, however their corresponding DOM properties
11450
+ // are actually booleans - this leads to setting it with a string "false"
11451
+ // value leading it to be coerced to `true`, so we need to always treat
11452
+ // them as attributes.
11397
11453
  // Note that `contentEditable` doesn't have this problem: its DOM
11398
11454
  // property is also enumerated string values.
11399
- if (key === 'spellcheck' || key === 'draggable') {
11455
+ if (key === 'spellcheck' || key === 'draggable' || key === 'translate') {
11400
11456
  return false;
11401
11457
  }
11402
11458
  // #1787, #2840 form property on form elements is readonly and must be set as
@@ -12538,7 +12594,7 @@ function setDisplay(el, value) {
12538
12594
  el.style.display = value ? el._vod : 'none';
12539
12595
  }
12540
12596
 
12541
- const rendererOptions = extend({ patchProp }, nodeOps);
12597
+ const rendererOptions = /*#__PURE__*/ extend({ patchProp }, nodeOps);
12542
12598
  // lazy create the renderer - this makes core renderer logic tree-shakable
12543
12599
  // in case the user only imports reactivity utilities from Vue.
12544
12600
  let renderer;