microsoft / vscode-webview-ui-toolkit

A component library for building webview-based extensions in Visual Studio Code.
MIT License
2k stars 138 forks source link

When using `ctrl + s` to save, whether the `onChange` event is triggered again and the content displayed under the `label` in the `VSCodeOption` tag are related. We tested several different labels and the situations encountered were different. #475

Open wang-xiaochong opened 1 year ago

wang-xiaochong commented 1 year ago

Type: Bug

Issue with VSCodeDropdown component in VS Code WebView plugin:

When using ctrl + s to save, whether the onChange event is triggered again and the content displayed under the label in the VSCodeOption tag are related. We tested several different labels and the situations encountered were different.

Situation one: Saving normally without triggering the onChange event.

Situation two: Abnormal saving, triggering the onChange event and randomizing the value.

Code for situation one:

<VSCodeDropdown name="onOverVoltage" value={onOverVoltage} onChange={onChange} position="below">
  <VSCodeOption value="0">{`xxx 1`}</VSCodeOption>
  <VSCodeOption value="1">{`yyy 2`}</VSCodeOption>
  <VSCodeOption value="2">{`zzz 3`}</VSCodeOption>
</VSCodeDropdown>

Code for situation two:

<VSCodeDropdown name="onOverVoltage" value={onOverVoltage} onChange={onChange} position="below">
  <VSCodeOption value="0">{`generation 1`}</VSCodeOption>
  <VSCodeOption value="1">{`resistor 2`}</VSCodeOption>
  <VSCodeOption value="2">{`side 3`}</VSCodeOption>
</VSCodeDropdown>

After pressing ctrl + s for the first time in the second situation, the value is changed to 2, which is quite strange.

VS Code version: Code 1.76.0 (92da9481c0904c6adfe372c12da3b7748d74bdcb, 2023-03-01T10:22:44.506Z) OS version: Windows_NT x64 10.0.22621 Modes: Sandboxed: No

System Info |Item|Value| |---|---| |CPUs|AMD Ryzen 5 PRO 5675U with Radeon Graphics (12 x 2296)| |GPU Status|2d_canvas: enabled
canvas_oop_rasterization: disabled_off
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_renderer: enabled_on
video_decode: enabled
video_encode: enabled
vulkan: disabled_off
webgl: enabled
webgl2: enabled
webgpu: disabled_off| |Load (avg)|undefined| |Memory (System)|14.80GB (6.91GB free)| |Process Argv|D:\\zhzk\\projects\\motor --crash-reporter-id 9b0a2f5b-bd28-48bb-b9a9-e61fa8ceae90| |Screen Reader|no| |VM|0%|
Extensions (21) Extension|Author (truncated)|Version ---|---|--- vscode-eslint|dba|2.4.0 c-cpp-runner|fra|5.2.1 go|gol|0.38.0 vscode-language-pack-zh-hans|MS-|1.76.2023030809 isort|ms-|2022.8.0 python|ms-|2023.4.1 vscode-pylance|ms-|2023.4.40 jupyter|ms-|2023.2.1200692131 jupyter-keymap|ms-|1.1.0 jupyter-renderers|ms-|1.0.15 vscode-jupyter-cell-tags|ms-|0.1.8 vscode-jupyter-slideshow|ms-|0.1.5 cmake-tools|ms-|1.14.30 cpptools|ms-|1.14.5 cpptools-extension-pack|ms-|1.3.0 hexeditor|ms-|1.9.11 tcl|ras|0.1.0 markdown-preview-enhanced|shd|0.6.8 cmake|twx|0.0.17 vscode-lldb|vad|1.9.0 markdown-all-in-one|yzh|3.5.1 (1 theme extensions excluded)
A/B Experiments ``` vsliv368cf:30146710 vsreu685:30147344 python383cf:30185419 vspor879:30202332 vspor708:30202333 vspor363:30204092 vslsvsres303:30308271 vserr242:30382549 pythontb:30283811 vsjup518:30340749 pythonptprofiler:30281270 vsdfh931cf:30280410 vshan820:30294714 vstes263cf:30335440 vscorecescf:30445987 pythondataviewer:30285071 vscod805cf:30301675 binariesv615:30325510 bridge0708:30335490 bridge0723:30353136 cmake_vspar411:30581797 vsaa593:30376534 pythonvs932:30410667 cppdebug:30492333 vsclangdc:30486549 c4g48928:30535728 dsvsc012cf:30540253 pynewext54:30695312 azure-dev_surveyone:30548225 nodejswelcome1cf:30587006 282f8724:30602487 pyind779:30671433 f6dab269:30613381 pythonsymbol12:30671437 a9j8j154:30646983 6233i204:30672705 azdwalk:30721579 pythonms35:30701012 pythonfmttext:30716742 ```
hawkticehurst commented 1 year ago

Hey @xiaoshuai-tw, thanks for the bug report!

Could you provide some more details/context? I don't think I have enough information to fully grasp what the issue is at this point. For example, it would be very helpful to know what the onChange function does and also what your code for capturing ctrl + s keystrokes looks like.

In general, if you could provide a link to a GitHub repo with a small reproduction of the issue that would be extremely helpful for me to assess what's going on :)

wang-xiaochong commented 1 year ago

Hey @xiaoshuai-tw, thanks for the bug report!

Could you provide some more details/context? I don't think I have enough information to fully grasp what the issue is at this point. For example, it would be very helpful to know what the onChange function does and also what your code for capturing ctrl + s keystrokes looks like.

In general, if you could provide a link to a GitHub repo with a small reproduction of the issue that would be extremely helpful for me to assess what's going on :)

The following link is a demo that reproduces the bug in the VSCode-dropdown component. Please refer to the README.md to reproduce the bug. We are hoping for a prompt fix and response. Thank you! https://github.com/xiaoshuai-tw/vscode-dropdown-bug-demo