Iteration on array in event handler function

[Ericlm]

Vue version

3.5.12

Link to minimal reproduction

https://github.com/Ericlm/vue-for-of

Steps to reproduce

• Create a new Vue project
• Create a function that is an event handler in the template (something like @click="() => {}")
• If this function receives or creates an array, this array does not always iterate through its items (which are then undefined).

What is expected?

Using a for loop (which could be for-of, for, or forEach) should not make any item "disappear" for the original array.

What is actually happening?

The for loop looks empty, or filled with undefined. For example, with an array of 5 numbers, it can print 5 undefined.

System Info

System:
    OS: macOS 15.0.1
    CPU: (8) arm64 Apple M1
    Memory: 88.38 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.6.0 - ~/.asdf/installs/nodejs/22.6.0/bin/node
    npm: 10.8.3 - ~/.asdf/plugins/nodejs/shims/npm
    pnpm: 9.9.0 - ~/.asdf/installs/nodejs/22.6.0/bin/pnpm
  Browsers:
    Chrome: 129.0.6668.103
    Safari: 18.0.1
  npmPackages:
    vue: ^3.5.12 => 3.5.12

Any additional comments?

⚠️ It does not occur 100% of the time, but it seems to occur each time the server starts. Sometimes, on HMR, it suddenly works perfectly.

[edison1105]

a workaround see Playground