How can I change the docking of devtools in VS Code? - visual-studio-code

VS Code was docking devtools pane within the window before. Now, It opens a new window that increases back and forth. Is there any way to dock it back? I tried a few settings they did not work. Also, there is no dock icon as in Chrome.

This started with vscode v1.74 and is an electron bug. See The developer tools become a floating window.
There is a fix reported there. Disable the setting
Windows > Experimental > Windows Control Overlay: Enabled
You will be prompted to restart vscode and then opening the Dev Tools will be docked as before. Apparently, the Electron bug has been fixed.

In the devtools panel, click the vertically-aligned three dots at the top right. That will open up a context menu. You will see a "Dock side" entry with different icons signifying option values for that setting. You probably accidentally clicked the one that makes it pop the devtools out into its own window. Select whichever option you actually want there.

Related

visual studio code maximize button doesn't work windows11

i cant resize window using maximize icon
It is a reported issue, see Maximize/restore button is not responsive when Window Controls Overlay is enabled.
You can try disabling this setting (although it is disabled by default in Stable v1.71) to see if it helps:
Window > Experimental > Window Controls Overlay: Enabled
I am using windows 11 as well, and I just recently updated my vs code to the latest version.
I will use pictures to explain my solution
1. Go to settings
2. Search for overlay in the settings page
3. Uncheck the checkbox below and restart vs-code
have you tried the F11 button? or the combination of CTRL + k -> Z
Bye

Chrome dev tools upper console automatically closes bottom console/cannot move to bottom/top

I have somehow managed, that my console tab is locked in Chrome dev tools and I am not able to open console in top windows simultaneously with bottom console. It automatically collapses the opposite console tab and I cannot even right click and move to bottom/top.
I think, I used some shortcut accidentally, but cannot find how to reverse this behavior.

How to close a floated developer tools on Mac

I have the developer tools floated to be a separate window.
It nows takes the entire screen.
I did lots of research to see how to close it, but found nothing related.
Most of the posts are about how to open it.
(I tried CMD + option + i / F12, neither one works).
Also, I wonder how to dock it back into the page. I do not see such
an option under the "..." on top right corner.
Command+Shift+D (Mac) or Control+Shift+D (Windows, Linux) restores the DevTools window back to whatever position you had it in before you undocked it.
You can also change the docking position by opening the Command Menu, typing Dock, and selecting the option you want.
You can also access these options from DevTools's Main Menu. Note: It sounds like you were looking for the options in Chrome's main menu. You won't find any DevTools options there, other than the option to open DevTools.

Is there a way to open Chrome Dev tools to a new window right away?

Anyone know of a way to open Chrome Dev tools to a new window upon open?
I know that I can click F12 and then click the 'customize' button and change orientation or pop out the dev tools window. But that's an extra step, and often a window resize is necessary, and when you do it 50 times a day, it gets to be tedious.
Also, sometimes, on pages I'm testing, pressing F12 will change the layout of the elements on the page and even popping out the dev tools leaves the page layout different than before I opened dev tools. This can make it hard to tell if an element is visible or not, which makes troubleshooting Webdriver more difficult.
Ideally, CTRL+F12 or something to open dev tools as a separate window would be super handy. (to any Chromium devs that might be listening ;) But if anyone has another solution, I'd love to hear it.
If you have your DevTools un-docked, the dock mode, size and position of your DevTools window will remain the same as you previously set it. For example, I just set mine to be maximised on my other monitor. Every time I open up DevTools, it's an un-docked, maximised window, and there's no change to the layout of the inspected window other than the fact it's no longer in focus.
You could alternatively launch Chrome using the --auto-open-devtools-for-tabs flag, which will automatically open DevTools in the dock mode, size and position you had it previously. You can use:
Mac:/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --auto-open-devtools-for-tabs
Windows: "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --auto-open-devtools-for-tabs
In WebDriver, you can set flags for how Chrome opens. However, after looking into this further, it turns out Chrome currently do not support multiple clients connected to the protocol simultaneously.
As for speeding things up, you can switch between dock positions with Cmd+Shift+D (Mac) or Ctrl+Shift+D (Windows). This toggles between the last two modes you have used, so say you have it docked at the bottom, you then pop it out, using the shortcut now will toggle between the two.
Here's how you do it. On opening the developer tools, with the developer tools window in focus, press F1. This will open a settings page. Check the "Auto-open DevTools for popups".
Originally documented here -- https://newbedev.com/automatically-open-chrome-developer-tools-when-new-tab-new-window-is-opened.

Eclipse Dialogs Have No Title Bar and Can't Be Moved in Gnome 3

I just installed Eclipse from the Android website and the dialogs have no title bar and seem to be docked at the top of the Eclipse main window. I can't find a way to move them or get the titlebar back. I'm using Gnome 3 as desktop/window manager.
For example, if I choose Search | File... from the main menu, it comes up, but without titlebar. If I press Alt+F7, I can move the entire window, but the dialog will not move relative to the window.
How do I fix this?
Thx.
You are missing an important information, your operating system and desktop environment. Let me guess? Linux/Gnome? Or Cinnamon?
Gnome has the, erm, great feature to attach modal dialogs at the main window.
You can install dconf-editor and set the key org/gnome/shell/overrides/attach-modal-dialogs to false.
In Cinnamon you can easily disable this feature in the System Settings > Windows > Attach dialog windows (may not be the actual text as I translated it from my locale). You need to switch the settings to Expert mode to see the Windows entry.