Dev tools inspect keyboard shortcut conflicts with Notes

tomica

When Dev Tools are open, ~~Ctrl+Shift+D~~ Ctrl+D should activate the 'Element select' functionality. Instead, it triggers creating an empty Note in Vivaldi. How do I prevent this?

Pesala

@tomica Here, it toggles the layout of Dev Tools from side to bottom.

What is your Vivaldi and OS version? Are the dev tools docked or floating?

tomica

@Pesala said in Dev tools inspect keyboard shortcut conflicts with Notes:

Are the dev tools docked or floating?

@Pesala sorry for forgetting to mention:

Vivaldi 3.7.2218.52 (Stable channel) (64-bit)
Revision a466b7f17805f4e7b50302de5efa2a46eb62ba13
OS Linux
JavaScript V8 8.9.255.24
User Agent Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/89.0.4389.116 Safari/537.36
Command Line /usr/bin/vivaldi-stable --flag-switches-begin --flag-switches-end --origin-trial-disabled-features=SecurePaymentConfirmation --save-page-as-mhtml
Executable Path /opt/vivaldi/vivaldi
Profile Path /home/tomica/.config/vivaldi/Default

My Dev Tools are docked, to the bottom, if it matters. Also, I just realised my mistake. I mean to say 'Ctrl+D', not 'Ctrl+Shift+D'. I'll correct this in the original post.

Pathduck

Isn't Ctrl+D "Create Bookmark"? At least on English layouts?

I suggest you remove or remap the Create Note hotkey and map Inspect Element to Ctrl+Shift+C, that way it also works without DevTools being open.

luetage

@Pathduck What it is no one can say, since shortcuts can be set freely. What cannot be done is assigning one shortcut to two commands. It’s all about knowing how to assign shortcuts and how to look up shortcuts. Unfortunately the menu sometimes shows default shortcuts when new ones have been assigned already.

Pathduck

@luetage I think the big problem is that some of the hotkeys used in the (Chromium) Devtools that developers have become accustomed to conflicts with some of Vivaldi's default ones. It's also confusing to some that what hotkeys are enabled depend on what has the current input focus; Vivaldi or Devtools.

Of course, the Chromium team are able to dictate the exact hotkeys that are available to make sure there are no conflicts. The Vivaldi team does not have this luxury as its users are free to choose whatever shortcuts we want. And since Devtools is still a part of the Chromium UI there is no way for Vivaldi to check for a conflict or override the default Chromium hotkeys.

The advantage Vivaldi gives us by the ability to set our own hotkeys by far outweighs the slight drawback of a couple of hotkey conflicts between the Chromium and Vivaldi UIs.

Anyway, if someone is a developer they are expected to be able to adapt to changing circumstances and change the settings according to their own preference

luetage

@Pathduck What if they mainly code c++?

Pathduck

@luetage Then they are in double trouble ...
(sorry)

And what are they doing in a browser devtools anyway

luetage

@Pathduck abusing wasm probs :p

tomica

@Pathduck so I've made a total mess of this post. I failed to double check the exact command, so here's the correction of my problem description.

Steps to reproduce

I open Devtools by pressing 'Ctrl+Shift+I' (Devtools open no problem);
I press 'Ctrl+Shift+C', which is Devtools shortcut for 'Select element to inspect'.

What should happen

The Devtools 'Select element to inspect' should be toggled on.

What happens instead

By default, instead of toggling on 'Select element to inspect' in Devtools, Vivaldi's new Note is created (presumably because the keyboard's focus was not shifted from main Vivaldi viewport to Devtools);
If I disable Vivaldi's default shortcut for new Note, then nothing happens.

Note

If between steps 1. and 2. I click with mouse anywhere within the Devtools, and then try 'Ctrl+Shift+C', then the 'Select element to inspect' tool is properly toggled on and everything works fine; This leads me to believe that the main issue is not switching keyboard focus from Vivaldi's main window over to Chrome Devtools.

Pathduck

@tomica I agree, I think the focus is not shifted from the Vivaldi UI to the Devtools, so none of its hotkeys work as expected.

You could always report it as a bug I guess, I doubt anything will happen any time soon, but maybe.

What I've done is mapped the Element Inspect to Ctrl+Shift+C in Vivaldi and it works OK, only problem is that pressing it again will actually close the Devtools instead of just toggling it off - again depending on where input focus is.

tomica

@Gwen-Dragon what exactly works in Chromium 89?

bjarteao

@tomica How did you map the Element Inspect to CTRL+SHIFT+C?

I cannot find Element Inspect anywhere in the keyboard shortcuts setup, only these related settings:

tomica

@bjarteao I didn't. CTRL+SHIFT+C is the default keyboard shortcut for toggling the 'Select element' tool. To confirm this:

Open DevTools;
Hover over the "Select element to inspect" button (that's the very first button in DevTools top left, looks like dotted square with inward pointing arrow over it)
Observe the tooltip.

The tooltip says "Select an element in the page to inspect it - Ctrl+Shift+C".

bjarteao

@tomica Sorry, I replied to the wrong comment.

I meant to ask @Pathduck how they achieved this: "What I've done is mapped the Element Inspect to Ctrl+Shift+C in Vivaldi"

I thought that meant a keyboard shortcut that replaces this action

Right-click on element to open context menu → Developer Tools → Inspect

But when I read the text again, I guess it is just after you open Dev Tools with F12 that you can use Ctrl+Shift+C

bjarteao

To get Ctrl+Shift+C to work the Chromium way in Vivaldi, by the way, you have to disable the Vivaldi keyboard shortcut for "Create new note".

Pathduck

@bjarteao said in Dev tools inspect keyboard shortcut conflicts with Notes:

To get Ctrl+Shift+C to work the Chromium way in Vivaldi, by the way, you have to disable the Vivaldi keyboard shortcut for "Create new note".

That's about right.

faberv

Btw. in my Vivaldi settings, this keyboard shortcut is called "Toggle Developer Tools" (little confusing):

felagund

@bjarteao said in Dev tools inspect keyboard shortcut conflicts with Notes:

To get Ctrl+Shift+C to work the Chromium way in Vivaldi, by the way, you have to disable the Vivaldi keyboard shortcut for "Create new note".

Hm, does it? For me there is no "Create new note shortcut" and SHIFT+CTRL+C is assigned to "Copy Text to Note", however in dev tools, it does activate the Inspect Element Mode. Therefore it behaves as it should. Maybe something has changed? Edit: Aha, it works only if devtools are undocked!

The only gripe I have is that I cannot assign a shortcut to action "open devtools in Inspect Element Mode" and even with unsetting SHIFT+CTRL+C, it does not open devtools in Inspect Element Mode.

Edit: oh, it works, there is "Toggle Developer Tools" option in shortcuts, as per https://forum.vivaldi.net/topic/66223/add-an-option-to-assign-shortcut-for-inspecting-an-element

Also, this thread has more info about this: https://forum.vivaldi.net/topic/23148/ctrl-shift-c-does-not-work-in-devtools/21

* Inspect Element Mode is Select element to inspect