@vue/compat 3.5.1 → 3.5.2

package/dist/vue.cjs.js

@@ -1,5 +1,5 @@
 /**
-* @vue/compat v3.5.1
+* @vue/compat v3.5.2
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
@@ -738,9 +738,6 @@ function isDirty(sub) {
   return false;
 }
 function refreshComputed(computed) {
-  if (computed.flags & 2) {
-    return false;
-  }
   if (computed.flags & 4 && !(computed.flags & 16)) {
     return;
   }
@@ -761,7 +758,7 @@ function refreshComputed(computed) {
   shouldTrack = true;
   try {
     prepareDeps(computed);
-    const value = computed.fn();
+    const value = computed.fn(computed._value);
     if (dep.version === 0 || hasChanged(value, computed._value)) {
       computed._value = value;
       dep.version++;
@@ -870,7 +867,7 @@ class Dep {
     }
   }
   track(debugInfo) {
-    if (!activeSub || !shouldTrack) {
+    if (!activeSub || !shouldTrack || activeSub === this.computed) {
       return;
     }
     let link = this.activeLink;
@@ -1883,7 +1880,7 @@ function toValue(source) {
   return isFunction(source) ? source() : unref(source);
 }
 const shallowUnwrapHandlers = {
-  get: (target, key, receiver) => unref(Reflect.get(target, key, receiver)),
+  get: (target, key, receiver) => key === "__v_raw" ? target : unref(Reflect.get(target, key, receiver)),
   set: (target, key, value, receiver) => {
     const oldValue = target[key];
     if (isRef(oldValue) && !isRef(value)) {
@@ -2015,8 +2012,8 @@ class ComputedRefImpl {
    * @internal
    */
   notify() {
+    this.flags |= 16;
     if (activeSub !== this) {
-      this.flags |= 16;
       this.dep.notify();
     }
   }
@@ -2585,9 +2582,7 @@ function queueJob(job) {
     } else {
       queue.splice(findInsertionIndex(jobId), 0, job);
     }
-    if (!(job.flags & 4)) {
-      job.flags |= 1;
-    }
+    job.flags |= 1;
     queueFlush();
   }
 }
@@ -2603,9 +2598,7 @@ function queuePostFlushCb(cb) {
       activePostFlushCbs.splice(postFlushIndex + 1, 0, cb);
     } else if (!(cb.flags & 1)) {
       pendingPostFlushCbs.push(cb);
-      if (!(cb.flags & 4)) {
-        cb.flags |= 1;
-      }
+      cb.flags |= 1;
     }
   } else {
     pendingPostFlushCbs.push(...cb);
@@ -2627,6 +2620,9 @@ function flushPreFlushCbs(instance, seen, i = isFlushing ? flushIndex + 1 : 0) {
       }
       queue.splice(i, 1);
       i--;
+      if (cb.flags & 4) {
+        cb.flags &= ~1;
+      }
       cb();
       cb.flags &= ~1;
     }
@@ -2651,6 +2647,9 @@ function flushPostFlushCbs(seen) {
       if (checkRecursiveUpdates(seen, cb)) {
         continue;
       }
+      if (cb.flags & 4) {
+        cb.flags &= ~1;
+      }
       if (!(cb.flags & 8)) cb();
       cb.flags &= ~1;
     }
