Regression in 3.5.23: fails to parse ! in typescript

[cyberalien]

Vue version

3.5.23

Link to minimal reproduction

https://github.com/cyberalien/vue-3-5-23-bug

Steps to reproduce

Run npm run build

What is expected?

Expected to to compile

What is actually happening?

error during build:
[vite:esbuild] Transform failed with 1 error:
/bug-test/src/App.vue?vue&type=script&setup=true&lang.ts:22:2: ERROR: Expected "]" but found "}"
file: /bug-test/src/App.vue?vue&type=script&setup=true&lang.ts:22:2

Expected "]" but found "}"
20 |    return (_openBlock(), _createElementBlock("p", {
21 |      "data-foo": data[key.value
22 |    }, "Test", 8, _hoisted_1))
   |    ^
23 |  }
24 |  }

    at failureErrorWithLog (/bug-test/node_modules/esbuild/lib/main.js:1467:15)
    at /bug-test/node_modules/esbuild/lib/main.js:736:50
    at responseCallbacks.<computed> (/bug-test/node_modules/esbuild/lib/main.js:603:9)
    at handleIncomingPacket (/bug-test/node_modules/esbuild/lib/main.js:658:12)
    at Socket.readFromStdout (/bug-test/node_modules/esbuild/lib/main.js:581:7)
    at Socket.emit (node:events:519:28)
    at addChunk (node:internal/streams/readable:561:12)
    at readableAddChunkPushByteMode (node:internal/streams/readable:512:3)
    at Readable.push (node:internal/streams/readable:392:5)
    at Pipe.onStreamRead (node:internal/stream_base_commons:189:23)
ERROR: "build-only" exited with 1.

System Info

System:
    OS: macOS 26.1
    CPU: (10) arm64 Apple M5
    Memory: 640.25 MB / 24.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.21.0 - /Users/slava/.nvm/versions/node/v22.21.0/bin/node
    npm: 10.9.4 - /Users/slava/.nvm/versions/node/v22.21.0/bin/npm
    pnpm: 9.15.9 - /Users/slava/.nvm/versions/node/v22.21.0/bin/pnpm
    bun: 1.3.1 - /Users/slava/.bun/bin/bun
  Browsers:
    Chrome: 142.0.7444.60
    Firefox: 144.0.2
    Firefox Nightly: 146.0a1
    Safari: 26.1
    Safari Technology Preview: 26.0
  npmPackages:
    vue: ^3.5.22 => 3.5.23

Any additional comments?

Bug is triggered by ! on line 12 of App.vue

That's valid TypeScript syntax, even though it doesn't make sense in this code because this is reduced test case to show bug.

Worked fine in 3.5.22

[mat813]

I think it's the same issue, what I have is this code:

      <VtigerInput
        v-for="field of fields"
        :key="field.name"
        v-model="user[field.name as keyof typeof user] as string"
        :field="field"
      />

That now gives this error:

Expected "]" but found ":"
243 |            key: field.name,
244 |            modelValue: _unref(user)[field.name,
245 |            "onUpdate:modelValue": ($event: any) => ((_unref(user)[field.name) = $event),
    |                                 ^
246 |            field: field
247 |          }, null, 8, ["modelValue", "onUpdate:modelValue", "field"]))

[cyberalien]

Yes, it is the same issue: last character ] is removed from property value where TypeScript is used

[AaronDewes]

This appears to have been caused by #13397. Reverting this locally fixes the failure.

[cyberalien]

Tests to add to packages/compiler-core/__tests__/transforms/transformExpressions.spec.ts to show bug:

 test('expression without type casting', () => {
    const { code } = compile(`<div :data-foo="bar[baz]"></div>`)
    expect(code).toMatch(`{
    "data-foo": _ctx.bar[_ctx.baz]
  }`)
  })

  test('expression with type casting', () => {
    const { code } = compile(`<div :data-foo="bar[baz] as string"></div>`)
    expect(code).toMatch(`{
    "data-foo": _ctx.bar[_ctx.baz]
  }`)
  })

But I have no idea how to fix that.

[AaronDewes]

The Vapor compiler in 3.6.0-alpha.3 seems to not have this issue, even though it contains #13395, which seems to be a nearly identical change.

[bram-pkg]

I believe this is happening because of the slice on the string here: https://github.com/vuejs/core/pull/13397/files#diff-4159ce11acf9eca18d86c2fd3dbb37946bd01f074c892e9334523a12a2875d8bR359

The test only checks if <string>(myvar) works, not myvar as string

[negezor]

The Vapor compiler in 3.6.0-alpha.3 seems to not have this issue

@AaronDewes I checked, and 3.6.0-alpha.3 has this issue. I had to roll back to 3.6.0-alpha.2.

[AaronDewes]

The Vapor compiler in 3.6.0-alpha.3 seems to not have this issue

@AaronDewes I checked, and 3.6.0-alpha.3 has this issue. I had to roll back to 3.6.0-alpha.2.

Are you using the vapor compiler?

I tried in the playground, and alpha 3 fails without Vapor mode, but succeeds if I enable vapor mode.

(Please note: For some reason, the Vapor playground link only works if I make an edit in the editor, otherwise it fails for me, but the edit can be anything, including adding a comment or a space)

[negezor]

Are you using the vapor compiler?

Nope. I misunderstood. I meant that issue is also present in 3.6.0-alpha.3

[zhiyuanzmj]

Sorry, I shouldn't have removed TypeScript in the expression. #13397 should be revert.

[scottbedard]

Interestingly, this doesn't always cause compilation to fail. With text nodes it produces unexpected output

3.5.22 → 3.5.23