Using Chrome dev tools, how to get exact screenshot at exact time to share
Open devtools-on-devtools:
switch devtools docking mode to a separate window in the devtools settings three-dot icon.
(when this option is activated you can use CtrlShiftD to toggle docked/undocked state)
invoke devtools-for-devtools by pressing CtrlShifti in windows or ⌥⌘I in mac when devtools window is focused
Now, in this new devtools-for-devtools window:
open Application tab
expand/open Frames - top - Images
click any image URL on the left to view it
right-click the image itself and choose Save
repeat 3-4
To find the URL of currently shown screenshot:
click the corresponding green bar in Frames strip under screenshot thumbnail strip
use element selector CtrlShiftC in devtools-for-devtools and click the mini-screenshot at the bottom of the main devtools window
now devtools-for-devtools will show <img> element in the Elements tree, rightclick its data:image/png and Open in Application panel, then save it.
Related
When i hide the inspector window (normally shown on the right side of Xcode) and hover to the right edge of the Xcode Window, the inspector window automatically slides in. How can i prevent xcode from doing this and hide the inspector window permanent?
That is a normal behavior when you use Xcode in full screen mode. If you do not want the inspector to appear on hover, don't use full screen mode. (If you don't like this feature, file an enhancement request with Apple.)
When I am debugging frontend work, I frequently have multiple Inspector windows open at the same time, each inspecting a different page. As I change Inspector windows, I would like the displayed tab or window to follow me. In other words, I would like the browser to always automatically change to the page I am inspecting; I do not want to change Inspector windows, then go to the browser and find the corresponding tab or window myself.
Is this possible in Firefox? Is it possible in any browser?
(I realize I could dock the Inspector to each tab or window. I do not want to do that because I use the multiple Inspector windows side-by-side for comparison.)
While I am not aware of any way to switch to the target browser tab when selecting a given inspector window, you can certainly do it the other way around:
Say you have 3 tabs opened, and you have opened devtools for each them, in window-mode (undocked). Now, whenever you select any of these 3 tabs, if you just hit F12 (or ctrl+shift+I/cmd+alt+I), then the corresponding devtools window will be brought to the front.
That's an easy way to keep track of which devtools window is linked to which browser tab.
Now, doing this the other way around would require a new feature to be implemented. This can't really be automatic (or at least hidden behind a config of some sorts) because it could be considered frustrating to some users, having their current tab being switched away from each time they click in a devtools window.
I have filed this bug to get it done: https://bugzilla.mozilla.org/show_bug.cgi?id=1163646
I am using Firefox Developer Edition and when I had the Inspector open, which is accessed by right-clicking an item and selecting Inspect Element, I then right clicked something in the Inspector and selected Show DOM Properties, which you can see in the screenshot below:
However I cannot figure out for the life of me how to close the DOM Properties window.
How can one do this?
The feature you're referring to is called the "split console." You have it toggled on currently. It will show when a tab other than the console is selected. You can click in the split console, or command+alt+k on OSX, and hit escape to close it, or click on the console tab, or click the button in the top right of the dev tools to toggle it back off. I find it most usefull with the debugger tab. When the debugger is paused, you can access variables within the scope of the breakpoint.
Pressing escape with the DOM properties panel focused should get rid of it.
Under the View menu, there is a Full Screen entry that I would like to see on the toolbar all the time. When I enter full screen mode, the icon is automatically placed on the menu bar but then it disappears when I leave full screen mode.
[Menu] View/Toolbars/Customize... doesn't allow me to drag the icon to the toolbar
When I use Eclipse IDE, I can simply double-click the tab to put it into full screen mode - if there was a way to configure Visual Studio to do the same, that would be ideal...
On the Customize window navigate to the second tab and find the toolbar you want to edit:
Use the Add Command... option and find the fullscreen command in the View category:
Use the Move Up and Move Down to position the button where you want it.
When you go into Customise..., click on the Commands tab.
Then click the toolbar button and scroll to "Standard".
Then click Add command, then View and then Fullscreen and it should be added!
I am not able see Selenium LOGs files by clicking the Show log button present in the Selenium rc window after each time my scripts run. Are any settings needed to show the log?
The log window often appears off-screen for me, probably because I have multiple monitors. I get it into view by right-clicking on the window name on the taskbar, selecting "Move" from the context menu, and then using the arrow keys to move it into view. Once it's partly in view, I can drag it anywhere I want using the mouse.