From 441e7a7d280a8216a1a8db3e1489a4a0c90bee08 Mon Sep 17 00:00:00 2001
From: skirtle <65301168+skirtles-code@users.noreply.github.com>
Date: Fri, 16 Dec 2022 16:50:06 +0000
Subject: [PATCH 1/5] dx(compiler-core): warn for `:v-`

---
 .../__snapshots__/parse.spec.ts.snap          | 109 ++++++++++++++++++
 .../compiler-core/__tests__/parse.spec.ts     |  34 +++++-
 packages/compiler-core/src/errors.ts          |   2 +
 packages/compiler-core/src/parse.ts           |  22 +++-
 4 files changed, 158 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..7bf3c0549 100644
--- a/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
+++ b/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
@@ -5832,6 +5832,115 @@ exports[`compiler: parse Errors UNEXPECTED_SOLIDUS_IN_TAG <template><div a/b></d
 }
 `;
 
+exports[`compiler: parse Errors X_COLON_BEFORE_DIRECTIVE <div :v-foo="obj" /> 1`] = `
+{
+  "cached": 0,
+  "children": [
+    {
+      "children": [],
+      "codegenNode": undefined,
+      "isSelfClosing": true,
+      "loc": {
+        "end": {
+          "column": 21,
+          "line": 1,
+          "offset": 20,
+        },
+        "source": "<div :v-foo="obj" />",
+        "start": {
+          "column": 1,
+          "line": 1,
+          "offset": 0,
+        },
+      },
+      "ns": 0,
+      "props": [
+        {
+          "arg": {
+            "constType": 3,
+            "content": "v-foo",
+            "isStatic": true,
+            "loc": {
+              "end": {
+                "column": 12,
+                "line": 1,
+                "offset": 11,
+              },
+              "source": "v-foo",
+              "start": {
+                "column": 7,
+                "line": 1,
+                "offset": 6,
+              },
+            },
+            "type": 4,
+          },
+          "exp": {
+            "constType": 0,
+            "content": "obj",
+            "isStatic": false,
+            "loc": {
+              "end": {
+                "column": 17,
+                "line": 1,
+                "offset": 16,
+              },
+              "source": "obj",
+              "start": {
+                "column": 14,
+                "line": 1,
+                "offset": 13,
+              },
+            },
+            "type": 4,
+          },
+          "loc": {
+            "end": {
+              "column": 18,
+              "line": 1,
+              "offset": 17,
+            },
+            "source": ":v-foo="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": 21,
+      "line": 1,
+      "offset": 20,
+    },
+    "source": "<div :v-foo="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..5bc416da0 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,33 @@ foo
             }
           ]
         }
+      ],
+      X_COLON_BEFORE_DIRECTIVE: [
+        {
+          code: `<div :v-foo="obj" />`,
+          warnings: [
+            {
+              type: ErrorCodes.X_COLON_BEFORE_DIRECTIVE,
+              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 +3070,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..fa2d0a824 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_COLON_BEFORE_DIRECTIVE,
 
   // 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_COLON_BEFORE_DIRECTIVE]: `Colon before directive: `,
 
   // 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..8032c4c45 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,22 @@ function parseAttribute(
         : startsWith(name, '@')
         ? 'on'
         : 'slot')
+
+    if (__DEV__) {
+      if (name.startsWith(':v-')) {
+        context.options.onWarn(
+          createCompilerError(
+            ErrorCodes.X_COLON_BEFORE_DIRECTIVE,
+            loc,
+            undefined,
+            `the attribute name ${name} is probably a mistake. Did you mean ${name.slice(
+              1
+            )} instead?`
+          )
+        )
+      }
+    }
+
     let arg: ExpressionNode | undefined
 
     if (match[2]) {

From 39f81479bf213534c2acad7a8f6af5732bbedc6a Mon Sep 17 00:00:00 2001
From: skirtle <65301168+skirtles-code@users.noreply.github.com>
Date: Tue, 7 Feb 2023 22:16:55 +0000
Subject: [PATCH 2/5] 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 56ee5329e76600dbf9bb76caf506dcae6780ad41 Mon Sep 17 00:00:00 2001
From: skirtle <65301168+skirtles-code@users.noreply.github.com>
Date: Sat, 22 Apr 2023 06:47:37 +0100
Subject: [PATCH 3/5] chore: Revert formatting change

---
 .../__tests__/components/Suspense.spec.ts             | 11 +++--------
 1 file changed, 3 insertions(+), 8 deletions(-)

diff --git a/packages/runtime-core/__tests__/components/Suspense.spec.ts b/packages/runtime-core/__tests__/components/Suspense.spec.ts
index b43633059..80d213fc7 100644
--- a/packages/runtime-core/__tests__/components/Suspense.spec.ts
+++ b/packages/runtime-core/__tests__/components/Suspense.spec.ts
@@ -1335,14 +1335,9 @@ describe('Suspense', () => {
           h(Suspense, null, {
             default: [
               h(outerToggle.value ? OuterB : OuterA, null, {
-                default: () =>
-                  h(
-                    Suspense,
-                    { suspensible: true },
-                    {
-                      default: h(innerToggle.value ? InnerB : InnerA)
-                    }
-                  )
+                default: () => h(Suspense, { suspensible: true },{
+                  default: h(innerToggle.value ? InnerB : InnerA)
+                })
               })
             ],
             fallback: h('div', 'fallback outer')

From 949f7bfe36f3f7abbfc35a4350f72ce86ebcfa24 Mon Sep 17 00:00:00 2001
From: skirtle <65301168+skirtles-code@users.noreply.github.com>
Date: Wed, 13 Dec 2023 21:08:17 +0000
Subject: [PATCH 4/5] Update snapshot

---
 .../__tests__/__snapshots__/parse.spec.ts.snap              | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap b/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
index 410ccca08..60a3c2079 100644
--- a/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
+++ b/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
@@ -5846,7 +5846,7 @@ exports[`compiler: parse > Errors > X_COLON_BEFORE_DIRECTIVE > <div :v-foo="obj"
           "line": 1,
           "offset": 20,
         },
