Devtools Feature request: keyboard shortcut for Dev tools -> Elements panel search inputs

%3CLINGO-SUB%20id%3D%22lingo-sub-2077915%22%20slang%3D%22en-US%22%3EDevtools%20Feature%20request%3A%20keyboard%20shortcut%20for%20Dev%20tools%20-%26amp%3Bgt%3B%20Elements%20panel%20search%20inputs%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-2077915%22%20slang%3D%22en-US%22%3E%3CP%3EI%20would%20like%20to%20see%20keyboard%20shortcuts%20for%20Search%20HTML%2C%20Filter%20Styles%20and%20Filter%20Styles%20inputs%20(under%20Computed%20styles).%20Its%20a%20pain%20to%20back-forth%20mouse%20to%20keyboard%20and%20vice-versa%20just%20to%20focus%20search%20filter%20inputs%20in%20Styles%20%26amp%3B%20Computed%20panels%20and%20Search%20HTML%20and%20then%20type%20the%20search%20term.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20image-alt%3D%22edge-elements-panel-styles-input-focused.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F247706iEF5C0D1D96513270%2Fimage-size%2Fmedium%3Fv%3D1.0%26amp%3Bpx%3D400%22%20role%3D%22button%22%20title%3D%22edge-elements-panel-styles-input-focused.png%22%20alt%3D%22edge-elements-panel-styles-input-focused.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20image-alt%3D%22edge-elements-panel-computed-input-focus.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F247707iCA0B7B9EE365AFB8%2Fimage-size%2Fmedium%3Fv%3D1.0%26amp%3Bpx%3D400%22%20role%3D%22button%22%20title%3D%22edge-elements-panel-computed-input-focus.png%22%20alt%3D%22edge-elements-panel-computed-input-focus.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EIt%20would%20greatly%20increase%20the%20developer%20experience%20if%20there%20are%20keyboard%20shortcuts%20to%20those%20panels.%20IMHO%2C%20edge%20can%20gain%20many%20developers%20if%20they%20focus%20on%20giving%20better%20developer%20experience%20by%20making%20such%20small%20(but%20inherently%20valuable)%20features.%20At-least%2C%20I%20would%20be%20immediately%20switch%20to%20edge%20if%20edge%20team%20gets%20this%20feature%20built-in.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EIn-fact%20if%20there%20are%20keyboard%20shortcut%20to%20toggle%20between%20HTML%2C%20Styles%2C%20and%20computed%20panels%20that%20would%20also%20do%2C%20because%20then%20it%E2%80%99s%20easier%20to%20tab%20to%20filter%20inputs%20in%20respective%20panels.%20Currently%20a%20dev%20has%20to%20hit%20Tab%20key%20several%20times%20to%20reach%20the%20filter%2FStyles%20panel%20from%20the%20HTML%20panel%20or%20Computed%20styles%20panel%20which%20of-course%20is%20much%20time%20consuming%20then%20grabbing%20the%20mouse%20and%20clicking%20in%20the%20inputs%20(which%20as%20described%20is%20a%20pain).%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EI%20hope%20some%20developer%20advocate%20like%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F470968%22%20target%3D%22_blank%22%3E%40MissyQ%3C%2FA%3E%26nbsp%3B%3CSPAN%3Etakes%20notice%20of%20this%2C%20also%20awaiting%20any%20feedback%20regarding%20this%20suggestion.%3C%2FSPAN%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EThanks%3C%2FP%3E%3C%2FLINGO-BODY%3E
New Contributor

I would like to see keyboard shortcuts for Search HTML, Filter Styles and Filter Styles inputs (under Computed styles). Its a pain to back-forth mouse to keyboard and vice-versa just to focus search filter inputs in Styles & Computed panels and Search HTML and then type the search term.

 

edge-elements-panel-styles-input-focused.png

 

edge-elements-panel-computed-input-focus.png

 

It would greatly increase the developer experience if there are keyboard shortcuts to those panels. IMHO, edge can gain many developers if they focus on giving better developer experience by making such small (but inherently valuable) features. At-least, I would be immediately switch to edge if edge team gets this feature built-in.

 

In-fact if there are keyboard shortcut to toggle between HTML, Styles, and computed panels that would also do, because then it’s easier to tab to filter inputs in respective panels. Currently a dev has to hit Tab key several times to reach the filter/Styles panel from the HTML panel or Computed styles panel which of-course is much time consuming then grabbing the mouse and clicking in the inputs (which as described is a pain).

 

I hope some developer advocate like @MissyQ takes notice of this, also awaiting any feedback regarding this suggestion.

 

Thanks

2 Replies
Thank you so much for the feedback! I have submitted this feature request to our team. Would you mind telling me a little more about how often this feature would be helpful and what types of tasks you are working on that would benefit from this change the most?
Hi,
First thanks for taking note of this.

How often this feature would be helpful?
I am web developer so this feature would be useful most of the time when I designing a website or developing a web application,

What type of tasks you are working on would benefit from this feature?
As stated, I am web designer/developer so when designing websites or developing a web application would be when using this feature.

Thanks