microsoft / microsoft/TypeScript

Form controller bricks intellsense for rest of session

オープン
#62,192 コメント 2 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

Domain: Performance Needs More Info
主要言語
Go
スター
111k
フォーク
14.3k
平均マージ
2日 4時間
マージ済み PR(30日)
132

説明

Type: Bug

I have a scenario which is causing Intellisense to break (stuck on "Loading IntelliSense status" indefinitely), meaning I cannot continue development.

My situation:

I am creating a react project using react-hook-form to create a form for a complicated object, hence I am using [useFormContext](https://www.react-hook-form.com/api/useformcontext/) to allow me to nest react function components. My code is as follows:

```
import { Controller, useFormContext } from "react-hook-form";
import { LargeInterface } from "./somewhere";

interface smallDataStructure {
name: string
}

const ChannelForm: React.FC = () => {
const formControls = useFormContext(); // <--- this does not break vscode
// const formControls = useFormContext(); <-- this breaks vscode

return (

)
}
```
I have narrowed the problem down to giving the `useFormContext` a generic parameter (which is used to give a type to the field values) which is a very large interface made up of multiple layers of inheritence (I can provide further information on this when necessary). When I use a small interface as depicted above, there is no problem. When I change the code to use the data scructure I need, the line `` can no longer be written without VS bricking for the rest of the session, only fixing when I restart the application (this specifically happens when I write the "control={formControls.control}").

The technologies I am using:
- React.js with Vite
- typescript
- react-hook-form

The typescript engine appears to be unable to handle whatever problem is occurring here. The datastructure I am trying to use as a generic is complex and made up of multiple layers of inheritance, it includes mostly simple datatypes, but also an array of a user defined class objects. This is what is causing the problem! My "LargeInterface" interface looks as follows:

```
interface LargeInterface inherits MoreSimpleDatatypes {
objs: LargeObject[],
// ... other simple datatypes
}
```

where `LargeObject` is, as the name would suggest, a deeply inherited class. I've tried reproducing this with a simple class, but to no avail. There is something about my `LargeObject` in particular which it does not like. It is probably the case that I am not meant to be using a class as the FieldValues type, but nevertheless, vscode cannot provide the suitable error message in this scenario.

What I've tried:

- Change VS code version, use insiders
- COMPLETELY uninstall all VS code versions from my PC
- Deactivate all plugins
- Change ts version
- Recreate file
- Cleared any cache I could find
- Reclone repo
- Deactivate copilot

Help would be greatly appreciated as I cannot develop on VS code with this problem.

VS Code version: Code - Insiders 1.103.0-insider (994be4137aaf18f2703037311dd1c56a8446ef8b, 2025-08-01T20:53:15.562Z)
OS version: Windows_NT x64 10.0.19045
Modes:

System Info

|Item|Value|
|---|---|
|CPUs|AMD Ryzen 5 3600 6-Core Processor (12 x 3600)|
|GPU Status|2d_canvas: enabled
direct_rendering_display_compositor: disabled_off_ok
gpu_compositing: enabled
multiple_raster_threads: enabled_on
opengl: enabled_on
rasterization: enabled
raw_draw: disabled_off_ok
skia_graphite: disabled_off
trees_in_viz: disabled_off
video_decode: enabled
video_encode: enabled
vulkan: disabled_off
webgl: enabled
webgl2: enabled
webgpu: enabled
webnn: disabled_off|
|Load (avg)|undefined|
|Memory (System)|15.93GB (4.73GB free)|
|Process Argv|--crash-reporter-id cc3d998a-aad8-47bd-8ea7-f068b3586619|
|Screen Reader|no|
|VM|0%|
Extensions (5)

Extension|Author (truncated)|Version
---|---|---
vscode-containers|ms-|2.1.0
remote-containers|ms-|0.424.0
remote-wsl|ms-|0.99.0
code-spell-checker|str|4.2.3
vscode-icons|vsc|12.14.0

コントリビューションガイド

コントリビューションガイドを開く

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

調査の方向性

VS Code Insiders で報告された React/TypeScript の例から始め、小さなジェネリックと LargeInterface、およびその深く継承された LargeObject 配列を比較します。IntelliSense のハングが引き続き再現するまで型を縮小し、その後、縮小したケースで IntelliSense が「Loading IntelliSense status」のまま停止しなくなったことを確認します。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
react, typescript, vite
領域
devtools
issue の種類
バグ
難易度
4/5
見積もり時間
3〜5日
活発さ
停滞
明瞭さ
説明が足りない
初心者へのやさしさ
30/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。