-        "source": "<div :v-foo=\\"obj\\" />",
+        "source": "<div :v-foo="obj" />",
         "start": {
           "column": 1,
           "line": 1,
@@ -5900,7 +5900,7 @@ exports[`compiler: parse > Errors > X_COLON_BEFORE_DIRECTIVE > <div :v-foo="obj"
               "line": 1,
               "offset": 17,
             },
-            "source": ":v-foo=\\"obj\\"",
+            "source": ":v-foo="obj"",
             "start": {
               "column": 6,
               "line": 1,
@@ -5929,7 +5929,7 @@ exports[`compiler: parse > Errors > X_COLON_BEFORE_DIRECTIVE > <div :v-foo="obj"
       "line": 1,
       "offset": 20,
     },
-    "source": "<div :v-foo=\\"obj\\" />",
+    "source": "<div :v-foo="obj" />",
     "start": {
       "column": 1,
       "line": 1,

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

---
 .../__tests__/__snapshots__/parse.spec.ts.snap  |  2 ++
 packages/compiler-core/src/parser.ts            | 17 +++++++++++++++++
 2 files changed, 19 insertions(+)

diff --git a/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap b/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
index 8c9d875c4..fd2bfd2f8 100644
--- a/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
+++ b/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
@@ -3925,6 +3925,7 @@ exports[`compiler: parse > Errors > X_COLON_BEFORE_DIRECTIVE > <div :v-foo="obj"
           },
           "modifiers": [],
           "name": "bind",
+          "rawName": ":v-foo",
           "type": 7,
         },
       ],
@@ -3952,6 +3953,7 @@ exports[`compiler: parse > Errors > X_COLON_BEFORE_DIRECTIVE > <div :v-foo="obj"
       "offset": 0,
     },
   },
+  "source": "<div :v-foo="obj" />",
   "temps": 0,
   "type": 0,
 }
diff --git a/packages/compiler-core/src/parser.ts b/packages/compiler-core/src/parser.ts
index e73bffdeb..0750a1858 100644
--- a/packages/compiler-core/src/parser.ts
+++ b/packages/compiler-core/src/parser.ts
@@ -256,6 +256,17 @@ const tokenizer = new Tokenizer(stack, {
         getLoc(start, end),
         isStatic ? ConstantTypes.CAN_STRINGIFY : ConstantTypes.NOT_CONSTANT,
       )
+      if (
+        __DEV__ &&
+        arg.startsWith('v-') &&
+        (currentProp as DirectiveNode).rawName === ':'
+      ) {
+        emitWarning(
+          ErrorCodes.X_COLON_BEFORE_DIRECTIVE,
+          start - 1,
+          `the attribute name :${arg} is probably a mistake. Did you mean ${arg} instead?`,
+        )
+      }
     }
   },
 
@@ -1007,6 +1018,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