fix(reactivity-transform): apply transform for labelled variable declarations

ref https://github.com/vuejs/core/issues/5298#issuecomment-1017970061

diff --git a/packages/reactivity-transform/__tests__/__snapshots__/reactivityTransform.spec.ts.snap b/packages/reactivity-transform/__tests__/__snapshots__/reactivityTransform.spec.ts.snap
index 793ee307632fc14746ecd2d085f5a3f2835f6dca..73b5db93ee69900f5808ff6c5049e2a4a9dff2cc 100644 (file)
--- a/packages/reactivity-transform/__tests__/__snapshots__/reactivityTransform.spec.ts.snap
+++ b/packages/reactivity-transform/__tests__/__snapshots__/reactivityTransform.spec.ts.snap
@@ -10,6 +10,7 @@ exports[`$ unwrapping 1`] = `
     }))
     let c = () => {}
     let d
+    label: var e = (ref())
     "
 `;
 
@@ -34,12 +35,13 @@ exports[`$ref & $shallowRef declarations 1`] = `
 "import { ref as _ref, shallowRef as _shallowRef } from 'vue'
 
     let foo = _ref()
-    let a = _ref(1)
+    export let a = _ref(1)
     let b = _shallowRef({
       count: 0
     })
     let c = () => {}
     let d
+    label: var e = _ref()
     "
 `;
 

diff --git a/packages/reactivity-transform/__tests__/reactivityTransform.spec.ts b/packages/reactivity-transform/__tests__/reactivityTransform.spec.ts
index 916bd5a7d595d6e8d226021abadbd853b58d193b..9f24d2663e55bfafebec2ff624720ef909d9b5f5 100644 (file)
--- a/packages/reactivity-transform/__tests__/reactivityTransform.spec.ts
+++ b/packages/reactivity-transform/__tests__/reactivityTransform.spec.ts
@@ -25,6 +25,7 @@ test('$ unwrapping', () => {
     }))
     let c = () => {}
     let d
+    label: var e = $(ref())
     `)
   expect(code).not.toMatch(`$(ref())`)
   expect(code).not.toMatch(`$(ref(1))`)
@@ -39,19 +40,21 @@ test('$ unwrapping', () => {
   // normal declarations left untouched
   expect(code).toMatch(`let c = () => {}`)
   expect(code).toMatch(`let d`)
-  expect(rootRefs).toStrictEqual(['foo', 'a', 'b'])
+  expect(code).toMatch(`label: var e = (ref())`)
+  expect(rootRefs).toStrictEqual(['foo', 'a', 'b', 'e'])
   assertCode(code)
 })
 
 test('$ref & $shallowRef declarations', () => {
   const { code, rootRefs, importedHelpers } = transform(`
     let foo = $ref()
-    let a = $ref(1)
+    export let a = $ref(1)
     let b = $shallowRef({
       count: 0
     })
     let c = () => {}
     let d
+    label: var e = $ref()
     `)
   expect(code).toMatch(
     `import { ref as _ref, shallowRef as _shallowRef } from 'vue'`
@@ -69,7 +72,8 @@ test('$ref & $shallowRef declarations', () => {
   // normal declarations left untouched
   expect(code).toMatch(`let c = () => {}`)
   expect(code).toMatch(`let d`)
-  expect(rootRefs).toStrictEqual(['foo', 'a', 'b'])
+  expect(code).toMatch(`label: var e = _ref()`)
+  expect(rootRefs).toStrictEqual(['foo', 'a', 'b', 'e'])
   expect(importedHelpers).toStrictEqual(['ref', 'shallowRef'])
   assertCode(code)
 })

diff --git a/packages/reactivity-transform/src/reactivityTransform.ts b/packages/reactivity-transform/src/reactivityTransform.ts
index be6ceb75693fa9d65d846d07d677403b6a3c9683..a67d843280d65ad4639a95cbee2a987bc36656b8 100644 (file)
--- a/packages/reactivity-transform/src/reactivityTransform.ts
+++ b/packages/reactivity-transform/src/reactivityTransform.ts
@@ -235,6 +235,11 @@ export function transformAST(
         stmt.declaration.type === 'VariableDeclaration'
       ) {
         walkVariableDeclaration(stmt.declaration, isRoot)
+      } else if (
+        stmt.type === 'LabeledStatement' &&
+        stmt.body.type === 'VariableDeclaration'
+      ) {
+        walkVariableDeclaration(stmt.body, isRoot)
       }
     }
   }