@@ -2673,6 +2672,9 @@ function flushJobs(seen) {
         if (check(job)) {
           continue;
         }
+        if (job.flags & 4) {
+          job.flags &= ~1;
+        }
         callWithErrorHandling(
           job,
           job.i,
@@ -2682,6 +2684,12 @@ function flushJobs(seen) {
       }
     }
   } finally {
+    for (; flushIndex < queue.length; flushIndex++) {
+      const job = queue[flushIndex];
+      if (job) {
+        job.flags &= ~1;
+      }
+    }
     flushIndex = 0;
     queue.length = 0;
     flushPostFlushCbs(seen);
@@ -3966,6 +3974,7 @@ const BaseTransitionImpl = {
             if (!(instance.job.flags & 8)) {
               instance.update();
             }
+            delete leavingHooks.afterLeave;
           };
           return emptyPlaceholder(child);
         } else if (mode === "in-out" && innerChild.type !== Comment) {
@@ -4246,6 +4255,34 @@ function markAsyncBoundary(instance) {
   instance.ids = [instance.ids[0] + instance.ids[2]++ + "-", 0, 0];
 }
 
+const knownTemplateRefs = /* @__PURE__ */ new WeakSet();
+function useTemplateRef(key) {
+  const i = getCurrentInstance();
+  const r = shallowRef(null);
+  if (i) {
+    const refs = i.refs === EMPTY_OBJ ? i.refs = {} : i.refs;
+    let desc;
+    if ((desc = Object.getOwnPropertyDescriptor(refs, key)) && !desc.configurable) {
+      warn$1(`useTemplateRef('${key}') already exists.`);
+    } else {
+      Object.defineProperty(refs, key, {
+        enumerable: true,
+        get: () => r.value,
+        set: (val) => r.value = val
+      });
+    }
+  } else {
+    warn$1(
+      `useTemplateRef() is called when there is no active component instance to be associated with.`
+    );
+  }
+  const ret = readonly(r) ;
+  {
+    knownTemplateRefs.add(ret);
+  }
+  return ret;
+}
+
 function setRef(rawRef, oldRawRef, parentSuspense, vnode, isUnmount = false) {
   if (isArray(rawRef)) {
     rawRef.forEach(
@@ -4274,7 +4311,13 @@ function setRef(rawRef, oldRawRef, parentSuspense, vnode, isUnmount = false) {
   const oldRef = oldRawRef && oldRawRef.r;
   const refs = owner.refs === EMPTY_OBJ ? owner.refs = {} : owner.refs;
   const setupState = owner.setupState;
-  const canSetSetupRef = setupState === EMPTY_OBJ ? () => false : (key) => hasOwn(setupState, key) && !(Object.getOwnPropertyDescriptor(refs, key) || EMPTY_OBJ).get;
+  const rawSetupState = toRaw(setupState);
+  const canSetSetupRef = setupState === EMPTY_OBJ ? () => false : (key) => {
+    if (knownTemplateRefs.has(rawSetupState[key])) {
+      return false;
+    }
+    return hasOwn(rawSetupState, key);
+  };
   if (oldRef != null && oldRef !== ref) {
     if (isString(oldRef)) {
       refs[oldRef] = null;
@@ -5331,7 +5374,7 @@ const KeepAliveImpl = {
     return () => {
       pendingCacheKey = null;
       if (!slots.default) {
-        return null;
+        return current = null;
       }
       const children = slots.default();
       const rawVNode = children[0];
@@ -7106,7 +7149,7 @@ function createCompatVue$1(createApp, createSingletonApp) {
       return vm;
     }
   }
-  Vue.version = `2.6.14-compat:${"3.5.1"}`;
+  Vue.version = `2.6.14-compat:${"3.5.2"}`;
   Vue.config = singletonApp.config;
   Vue.use = (plugin, ...options) => {
     if (plugin && isFunction(plugin.install)) {
@@ -10219,7 +10262,8 @@ function renderComponentRoot(instance) {
     data,
     setupState,
     ctx,
-    inheritAttrs
+    inheritAttrs,
+    isMounted
   } = instance;
   const prev = setCurrentRenderingInstance(instance);
   let result;
@@ -10360,7 +10404,7 @@ function renderComponentRoot(instance) {
         `Component inside <Transition> renders non-element root node that cannot be animated.`
       );
     }
-    root.transition = vnode.transition;
+    root.transition = isMounted ? vnode.component.subTree.transition : vnode.transition;
   }
   if (setRoot) {
     setRoot(root);
@@ -10854,7 +10898,7 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
           };
         }
         if (activeBranch) {
-          if (parentNode(activeBranch.el) !== suspense.hiddenContainer) {
+          if (parentNode(activeBranch.el) === container2) {
             anchor = next(activeBranch);
           }
           unmount(activeBranch, parentComponent2, suspense, true);
@@ -11994,29 +12038,6 @@ const computed = (getterOrOptions, debugOptions) => {
   return c;
 };
 
-function useTemplateRef(key) {
-  const i = getCurrentInstance();
-  const r = shallowRef(null);
-  if (i) {
-    const refs = i.refs === EMPTY_OBJ ? i.refs = {} : i.refs;
-    let desc;
-    if ((desc = Object.getOwnPropertyDescriptor(refs, key)) && !desc.configurable) {
-      warn$1(`useTemplateRef('${key}') already exists.`);
-    } else {
-      Object.defineProperty(refs, key, {
-        enumerable: true,
-        get: () => r.value,
-        set: (val) => r.value = val
-      });
-    }
-  } else {
-    warn$1(
-      `useTemplateRef() is called when there is no active component instance to be associated with.`
-    );
-  }
-  return readonly(r) ;
-}
-
 function h(type, propsOrChildren, children) {
   const l = arguments.length;
   if (l === 2) {
@@ -12242,7 +12263,7 @@ function isMemoSame(cached, memo) {
   return true;
 }
 
-const version = "3.5.1";
+const version = "3.5.2";
 const warn = warn$1 ;
 const ErrorTypeStrings = ErrorTypeStrings$1 ;
 const devtools = devtools$1 ;
@@ -16395,7 +16416,7 @@ const tokenizer = new Tokenizer(stack, {
         rawName: raw,
         exp: void 0,
         arg: void 0,
-        modifiers: raw === "." ? ["prop"] : [],
+        modifiers: raw === "." ? [createSimpleExpression("prop")] : [],
         loc: getLoc(start)
       };
       if (name === "pre") {
@@ -16438,7 +16459,8 @@ const tokenizer = new Tokenizer(stack, {
         setLocEnd(arg.loc, end);
       }
     } else {
-      currentProp.modifiers.push(mod);
+      const exp = createSimpleExpression(mod, true, getLoc(start, end));
+      currentProp.modifiers.push(exp);
     }
   },
   onattribdata(start, end) {
@@ -16504,7 +16526,9 @@ const tokenizer = new Tokenizer(stack, {
             currentProp.forParseResult = parseForExpression(currentProp.exp);
           }
           let syncIndex = -1;
-          if (currentProp.name === "bind" && (syncIndex = currentProp.modifiers.indexOf("sync")) > -1 && checkCompatEnabled(
+          if (currentProp.name === "bind" && (syncIndex = currentProp.modifiers.findIndex(
+            (mod) => mod.content === "sync"
+          )) > -1 && checkCompatEnabled(
             "COMPILER_V_BIND_SYNC",
             currentOptions,
             currentProp.loc,
@@ -18896,7 +18920,7 @@ const transformBind = (dir, _node, context) => {
   } else if (!arg.isStatic) {
     arg.content = `${arg.content} || ""`;
   }
-  if (modifiers.includes("camel")) {
+  if (modifiers.some((mod) => mod.content === "camel")) {
     if (arg.type === 4) {
       if (arg.isStatic) {
         arg.content = camelize(arg.content);
@@ -18909,10 +18933,10 @@ const transformBind = (dir, _node, context) => {
     }
   }
   if (!context.inSSR) {
-    if (modifiers.includes("prop")) {
+    if (modifiers.some((mod) => mod.content === "prop")) {
       injectPrefix(arg, ".");
     }
-    if (modifiers.includes("attr")) {
+    if (modifiers.some((mod) => mod.content === "attr")) {
       injectPrefix(arg, "^");
     }
   }
@@ -19853,7 +19877,7 @@ function buildProps(node, context, props = node.props, isComponent, isDynamicCom
         }
         continue;
       }
-      if (isVBind && modifiers.includes("prop")) {
+      if (isVBind && modifiers.some((mod) => mod.content === "prop")) {
         patchFlag |= 32;
       }
       const directiveTransform = context.directiveTransforms[name];
@@ -20419,7 +20443,7 @@ const transformModel$1 = (dir, node, context) => {
     props[1].value = context.cache(props[1].value);
   }
   if (dir.modifiers.length && node.tagType === 1) {
-    const modifiers = dir.modifiers.map((m) => (isSimpleIdentifier(m) ? m : JSON.stringify(m)) + `: true`).join(`, `);
+    const modifiers = dir.modifiers.map((m) => m.content).map((m) => (isSimpleIdentifier(m) ? m : JSON.stringify(m)) + `: true`).join(`, `);
     const modifiersKey = arg ? isStaticExp(arg) ? `${arg.content}Modifiers` : createCompoundExpression([arg, ' + "Modifiers"']) : `modelModifiers`;
     props.push(
       createObjectProperty(
@@ -20957,7 +20981,7 @@ const resolveModifiers = (key, modifiers, context, loc) => {
   const nonKeyModifiers = [];
   const eventOptionModifiers = [];
   for (let i = 0; i < modifiers.length; i++) {
-    const modifier = modifiers[i];
+    const modifier = modifiers[i].content;
     if (modifier === "native" && checkCompatEnabled(
       "COMPILER_V_ON_NATIVE",
       context,

package/dist/vue.cjs.prod.js

@@ -1,5 +1,5 @@
 /**
-* @vue/compat v3.5.1
+* @vue/compat v3.5.2
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
@@ -644,9 +644,6 @@ function isDirty(sub) {
   return false;
 }
 function refreshComputed(computed) {
-  if (computed.flags & 2) {
-    return false;
-  }
   if (computed.flags & 4 && !(computed.flags & 16)) {
     return;
   }
@@ -667,7 +664,7 @@ function refreshComputed(computed) {
   shouldTrack = true;
   try {
     prepareDeps(computed);
-    const value = computed.fn();
+    const value = computed.fn(computed._value);
     if (dep.version === 0 || hasChanged(value, computed._value)) {
       computed._value = value;
       dep.version++;
@@ -773,7 +770,7 @@ class Dep {
     this.subs = void 0;
   }
   track(debugInfo) {
-    if (!activeSub || !shouldTrack) {
+    if (!activeSub || !shouldTrack || activeSub === this.computed) {
       return;
     }
     let link = this.activeLink;
@@ -1694,7 +1691,7 @@ function toValue(source) {
   return isFunction(source) ? source() : unref(source);
 }
 const shallowUnwrapHandlers = {
-  get: (target, key, receiver) => unref(Reflect.get(target, key, receiver)),
+  get: (target, key, receiver) => key === "__v_raw" ? target : unref(Reflect.get(target, key, receiver)),
   set: (target, key, value, receiver) => {
     const oldValue = target[key];
     if (isRef(oldValue) && !isRef(value)) {
@@ -1823,8 +1820,8 @@ class ComputedRefImpl {
    * @internal
    */
   notify() {
+    this.flags |= 16;
     if (activeSub !== this) {
-      this.flags |= 16;
       this.dep.notify();
     }
   }
@@ -2232,9 +2229,7 @@ function queueJob(job) {
     } else {
       queue.splice(findInsertionIndex(jobId), 0, job);
     }
-    if (!(job.flags & 4)) {
-      job.flags |= 1;
-    }
+    job.flags |= 1;
     queueFlush();
   }
 }
@@ -2250,9 +2245,7 @@ function queuePostFlushCb(cb) {
       activePostFlushCbs.splice(postFlushIndex + 1, 0, cb);
     } else if (!(cb.flags & 1)) {
       pendingPostFlushCbs.push(cb);
-      if (!(cb.flags & 4)) {
-        cb.flags |= 1;
-      }
+      cb.flags |= 1;
     }
   } else {
     pendingPostFlushCbs.push(...cb);
@@ -2268,6 +2261,9 @@ function flushPreFlushCbs(instance, seen, i = isFlushing ? flushIndex + 1 : 0) {
       }
       queue.splice(i, 1);
       i--;
+      if (cb.flags & 4) {
+        cb.flags &= ~1;
+      }
       cb();
       cb.flags &= ~1;
     }
@@ -2286,6 +2282,9 @@ function flushPostFlushCbs(seen) {
     activePostFlushCbs = deduped;
     for (postFlushIndex = 0; postFlushIndex < activePostFlushCbs.length; postFlushIndex++) {
       const cb = activePostFlushCbs[postFlushIndex];
+      if (cb.flags & 4) {
+        cb.flags &= ~1;
+      }
       if (!(cb.flags & 8)) cb();
       cb.flags &= ~1;
     }
@@ -2302,6 +2301,9 @@ function flushJobs(seen) {
       const job = queue[flushIndex];
       if (job && !(job.flags & 8)) {
         if (false) ;
+        if (job.flags & 4) {
+          job.flags &= ~1;
+        }
         callWithErrorHandling(
           job,
           job.i,
@@ -2311,6 +2313,12 @@ function flushJobs(seen) {
       }
     }
   } finally {
+    for (; flushIndex < queue.length; flushIndex++) {
+      const job = queue[flushIndex];
+      if (job) {
+        job.flags &= ~1;
+      }
+    }
     flushIndex = 0;
     queue.length = 0;
     flushPostFlushCbs();
@@ -3054,6 +3062,7 @@ const BaseTransitionImpl = {
             if (!(instance.job.flags & 8)) {
               instance.update();
             }
+            delete leavingHooks.afterLeave;
           };
           return emptyPlaceholder(child);
         } else if (mode === "in-out" && innerChild.type !== Comment) {
@@ -3320,6 +3329,23 @@ function markAsyncBoundary(instance) {
   instance.ids = [instance.ids[0] + instance.ids[2]++ + "-", 0, 0];
 }
 
+function useTemplateRef(key) {
+  const i = getCurrentInstance();
+  const r = shallowRef(null);
+  if (i) {
+    const refs = i.refs === EMPTY_OBJ ? i.refs = {} : i.refs;
+    {
+      Object.defineProperty(refs, key, {
+        enumerable: true,
+        get: () => r.value,
+        set: (val) => r.value = val
+      });
+    }
+  }
+  const ret = r;
+  return ret;
+}
+
 function setRef(rawRef, oldRawRef, parentSuspense, vnode, isUnmount = false) {
   if (isArray(rawRef)) {
     rawRef.forEach(
@@ -3342,7 +3368,10 @@ function setRef(rawRef, oldRawRef, parentSuspense, vnode, isUnmount = false) {
   const oldRef = oldRawRef && oldRawRef.r;
   const refs = owner.refs === EMPTY_OBJ ? owner.refs = {} : owner.refs;
   const setupState = owner.setupState;
-  const canSetSetupRef = setupState === EMPTY_OBJ ? () => false : (key) => hasOwn(setupState, key) && !(Object.getOwnPropertyDescriptor(refs, key) || EMPTY_OBJ).get;
+  const rawSetupState = toRaw(setupState);
+  const canSetSetupRef = setupState === EMPTY_OBJ ? () => false : (key) => {
+    return hasOwn(rawSetupState, key);
+  };
   if (oldRef != null && oldRef !== ref) {
     if (isString(oldRef)) {
       refs[oldRef] = null;
@@ -4210,7 +4239,7 @@ const KeepAliveImpl = {
     return () => {
       pendingCacheKey = null;
       if (!slots.default) {
-        return null;
+        return current = null;
       }
       const children = slots.default();
       const rawVNode = children[0];
@@ -5706,7 +5735,7 @@ function createCompatVue$1(createApp, createSingletonApp) {
       return vm;
     }
   }
-  Vue.version = `2.6.14-compat:${"3.5.1"}`;
+  Vue.version = `2.6.14-compat:${"3.5.2"}`;
   Vue.config = singletonApp.config;
   Vue.use = (plugin, ...options) => {
     if (plugin && isFunction(plugin.install)) {
@@ -8298,7 +8327,8 @@ function renderComponentRoot(instance) {
     data,
     setupState,
     ctx,
-    inheritAttrs
+    inheritAttrs,
+    isMounted
   } = instance;
   const prev = setCurrentRenderingInstance(instance);
   let result;
@@ -8389,7 +8419,7 @@ function renderComponentRoot(instance) {
     root.dirs = root.dirs ? root.dirs.concat(vnode.dirs) : vnode.dirs;
   }
   if (vnode.transition) {
-    root.transition = vnode.transition;
+    root.transition = isMounted ? vnode.component.subTree.transition : vnode.transition;
   }
   {
     result = root;
@@ -8827,7 +8857,7 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
           };
         }
         if (activeBranch) {
-          if (parentNode(activeBranch.el) !== suspense.hiddenContainer) {
+          if (parentNode(activeBranch.el) === container2) {
             anchor = next(activeBranch);
           }
           unmount(activeBranch, parentComponent2, suspense, true);
@@ -9773,22 +9803,6 @@ const computed = (getterOrOptions, debugOptions) => {
   return c;
 };
 
-function useTemplateRef(key) {
-  const i = getCurrentInstance();
-  const r = shallowRef(null);
-  if (i) {
-    const refs = i.refs === EMPTY_OBJ ? i.refs = {} : i.refs;
-    {
-      Object.defineProperty(refs, key, {
-        enumerable: true,
-        get: () => r.value,
-        set: (val) => r.value = val
-      });
-    }
-  }
-  return r;
-}
-
 function h(type, propsOrChildren, children) {
   const l = arguments.length;
   if (l === 2) {
@@ -9842,7 +9856,7 @@ function isMemoSame(cached, memo) {
   return true;
 }
 
-const version = "3.5.1";
+const version = "3.5.2";
 const warn$1 = NOOP;
 const ErrorTypeStrings = ErrorTypeStrings$1 ;
 const devtools = void 0;
@@ -13766,7 +13780,7 @@ const tokenizer = new Tokenizer(stack, {
         rawName: raw,
         exp: void 0,
         arg: void 0,
-        modifiers: raw === "." ? ["prop"] : [],
+        modifiers: raw === "." ? [createSimpleExpression("prop")] : [],
         loc: getLoc(start)
       };
       if (name === "pre") {
@@ -13809,7 +13823,8 @@ const tokenizer = new Tokenizer(stack, {
         setLocEnd(arg.loc, end);
       }
     } else {
-      currentProp.modifiers.push(mod);
+      const exp = createSimpleExpression(mod, true, getLoc(start, end));
+      currentProp.modifiers.push(exp);
     }
   },
   onattribdata(start, end) {
@@ -13875,7 +13890,9 @@ const tokenizer = new Tokenizer(stack, {
             currentProp.forParseResult = parseForExpression(currentProp.exp);
           }
           let syncIndex = -1;
-          if (currentProp.name === "bind" && (syncIndex = currentProp.modifiers.indexOf("sync")) > -1 && checkCompatEnabled(
+          if (currentProp.name === "bind" && (syncIndex = currentProp.modifiers.findIndex(
+            (mod) => mod.content === "sync"
+          )) > -1 && checkCompatEnabled(
             "COMPILER_V_BIND_SYNC",
             currentOptions,
             currentProp.loc,
@@ -16182,7 +16199,7 @@ const transformBind = (dir, _node, context) => {
   } else if (!arg.isStatic) {
     arg.content = `${arg.content} || ""`;
   }
-  if (modifiers.includes("camel")) {
+  if (modifiers.some((mod) => mod.content === "camel")) {
     if (arg.type === 4) {
       if (arg.isStatic) {
         arg.content = camelize(arg.content);
@@ -16195,10 +16212,10 @@ const transformBind = (dir, _node, context) => {
     }
   }
   if (!context.inSSR) {
-    if (modifiers.includes("prop")) {
+    if (modifiers.some((mod) => mod.content === "prop")) {
       injectPrefix(arg, ".");
     }
-    if (modifiers.includes("attr")) {
+    if (modifiers.some((mod) => mod.content === "attr")) {
       injectPrefix(arg, "^");
     }
   }
@@ -17109,7 +17126,7 @@ function buildProps(node, context, props = node.props, isComponent, isDynamicCom
         }
         continue;
       }
-      if (isVBind && modifiers.includes("prop")) {
+      if (isVBind && modifiers.some((mod) => mod.content === "prop")) {
         patchFlag |= 32;
       }
       const directiveTransform = context.directiveTransforms[name];
@@ -17672,7 +17689,7 @@ const transformModel$1 = (dir, node, context) => {
     props[1].value = context.cache(props[1].value);
   }
   if (dir.modifiers.length && node.tagType === 1) {
-    const modifiers = dir.modifiers.map((m) => (isSimpleIdentifier(m) ? m : JSON.stringify(m)) + `: true`).join(`, `);
+    const modifiers = dir.modifiers.map((m) => m.content).map((m) => (isSimpleIdentifier(m) ? m : JSON.stringify(m)) + `: true`).join(`, `);
     const modifiersKey = arg ? isStaticExp(arg) ? `${arg.content}Modifiers` : createCompoundExpression([arg, ' + "Modifiers"']) : `modelModifiers`;
     props.push(
       createObjectProperty(
@@ -18187,7 +18204,7 @@ const resolveModifiers = (key, modifiers, context, loc) => {
   const nonKeyModifiers = [];
   const eventOptionModifiers = [];
   for (let i = 0; i < modifiers.length; i++) {
-    const modifier = modifiers[i];
+    const modifier = modifiers[i].content;
     if (modifier === "native" && checkCompatEnabled(
       "COMPILER_V_ON_NATIVE",
       context)) {