@vue/shared generateCodeFrame can infinite loop

[aturingmachine]

Vue version

3.4.26

Link to minimal reproduction

https://github.com/aturingmachine/vue-sfc-infinite-loop

Steps to reproduce

Have a component making use of a Generic in it's Props that extends an enum.

i.e. (this is pulled from the linked reproduction)

<script setup lang="ts" generic="K extends SomeEnum">
import type { SomeEnum } from '@/consants';
import type { EventParams } from '@/event-params';
import { onMounted } from 'vue';

interface Props<K extends SomeEnum> {
  eventParams: EventParams[K]
}

const props = defineProps<Props<SomeEnum>>()

also occurs if the generic attribute is not used

Have SomeEnum defined in another file (in this case src/constants.ts)

This part I have not fully figured out the exact cases but please bear with me

If the lengths of the 2 files match some (currently) unknown condition, the call to generateCodeFrame will get stuck in an infinite loop in its inner for loop.

Link to Line in Question

What is expected?

That the compiler will report the error at the correct lines.

What is actually happening?

The Compiler gets stuck in an infinite loop and hangs indefinitely.

System Info

System:
  OS: Linux 6.6 Manjaro Linux
  CPU: (12) x64 Intel(R) Core(TM) i7-8700 CPU @ 3.20GHz
  Memory: 46.28 GB / 62.65 GB
  Container: Yes
  Shell: 5.9 - /usr/bin/zsh
Binaries:
  Node: 22.0.0 - ~/.nvm/versions/node/v22.0.0/bin/node
  npm: 10.5.1 - ~/.nvm/versions/node/v22.0.0/bin/npm
npmPackages:
  vue: ^3.4.21 => 3.4.26

Any additional comments?

This issue has been brought up once and resolved seen here.

The issue can be "resolved" by reducing the number of lines in either the Component file or the file containing the Enum.

It seems the case j >= lines.length on line 26 leading to the continue trips the infinite loop, but I may be wrong.

The provided reproduction link is a simplified version of our production code that triggered the initial issue.

[jh-leong]

As the issue points out, the endless loop happens because generateCodeFrame doesn't handle invalid end values correctly, causing the loop.

I fixed this in PR #10883.

About expecting the compiler to report errors, in Vue, always softly fail on failed runtime type inference. You can find the code here.

The specific call to generateCodeFrame with an incorrect end value is here. The exact reason isn't clear yet.

Hope this helps :)