fix(matcher): finalize param token before processing escaped colon

packages/playground/src/App.vue

@@ -158,6 +158,16 @@
       <li>
         <router-link to="/p_1/absolute-a">/p_1/absolute-a</router-link>
       </li>
+      <li>
+        <router-link to="/entity/section:aaabbbccc"
+          >/entity/section:aaabbbccc</router-link
+        >
+      </li>
+      <li>
+        <router-link to="/entity/sectionaaabbbccc"
+          >/entity/sectionaaabbbccc</router-link
+        >
+      </li>
     </ul>
     <button @click="toggleViewName">Toggle view</button>
     <RouterView :name="viewName" v-slot="{ Component, route }">

packages/playground/src/router.ts

@@ -84,6 +84,11 @@ export const router = createRouter({
     },
     { path: '/with-data', component: ComponentWithData, name: 'WithData' },
     { path: '/rep/:a*', component: RepeatedParams, name: 'repeat' },
+    {
+      path: '/entity/:entityType([^:]+)\\::entityID',
+      name: 'entity',
+      component,
+    },
     { path: '/:data(.*)', component: NotFound, name: 'NotFound' },
     {
       path: '/nested',

packages/router/__tests__/matcher/pathParser.spec.ts

@@ -30,6 +30,58 @@ describe('Path parser', () => {
       ])
     })
 
+    it('escapes : after param', () => {
+      expect(tokenizePath('/:foo\\:abc')).toEqual([
+        [
+          {
+            type: TokenType.Param,
+            value: 'foo',
+            regexp: '',
+            repeatable: false,
+            optional: false,
+          },
+          { type: TokenType.Static, value: ':abc' },
+        ],
+      ])
+    })
+
+    it('escapes : after param with custom re', () => {
+      expect(tokenizePath('/:foo([^:]+)\\:abc')).toEqual([
+        [
+          {
+            type: TokenType.Param,
+            value: 'foo',
+            regexp: '[^:]+',
+            repeatable: false,
+            optional: false,
+          },
+          { type: TokenType.Static, value: ':abc' },
+        ],
+      ])
+    })
+
+    it('escapes : between two params', () => {
+      expect(tokenizePath('/:foo([^:]+)\\::bar')).toEqual([
+        [
+          {
+            type: TokenType.Param,
+            value: 'foo',
+            regexp: '[^:]+',
+            repeatable: false,
+            optional: false,
+          },
+          { type: TokenType.Static, value: ':' },
+          {
+            type: TokenType.Param,
+            value: 'bar',
+            regexp: '',
+            repeatable: false,
+            optional: false,
+          },
+        ],
+      ])
+    })
+
     // not sure how useful this is and if it's worth supporting because of the
     // cost to support the ranking as well
     it.skip('groups', () => {
@@ -808,6 +860,33 @@ describe('Path parser', () => {
       })
     })
 
+    it('param followed by escaped colon and static', () => {
+      matchParams('/:foo\\:abc', '/section:abc', { foo: 'section' })
+      matchParams('/:foo\\:abc', '/sectionabc', null)
+    })
+
+    it('optional param followed by escaped colon and static', () => {
+      matchParams('/:foo?\\:abc', '/:abc', { foo: '' })
+      matchParams('/:foo?\\:abc', '/section:abc', { foo: 'section' })
+    })
+
+    it('repeatable param followed by escaped colon and static', () => {
+      matchParams('/:foo+\\:abc', '/section:abc', { foo: ['section'] })
+      matchParams('/:foo+\\:abc', '/a/b:abc', { foo: ['a', 'b'] })
+    })
+
+    it('param with custom re followed by escaped colon and static', () => {
+      matchParams('/:foo([^:]+)\\:abc', '/section:abc', { foo: 'section' })
+      matchParams('/:foo([^:]+)\\:abc', '/sectionabc', null)
+    })
+
+    it('param with custom re followed by escaped colon and another param', () => {
+      matchParams('/:foo([^:]+)\\::bar', '/section:aaabbbccc', {
+        foo: 'section',
+        bar: 'aaabbbccc',
+      })
+    })
+
     // end of parsing urls
   })
 

packages/router/src/matcher/pathTokenizer.ts

@@ -119,6 +119,14 @@ export function tokenizePath(path: string): Array<Token[]> {
     char = path[i++]
 
     if (char === '\\' && state !== TokenizerState.ParamRegExp) {
+      if (
+        state === TokenizerState.Param ||
+        state === TokenizerState.ParamRegExpEnd
+      ) {
+        consumeBuffer()
+        customRe = ''
+        state = TokenizerState.Static
+      }
       previousState = state
       state = TokenizerState.EscapeNext
       continue