Chrome network tab not showing the full url on hover - google-chrome-devtools

Earlier when i used to hover on a request in network tab, the tooltip used to show the full url, but i am not able to do that now. is there any way to enable it:

Open network panel settings (the second cog more to the right on your screenshot) and check/uncheck "Use large request rows". After that the URL preview on hover started to magically work for me again (I had the same problem). If not, you can at least keep the large rows on as a last resort.

Related

VSCode Setting (Does it exist)

When I perform a deploy or retrieve operation in VSCODE the result of the operation will make the panel that shows the output appear. I perform deploy and retrieve operations frequently since I use the "deploy on save" functionality. Is there a setting that will prevent that panel from showing up if the result of the operation is a success? Basically I only want the panel to show up if there is an actual problem that needs my attention/focus.
The below image shows the panel I am referring to circled in blue. The panel covers my code and requires that I manually click a button to rehide it.
I've tried turning the panel off in the "VIEW" settings but that doesn't work.
I've tried resizing it so that the height is very small but that is equally as annoying when I actually need to open the panel to use the terminal or review errors from the deploy/retrieve.
Is there a setting in VSCode that will prevent that panel from showing when the operation is successful?
NOTE: For every retrieve/deploy there is a dialog box that says if the operation was a success or failure. So not having this panel show will not prevent the user from knowing how the operation resulted

Do not show user input in console autocomplete

Recently, I have noticed that Google Chrome's JavaScript console autocompletes previously inputted commands. For example:
I want to remove this feature because the autocomplete displays variables that may not exist. Is there a way to remove this feature?
Yes. A lot of people found it annoying, so they added a setting to disable it.
First, enter the DevTools settings from the menu button in the top right corner.
Then, in the "General" section, disable "Autocomplete from history".

Can't find background image

I might be a bit dumb or something, but I just can't find the background image of the site:
http://www.deineschatzkammer.com
Can anyone find it or tell me how to find it easily? I have searched now with the Chrome DevTools and Firebug and searched the code for GIFs, JPGs and PNGs... :(
It is very easy to find the background image. Here are three solutions how to find it using Firebug (it works similar in the Chrome and Firefox DevTools):
Via the CSS panel
Switch to the CSS panel.
Type jpg into the search field.
Hover the matched url(...) to see a preview of the image.
If it's not the right one, hit Enter and repeat step 3.
Via the HTML panel
Right-click the background image and choose Inspect Element with Firebug from the context menu to see the element within the HTML panel.
Switch to the Style side panel.
Check whether one of the rules contains a background-image property.
If there isn't a background-image property containing the related image, this means the element containing the image is overlayed by the one you just inspected. So delete the element by pressing Del on the selected element or right-clicking it and choosing Delete Element from the context menu. Then repeat step 3.
Via the Net panel
Enable and switch to the Net panel.
Reload the page.
Click on the Images filter.
Hover over each listed image to find the one you're searching for.

Network area (lost content)

Usually i have size/content to show you what the size of the uncompressed data when your response is getting compressed. I have seemed to have lost this on one computer. I just have "size". Does anyone know how to get this back without having to try to reinstall chrome (i have the latest version of google chrome for windows (37.0.2062.120 m (64-bit))
You have activated the compact view by clicking on the "Use small resource rows" icon.
Click on the "Use large resource rows" icon to toggle this setting (the fourth icon in the top-left corner).
Small resource rows
Large resource rows
Next time, when you get stuck with an unwanted devtools setting, you could also open the options of the devtools (gear icon), scroll down at the General tab and click on the "Restore defaults and reload" button to reset all devtools settings to their default values.

Is there a way to search/filter properties in Styles pane of Google Devtools?

On the Elements tab 'Find' functionality (cmd+F/ctrl+F) doesn't search through styles pane. Is there a way to type CSS property with HTML element selected and find it quickly in the Styles panel?
Bottom right corner, light gray text says "Find in styles". Click there and enter your search.
Unfortunately, such functionality does not exist in current Chrome Dev Tools.
But its present in Opera Dragonfly and its very handy, so, probably Chrome will copy it, eventually (but no such feature request exists in bug tracker now).
On the latest Chrome on Mac, I'm getting the filter at the top of the styles pane. I can't believe that I never noticed it given that I've needed it so many times!
Try using CTRL+Shif+F on the Elements tab