Loss of Syntax Highlighting for an Element When Subsequent Elements in Template Are Folded

[Wonder2018]

Vue - Official extension or vue-tsc version

v2.1.6

VSCode version

1.94.2 (windows system setup)

Vue version

3.5.12

TypeScript version

5.6.3

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (12) x64 12th Gen Intel(R) Core(TM) i5-12490F
    Memory: 9.02 GB / 15.82 GB
  Binaries:
    Node: 18.16.0 - D:\Develop\nvm\v18.16.0\node.EXE
    npm: 9.5.1 - D:\Develop\nvm\v18.16.0\npm.CMD
    pnpm: 8.7.1 - D:\Develop\nvm\v18.16.0\pnpm.CMD
  Browsers:
    Edge: Chromium (127.0.2651.74)
    Internet Explorer: 11.0.22621.3527

package.json dependencies

"dependencies": {
    "vue": "^3.5.12"
  },
  "devDependencies": {
    "@tsconfig/node20": "^20.1.4",
    "@types/node": "^20.16.11",
    "@vitejs/plugin-vue": "^5.1.4",
    "@vue/tsconfig": "^0.5.1",
    "npm-run-all2": "^6.2.3",
    "typescript": "~5.5.4",
    "vite": "^5.4.8",
    "vue-tsc": "^2.1.6"
  }

Steps to reproduce

1. Create a simple Vue project using npm create vue@latest.
2. Create a child component named CompA.
3. Create another child component named CompB.
4. Import both components into App.vue.
5. Use CompA in App.vue with a v-for directive.
6. Use CompB after CompA and ensure it can be folded.
7. Create a div element after CompB with an arbitrary class name.
8. Fold CompB to observe the issue.

Here is a sample repository volar-issue-highlighting-loss that has already been created for this issue.

Below is the content of the component app.vue.

<template>
    <comp-a v-for="(cell, ind) in new Array()" :key="ind"></comp-a>
    <comp-a></comp-a>
    <comp-a></comp-a>
    <comp-b></comp-b>
    <comp-b></comp-b>
    <comp-b></comp-b>
    <comp-b>
        <div>ccc</div>
    </comp-b>
    <div class="xxx">ddd</div>
</template>

<script setup lang="ts">
import CompA from "./CompA.vue";
import CompB from "./CompB.vue";
</script>

What is expected?

When the "comp-b" component is folded, the "comp-a" component is highlighted in green.

This screenshot shows the effect when using [email protected].

What is actually happening?

When the "comp-b" component is folded, the "comp-a" component loses its highlight display.

This screenshot shows the effect when using [email protected].

Link to minimal reproduction

https://github.com/Wonder2018/volar-issue-highlighting-loss

Any additional comments?

No response