Closed
Description
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
- Create a simple Vue project using
npm create vue@latest
. - Create a child component named
CompA
. - Create another child component named
CompB
. - Import both components into
App.vue
. - Use
CompA
inApp.vue
with av-for
directive. - Use
CompB
afterCompA
and ensure it can be folded. - Create a div element after
CompB
with an arbitrary class name. - 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
volar@v1.8.27
.
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
volar@v2.1.6
.
Link to minimal reproduction
https://github.com/Wonder2018/volar-issue-highlighting-loss
Any additional comments?
No response