Refs: #152913

• Mac @sandy081
• Linux @deepak1556
• Windows @joyceerhl

Complexity: 4

Create Issue

Overview

Shipped a drop-in replacement for the Code Action Menu with added UI/UX changes, as well as an action bar which will show buttons to Learn more... or to Show Disabled or Hide Disabled code actions. Additionally, users can now open the refactor preview pane from the menu.

Set up:

The Custom Code Action widget and the setting to enable headers should already be enabled and set to true by default, but check the following settings:

"editor.customCodeActionMenu.showHeaders": true,
"editor.useCustomCodeActionMenu": true,

The widget can be accessed from the following places:

• Context Menu (Refactor, Source Action)
• Lightbulb
• Quickfix

Testing

Some things to take a look at:

• After opening the menu, ensure behavior of action bar items make sense (Show Disabled vs Hide disabled, or not having the button at all)
• Ensure that hovers work properly, showing how to apply changes, or what the disabled reasoning is.
• Ensure that applying code changes via the widget and attempting refactor previews work.
• Make sure that the widget is readable in all states in many different color themes

Some older test items to continue looking at:

• Opening the widget from the Context Menu. (from Refactor or Souce Action).
• Opening the widget directly from hotkeys (Ctrl + Shift + R and Ctrl + .)
• Opening the widget from the Lightbulb.
• Opening the widget from Quickfix.
• Keybindings (Esc, UpArrow, DownArrow, Enter)
• Anything going off DOM (changing window size, opening another menu, etc)