From dd59863bcb26464e32669c8e85a5b450d17f5789 Mon Sep 17 00:00:00 2001
From: skirtle <65301168+skirtles-code@users.noreply.github.com>
Date: Fri, 16 Dec 2022 16:42:51 +0000
Subject: [PATCH 1/3] dx(compiler-core): warn for directive shorthands without
 an argument

---
 .../__snapshots__/parse.spec.ts.snap          | 373 ++++++++++++++++++
 .../compiler-core/__tests__/parse.spec.ts     |  61 ++-
 packages/compiler-core/src/errors.ts          |   2 +
 packages/compiler-core/src/parse.ts           |  20 +-
 4 files changed, 447 insertions(+), 9 deletions(-)

diff --git a/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap b/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
index 8a12c8c39..a42326a35 100644
--- a/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
+++ b/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
@@ -5832,6 +5832,379 @@ exports[`compiler: parse Errors UNEXPECTED_SOLIDUS_IN_TAG <template><div a/b></d
 }
 `;
 
+exports[`compiler: parse Errors X_DIRECTIVE_SHORTHAND_NO_ARGUMENT <div #="obj" /> 1`] = `
+{
+  "cached": 0,
+  "children": [
+    {
+      "children": [],
+      "codegenNode": undefined,
+      "isSelfClosing": true,
+      "loc": {
+        "end": {
+          "column": 16,
+          "line": 1,
+          "offset": 15,
+        },
+        "source": "<div #="obj" />",
+        "start": {
+          "column": 1,
+          "line": 1,
+          "offset": 0,
+        },
+      },
+      "ns": 0,
+      "props": [
+        {
+          "arg": undefined,
+          "exp": {
+            "constType": 0,
+            "content": "obj",
+            "isStatic": false,
+            "loc": {
+              "end": {
+                "column": 12,
+                "line": 1,
+                "offset": 11,
+              },
+              "source": "obj",
+              "start": {
+                "column": 9,
+                "line": 1,
+                "offset": 8,
+              },
+            },
+            "type": 4,
+          },
+          "loc": {
+            "end": {
+              "column": 13,
+              "line": 1,
+              "offset": 12,
+            },
+            "source": "#="obj"",
+            "start": {
+              "column": 6,
+              "line": 1,
+              "offset": 5,
+            },
+          },
+          "modifiers": [
+            "",
+          ],
+          "name": "slot",
+          "type": 7,
+        },
+      ],
+      "tag": "div",
+      "tagType": 0,
+      "type": 1,
+    },
+  ],
+  "codegenNode": undefined,
+  "components": [],
+  "directives": [],
+  "helpers": Set {},
+  "hoists": [],
+  "imports": [],
+  "loc": {
+    "end": {
+      "column": 16,
+      "line": 1,
+      "offset": 15,
+    },
+    "source": "<div #="obj" />",
+    "start": {
+      "column": 1,
+      "line": 1,
+      "offset": 0,
+    },
+  },
+  "temps": 0,
+  "type": 0,
+}
+`;
+
+exports[`compiler: parse Errors X_DIRECTIVE_SHORTHAND_NO_ARGUMENT <div .="obj" /> 1`] = `
+{
+  "cached": 0,
+  "children": [
+    {
+      "children": [],
+      "codegenNode": undefined,
+      "isSelfClosing": true,
+      "loc": {
+        "end": {
+          "column": 16,
+          "line": 1,
+          "offset": 15,
+        },
+        "source": "<div .="obj" />",
+        "start": {
+          "column": 1,
+          "line": 1,
+          "offset": 0,
+        },
+      },
+      "ns": 0,
+      "props": [
+        {
+          "arg": undefined,
+          "exp": {
+            "constType": 0,
+            "content": "obj",
+            "isStatic": false,
+            "loc": {
+              "end": {
+                "column": 12,
+                "line": 1,
+                "offset": 11,
+              },
+              "source": "obj",
+              "start": {
+                "column": 9,
+                "line": 1,
+                "offset": 8,
+              },
+            },
+            "type": 4,
+          },
+          "loc": {
+            "end": {
+              "column": 13,
+              "line": 1,
+              "offset": 12,
+            },
+            "source": ".="obj"",
+            "start": {
+              "column": 6,
+              "line": 1,
+              "offset": 5,
+            },
+          },
+          "modifiers": [
+            "",
+            "prop",
+          ],
+          "name": "bind",
+          "type": 7,
+        },
+      ],
+      "tag": "div",
+      "tagType": 0,
+      "type": 1,
+    },
+  ],
+  "codegenNode": undefined,
+  "components": [],
+  "directives": [],
+  "helpers": Set {},
+  "hoists": [],
+  "imports": [],
+  "loc": {
+    "end": {
+      "column": 16,
+      "line": 1,
+      "offset": 15,
+    },
+    "source": "<div .="obj" />",
+    "start": {
+      "column": 1,
+      "line": 1,
+      "offset": 0,
+    },
+  },
+  "temps": 0,
+  "type": 0,
+}
+`;
+
+exports[`compiler: parse Errors X_DIRECTIVE_SHORTHAND_NO_ARGUMENT <div :="obj" /> 1`] = `
+{
+  "cached": 0,
+  "children": [
+    {
+      "children": [],
+      "codegenNode": undefined,
+      "isSelfClosing": true,
+      "loc": {
+        "end": {
+          "column": 16,
+          "line": 1,
+          "offset": 15,
+        },
+        "source": "<div :="obj" />",
+        "start": {
+          "column": 1,
+          "line": 1,
+          "offset": 0,
+        },
+      },
+      "ns": 0,
+      "props": [
+        {
+          "arg": undefined,
+          "exp": {
+            "constType": 0,
+            "content": "obj",
+            "isStatic": false,
+            "loc": {
+              "end": {
+                "column": 12,
+                "line": 1,
+                "offset": 11,
+              },
+              "source": "obj",
+              "start": {
+                "column": 9,
+                "line": 1,
+                "offset": 8,
+              },
+            },
+            "type": 4,
+          },
+          "loc": {
+            "end": {
+              "column": 13,
+              "line": 1,
+              "offset": 12,
+            },
+            "source": ":="obj"",
+            "start": {
+              "column": 6,
+              "line": 1,
+              "offset": 5,
+            },
+          },
+          "modifiers": [
+            "",
+          ],
+          "name": "bind",
+          "type": 7,
+        },
+      ],
+      "tag": "div",
+      "tagType": 0,
+      "type": 1,
+    },
+  ],
+  "codegenNode": undefined,
+  "components": [],
+  "directives": [],
+  "helpers": Set {},
+  "hoists": [],
+  "imports": [],
+  "loc": {
+    "end": {
+      "column": 16,
+      "line": 1,
+      "offset": 15,
+    },
+    "source": "<div :="obj" />",
+    "start": {
+      "column": 1,
+      "line": 1,
+      "offset": 0,
+    },
+  },
+  "temps": 0,
+  "type": 0,
+}
+`;
+
+exports[`compiler: parse Errors X_DIRECTIVE_SHORTHAND_NO_ARGUMENT <div @="obj" /> 1`] = `
+{
+  "cached": 0,
+  "children": [
+    {
+      "children": [],
+      "codegenNode": undefined,
+      "isSelfClosing": true,
+      "loc": {
+        "end": {
+          "column": 16,
+          "line": 1,
+          "offset": 15,
+        },
+        "source": "<div @="obj" />",
+        "start": {
+          "column": 1,
+          "line": 1,
+          "offset": 0,
+        },
+      },
+      "ns": 0,
+      "props": [
+        {
+          "arg": undefined,
+          "exp": {
+            "constType": 0,
+            "content": "obj",
+            "isStatic": false,
+            "loc": {
+              "end": {
+                "column": 12,
+                "line": 1,
+                "offset": 11,
+              },
+              "source": "obj",
+              "start": {
+                "column": 9,
+                "line": 1,
+                "offset": 8,
+              },
+            },
+            "type": 4,
+          },
+          "loc": {
+            "end": {
+              "column": 13,
+              "line": 1,
+              "offset": 12,
+            },
+            "source": "@="obj"",
+            "start": {
+              "column": 6,
+              "line": 1,
+              "offset": 5,
+            },
+          },
+          "modifiers": [
+            "",
+          ],
+          "name": "on",
+          "type": 7,
+        },
+      ],
+      "tag": "div",
+      "tagType": 0,
+      "type": 1,
+    },
+  ],
+  "codegenNode": undefined,
+  "components": [],
+  "directives": [],
+  "helpers": Set {},
+  "hoists": [],
+  "imports": [],
+  "loc": {
+    "end": {
+      "column": 16,
+      "line": 1,
+      "offset": 15,
+    },
+    "source": "<div @="obj" />",
+    "start": {
+      "column": 1,
+      "line": 1,
+      "offset": 0,
+    },
+  },
+  "temps": 0,
+  "type": 0,
+}
+`;
+
 exports[`compiler: parse Errors X_INVALID_END_TAG <svg><![CDATA[</div>]]></svg> 1`] = `
 {
   "cached": 0,
diff --git a/packages/compiler-core/__tests__/parse.spec.ts b/packages/compiler-core/__tests__/parse.spec.ts
index 8979e8fb0..f2a4dc793 100644
--- a/packages/compiler-core/__tests__/parse.spec.ts
+++ b/packages/compiler-core/__tests__/parse.spec.ts
@@ -1990,7 +1990,7 @@ foo
       })
       expect(ast.children[2].type).toBe(NodeTypes.INTERPOLATION)
     })
-    
+
     it('should NOT remove whitespaces w/o newline between elements', () => {
       const ast = parse(`<div/> <div/> <div/>`)
       expect(ast.children.length).toBe(5)
@@ -2131,7 +2131,8 @@ foo
     const patterns: {
       [key: string]: Array<{
         code: string
-        errors: Array<{ type: ErrorCodes; loc: Position }>
+        errors?: Array<{ type: ErrorCodes; loc: Position }>
+        warnings?: Array<{ type: ErrorCodes; loc: Position }>
         options?: Partial<ParserOptions>
       }>
     } = {
@@ -3022,19 +3023,60 @@ foo
             }
           ]
         }
+      ],
+      X_DIRECTIVE_SHORTHAND_NO_ARGUMENT: [
+        {
+          code: `<div :="obj" />`,
+          warnings: [
+            {
+              type: ErrorCodes.X_DIRECTIVE_SHORTHAND_NO_ARGUMENT,
+              loc: { offset: 5, line: 1, column: 6 }
+            }
+          ]
+        },
+        {
+          code: `<div .="obj" />`,
+          warnings: [
+            {
+              type: ErrorCodes.X_DIRECTIVE_SHORTHAND_NO_ARGUMENT,
+              loc: { offset: 5, line: 1, column: 6 }
+            }
+          ]
+        },
+        {
+          code: `<div @="obj" />`,
+          warnings: [
+            {
+              type: ErrorCodes.X_DIRECTIVE_SHORTHAND_NO_ARGUMENT,
+              loc: { offset: 5, line: 1, column: 6 }
+            }
+          ]
+        },
+        {
+          code: `<div #="obj" />`,
+          warnings: [
+            {
+              type: ErrorCodes.X_DIRECTIVE_SHORTHAND_NO_ARGUMENT,
+              loc: { offset: 5, line: 1, column: 6 }
+            }
+          ]
+        }
       ]
     }
 
     for (const key of Object.keys(patterns) as (keyof typeof patterns)[]) {
       describe(key, () => {
-        for (const { code, errors, options } of patterns[key]) {
+        for (const { code, errors = [], warnings = [], options } of patterns[
+          key
+        ]) {
           test(
             code.replace(
               /[\r\n]/g,
               c => `\\x0${c.codePointAt(0)!.toString(16)};`
             ),
             () => {
-              const spy = jest.fn()
+              const errorSpy = jest.fn()
+              const warnSpy = jest.fn()
               const ast = baseParse(code, {
                 getNamespace: (tag, parent) => {
                   const ns = parent ? parent.ns : Namespaces.HTML
@@ -3055,15 +3097,22 @@ foo
                   return TextModes.DATA
                 },
                 ...options,
-                onError: spy
+                onError: errorSpy,
+                onWarn: warnSpy
               })
 
               expect(
-                spy.mock.calls.map(([err]) => ({
+                errorSpy.mock.calls.map(([err]) => ({
                   type: err.code,
                   loc: err.loc.start
                 }))
               ).toMatchObject(errors)
+              expect(
+                warnSpy.mock.calls.map(([err]) => ({
+                  type: err.code,
+                  loc: err.loc.start
+                }))
+              ).toMatchObject(warnings)
               expect(ast).toMatchSnapshot()
             }
           )
diff --git a/packages/compiler-core/src/errors.ts b/packages/compiler-core/src/errors.ts
index db7d0eb39..cbe4adc4b 100644
--- a/packages/compiler-core/src/errors.ts
+++ b/packages/compiler-core/src/errors.ts
@@ -90,6 +90,7 @@ export const enum ErrorCodes {
   X_V_MODEL_ON_PROPS,
   X_INVALID_EXPRESSION,
   X_KEEP_ALIVE_INVALID_CHILDREN,
+  X_DIRECTIVE_SHORTHAND_NO_ARGUMENT,
 
   // generic errors
   X_PREFIX_ID_NOT_SUPPORTED,
@@ -172,6 +173,7 @@ export const errorMessages: Record<ErrorCodes, string> = {
   [ErrorCodes.X_V_MODEL_ON_PROPS]: `v-model cannot be used on a prop, because local prop bindings are not writable.\nUse a v-bind binding combined with a v-on listener that emits update:x event instead.`,
   [ErrorCodes.X_INVALID_EXPRESSION]: `Error parsing JavaScript expression: `,
   [ErrorCodes.X_KEEP_ALIVE_INVALID_CHILDREN]: `<KeepAlive> expects exactly one child component.`,
+  [ErrorCodes.X_DIRECTIVE_SHORTHAND_NO_ARGUMENT]: `Directive shorthand without an argument: `,
 
   // generic errors
   [ErrorCodes.X_PREFIX_ID_NOT_SUPPORTED]: `"prefixIdentifiers" option is not supported in this build of compiler.`,
diff --git a/packages/compiler-core/src/parse.ts b/packages/compiler-core/src/parse.ts
index 642f3edaf..5ab9c69d5 100644
--- a/packages/compiler-core/src/parse.ts
+++ b/packages/compiler-core/src/parse.ts
@@ -273,10 +273,10 @@ function parseChildren(
               (shouldCondense &&
                 ((prev.type === NodeTypes.COMMENT &&
                   next.type === NodeTypes.COMMENT) ||
-                  (prev.type === NodeTypes.COMMENT && 
-                  next.type === NodeTypes.ELEMENT) ||
+                  (prev.type === NodeTypes.COMMENT &&
+                    next.type === NodeTypes.ELEMENT) ||
                   (prev.type === NodeTypes.ELEMENT &&
-                  next.type === NodeTypes.COMMENT) ||
+                    next.type === NodeTypes.COMMENT) ||
                   (prev.type === NodeTypes.ELEMENT &&
                     next.type === NodeTypes.ELEMENT &&
                     /[\r\n]/.test(node.content))))
@@ -813,6 +813,20 @@ function parseAttribute(
         : startsWith(name, '@')
         ? 'on'
         : 'slot')
+
+    if (__DEV__) {
+      if (name.length === 1) {
+        context.options.onWarn(
+          createCompilerError(
+            ErrorCodes.X_DIRECTIVE_SHORTHAND_NO_ARGUMENT,
+            loc,
+            undefined,
+            `the directive shorthand '${name}' cannot be used without an argument. Use v-${dirName} instead or provide an argument.`
+          )
+        )
+      }
+    }
+
     let arg: ExpressionNode | undefined
 
     if (match[2]) {

From 304e893f56dd02431c59b6732b1aa579b7ac196a Mon Sep 17 00:00:00 2001
From: skirtle <65301168+skirtles-code@users.noreply.github.com>
Date: Tue, 7 Feb 2023 21:48:14 +0000
Subject: [PATCH 2/3] fix: update enums to match __EXTEND_POINT__

---
 packages/compiler-dom/src/errors.ts | 2 +-
 packages/compiler-ssr/src/errors.ts | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/compiler-dom/src/errors.ts b/packages/compiler-dom/src/errors.ts
index 620d62da8..d129dc08d 100644
--- a/packages/compiler-dom/src/errors.ts
+++ b/packages/compiler-dom/src/errors.ts
@@ -21,7 +21,7 @@ export function createDOMCompilerError(
 }
 
 export const enum DOMErrorCodes {
-  X_V_HTML_NO_EXPRESSION = 51 /* ErrorCodes.__EXTEND_POINT__ */,
+  X_V_HTML_NO_EXPRESSION = 52 /* ErrorCodes.__EXTEND_POINT__ */,
   X_V_HTML_WITH_CHILDREN,
   X_V_TEXT_NO_EXPRESSION,
   X_V_TEXT_WITH_CHILDREN,
diff --git a/packages/compiler-ssr/src/errors.ts b/packages/compiler-ssr/src/errors.ts
index 67622c1be..060b03884 100644
--- a/packages/compiler-ssr/src/errors.ts
+++ b/packages/compiler-ssr/src/errors.ts
@@ -17,7 +17,7 @@ export function createSSRCompilerError(
 }
 
 export const enum SSRErrorCodes {
-  X_SSR_UNSAFE_ATTR_NAME = 62 /* DOMErrorCodes.__EXTEND_POINT__ */,
+  X_SSR_UNSAFE_ATTR_NAME = 63 /* DOMErrorCodes.__EXTEND_POINT__ */,
   X_SSR_NO_TELEPORT_TARGET,
   X_SSR_INVALID_AST_NODE
 }

From 63f96a2aceddfad6469d0ba38ec665995102c614 Mon Sep 17 00:00:00 2001
From: skirtle <65301168+skirtles-code@users.noreply.github.com>
Date: Sun, 31 Dec 2023 01:36:38 +0000
Subject: [PATCH 3/3] Port changes to the new template parser

---
 .../__snapshots__/parse.spec.ts.snap          | 21 +++++++++---------
 .../compiler-core/__tests__/parse.spec.ts     |  3 +++
 packages/compiler-core/src/parser.ts          | 22 ++++++++++++++++++-
 3 files changed, 35 insertions(+), 11 deletions(-)

diff --git a/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap b/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
index 5823d99ab..ae8eed7a3 100644
--- a/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
+++ b/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
@@ -3905,10 +3905,9 @@ exports[`compiler: parse > Errors > X_DIRECTIVE_SHORTHAND_NO_ARGUMENT > <div #="
               "offset": 5,
             },
           },
-          "modifiers": [
-            "",
-          ],
+          "modifiers": [],
           "name": "slot",
+          "rawName": "#",
           "type": 7,
         },
       ],
@@ -3936,6 +3935,7 @@ exports[`compiler: parse > Errors > X_DIRECTIVE_SHORTHAND_NO_ARGUMENT > <div #="
       "offset": 0,
     },
   },
+  "source": "<div #="obj" />",
   "temps": 0,
   "type": 0,
 }
@@ -3999,10 +3999,10 @@ exports[`compiler: parse > Errors > X_DIRECTIVE_SHORTHAND_NO_ARGUMENT > <div .="
             },
           },
           "modifiers": [
-            "",
             "prop",
           ],
           "name": "bind",
+          "rawName": ".",
           "type": 7,
         },
       ],
@@ -4030,6 +4030,7 @@ exports[`compiler: parse > Errors > X_DIRECTIVE_SHORTHAND_NO_ARGUMENT > <div .="
       "offset": 0,
     },
   },
+  "source": "<div .="obj" />",
   "temps": 0,
   "type": 0,
 }
@@ -4092,10 +4093,9 @@ exports[`compiler: parse > Errors > X_DIRECTIVE_SHORTHAND_NO_ARGUMENT > <div :="
               "offset": 5,
             },
           },
-          "modifiers": [
-            "",
-          ],
+          "modifiers": [],
           "name": "bind",
+          "rawName": ":",
           "type": 7,
         },
       ],
@@ -4123,6 +4123,7 @@ exports[`compiler: parse > Errors > X_DIRECTIVE_SHORTHAND_NO_ARGUMENT > <div :="
       "offset": 0,
     },
   },
+  "source": "<div :="obj" />",
   "temps": 0,
   "type": 0,
 }
@@ -4185,10 +4186,9 @@ exports[`compiler: parse > Errors > X_DIRECTIVE_SHORTHAND_NO_ARGUMENT > <div @="
               "offset": 5,
             },
           },
-          "modifiers": [
-            "",
-          ],
+          "modifiers": [],
           "name": "on",
+          "rawName": "@",
           "type": 7,
         },
       ],
@@ -4216,6 +4216,7 @@ exports[`compiler: parse > Errors > X_DIRECTIVE_SHORTHAND_NO_ARGUMENT > <div @="
       "offset": 0,
     },
   },
+  "source": "<div @="obj" />",
   "temps": 0,
   "type": 0,
 }
diff --git a/packages/compiler-core/__tests__/parse.spec.ts b/packages/compiler-core/__tests__/parse.spec.ts
index 6fc30821b..986326185 100644
--- a/packages/compiler-core/__tests__/parse.spec.ts
+++ b/packages/compiler-core/__tests__/parse.spec.ts
@@ -2063,6 +2063,9 @@ describe('compiler: parse', () => {
         exp: undefined,
         arg: undefined,
       })
+      expect(
+        `the directive shorthand '#' cannot be used without an argument`,
+      ).toHaveBeenWarned()
     })
 
     // edge case found in vue-macros where the input is TS or JSX
diff --git a/packages/compiler-core/src/parser.ts b/packages/compiler-core/src/parser.ts
index e73bffdeb..468e39742 100644
--- a/packages/compiler-core/src/parser.ts
+++ b/packages/compiler-core/src/parser.ts
@@ -243,7 +243,21 @@ const tokenizer = new Tokenizer(stack, {
   },
 
   ondirarg(start, end) {
-    if (start === end) return
+    if (start === end) {
+      if (__DEV__) {
+        const currentDir = currentProp as DirectiveNode
+
+        if (currentDir.rawName?.length === 1) {
+          emitWarning(
+            ErrorCodes.X_DIRECTIVE_SHORTHAND_NO_ARGUMENT,
+            start - 1,
+            `the directive shorthand '${currentDir.rawName}' cannot be used without an argument. ` +
+              `Use v-${currentDir.name} instead or provide an argument.`,
+          )
+        }
+      }
+      return
+    }
     const arg = getSlice(start, end)
     if (inVPre) {
       ;(currentProp as AttributeNode).name += arg
@@ -1007,6 +1021,12 @@ function emitError(code: ErrorCodes, index: number, message?: string) {
   )
 }
 
+function emitWarning(code: ErrorCodes, index: number, message?: string) {
+  currentOptions.onWarn(
+    createCompilerError(code, getLoc(index, index), undefined, message),
+  )
+}
+
 function reset() {
   tokenizer.reset()
   currentOpenTag = null