[Bug] Unable to measure code action items size in shadow DOM

Open
#5,195 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
2/5
Estimated time
1-3 hours
Newbie friendliness
48/100
Issue type
Bug
Clarity
Mostly clear
Activity status
Stale
Tech stack
typescript
Domain
frontend, web-dev

Research direction

Start at src/vs/platform/actionWidget/browser/actionList.ts around line 335, using the linked Monaco playground reproduction to inspect code-action sizing inside a shadow DOM. Verify the ownerDocument lookup and compare the result with the non-shadow-DOM example. Done means the code-action widget measures correctly in the shadow-DOM reproduction without changing the existing behavior outside it.

Written by the indexing model from the issue text.

Description

Reproducible in vscode.dev or in VS Code Desktop?
  • Not reproducible in vscode.dev or VS Code Desktop
Reproducible in the monaco editor playground?
Monaco Editor Playground Link

https://microsoft.github.io/monaco-editor/playground.html?source=v0.56.0-dev-20260119#XQAAAAL1BgAAAAAAAABBqQkHQ5Njdzmwfsp38WgHbUZ87XjZjkxRizxr48ySgyi1PHCopus5pzZ7nawcrO5v4hy0XAl_3CXCteK4RAZFtaNdMXqkOZoPPiDAs-gkmIquc5pyjUumlWqnSkiNMTdQQ9v7R00eaMZQ_GTKVhQI0QLmk5jCpaBGvl4WNCwDIeFNu3TRBJ9ZDLqbRGReSGaQF5akvXu_kDrWww1uceBcVlB4ckZ_GdXAuGbhfmC1nKin0Yk2_Cc6tlWHBx7g6-cRxihzVjpes_w8zht0dzFnSi0yMyx3fC3TiAAYzAhodLvOMgYoZB-KJCT0gGfV2BukQG2IM-ak3_ZG2ut7-TacSgRyrvWomod61_c6e9bulYaVA6UaTXqZW_jXTRca2fz4NKrHQR6Tk-tMNAnCrsK1kJFAfcRUPGQUTm0kKSlMTsubZFLEcl_N9ridjdXBuyb8lEcFRMM71pPUZu9i107wa0LEztttazrdr6qAtzojY9ZZXconTY4ETYVvbbJMYmNzopjwWL_IcT5ZR1oYQc3Uv_v0iZSa6Ibf8lUY6jyigzQTSRfLBb6H73O2U90ueJRO4Zdm814XIa8ZKRb19kDi44RSUNj3EUDVc0rvNBEfUVOAjZa_bZrQPo7iu16pQfimnSkP3L6QsOmOdo0ut8rJSNoDbLJt-N9waxQ1oCIURYLBAn9-ca-ZsxGNY_BROVGrb3zxWrYe48A_AsZfnn1WASjuKcx-nMa5RnZNfpa2VYK7LOEkudE44T0jqsxQMlRapcIxrXQvHxs_Davh9f_reM6DA9XVMQMiBQShGUrotfr5WPPFMfwJOGLBGUErztGejV3NtWl99KTH5Fd5MknUKIqzKODpDouZQcApc1yCh83ZBdQR1kiY4lbWZQLYkEyWKQivrFRxG9_h4UvvNtRgIkprQXR2e9QJWWDE9WhzeqVxJAURk5CEqalwaeKiOFbg-IsZnk4SrHDUTW1oTdOYj0kn5SG-QcwSp3gzIdkX_CLq3zHjtSSqT0EX4SOmLJz9KxvBE80Kwb7NwsrwMoVM5t7Lpj6FmFdkXuSGyeP0put-iSw22Vj2SzWZYRy4ZOGaLNAYol0E9KF0BkduYCe-T2CniFVvDS5X7mlayYZVnGXImpU0hSVB8gt8AokjZddJDzC0U7m6PzDUgQiK3WmN1nYdpgAF-7EgFSamPXciU5Agl7h329Cop__3hT6c

Monaco Editor Playground Code
<div>Hello World</div>
Reproduction Steps

Press Ctrl + . to show code actions.

Actual (Problematic) Behavior
Image
Expected Behavior

What it looks like without a shadow dom wrapper.

Image

Link: https://microsoft.github.io/monaco-editor/playground.html?source=v0.56.0-dev-20260119#XQAAAAJfAwAAAAAAAABBqQkHQ5NjdMjwa-jY7SIQ9S7DNlzs5W-mwj0fe1ZCDRFc9ws9XQE0SJE1jc2VKxhaLFIw9vEWSxW3yscw4KS44Or1jwBJ-cPayCQY4iC3FrkE9a7POHp3QG-jDr4FdR5dywU6Cn5I9YaMjRMGQGA__k81gg9A2vBYtwcfkNcLjY1fAijAVzYoU7vvchF3wxVKn7IjFPRRmquBv0vVAskdYhJy1kwQEDMdwHjMb9B1kusQL9jSRgpdEUS6qHoehhHZ0sHHvjSzizTsRby6fDUYR0h3qT57SAT6xmWbhWCjKVIHoUCkPoChhUfvR9gLlhQB7FmRqq_aCvvZly5YuOVQ7Ocvr5sXYc4Baqv5wza_Z8HUVKGktoy-_oAF43mCim2nGz1VCj5ozQLrPFYsPwl9s4QhZPBw-EcVxUBhC__mj1jDP61tAuHmHgLfEnh9Ame0xDWGBd1Jg-1x3wXmGBvmADKZlYCwFW0U3dliCuPkLPF5-m_8byag98Dacg2cqn2BJcz-JBreCOwFwOJexxoCUgzHR_NvqxI-VJyVH7Tta_3oVmXN4pxgVNnTF3e0Xr7hisnTuIkayM-DX_-6YJp_egdsF4quptEQpIRom1NMATEzDrPVl0OqNe_xzYO22EH2sryybez9EG-H_zZ4ZQA

Additional Context

Change .ownerDocument to .getRootNode() fixes this issue.

https://github.com/microsoft/vscode/blob/6b921dda5c679c6ca1928a4505567c533ede72f9/src/vs/platform/actionWidget/browser/actionList.ts#L335

Dominant language
JavaScript
Stars
46.8k
Forks
4.1k
Avg merge
17h 58m
Merged PRs (30d)
1

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from microsoft/monaco-editor

All issues in microsoft/monaco-editor

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.