Questions tagged [google-chrome-devtools]
The Google Chrome DevTools is a set of developer tools integrated into Google's Chrome browser. Use this tag for questions related to the usage of Chrome's Developer Tools.
154
questions
0
votes
0
answers
23
views
Open Chrome DevTools command menu with single shortcut in macOS
On macOS, you can open the DevTools and then press Command+Shift+P to open the command menu. But is it possible to open the command menu without having to first open the DevTools?
- 185
2
votes
2
answers
28
views
Chrome HAR logs - does collection only start when the Network tab is opened?
We're troubleshooting something that needs the Chrome HAR log collected. Just to confirm the timing, it appears that we have to press F12 and switch to the Network tab BEFORE we do anything of ...
- 5,523
0
votes
0
answers
47
views
Downloading video from JoVE (Journal of Visualized Experiments)
I'm trying to download this video from JoVE; to do so I used the developer tools (Network --> Media), but, when I play the video, no information are available there.
How can I download it without ...
- 944
0
votes
0
answers
11
views
Chrome DevTools pages dark theme
Is there way for the devTools pages (chrome://inspect) to use the dark theme ?
Chrome is Dark, my DevTool is dark but not theses few pages.
- 338
0
votes
0
answers
51
views
Is there any way to export a file from Chrome's local storage?
So I have save file of an HTMl based game in Chrome's local storage,which I can easily find in Application bar in developer tools. So is there any way to export that file from local storage?
0
votes
0
answers
27
views
How to programmatically change viewport dimensions (like DevTools can?)
When viewing a website in Devtools with the Responsive Viewport, you can customize the screen dimensions in pixels. Is this accomplished on the browser end according to CSS/JS rules? , or are the ...
- 188
1
vote
0
answers
94
views
Did Chrome max_old_space_size parameter stop working?
Some years ago, it was possible to start Chrome or Chromium based application with a --js-flags="--max_old_space_size=8196" parameter and pass beyond the default 2GB or 4GB heap limit. For ...
- 1,060
1
vote
1
answer
65
views
Google Chrome: persist devtools setting per site
Is it possible to get Google Chrome's Devtools to apply the "Rendering" feature "Enable automatic dark mode" automatically, for a given list of websites?
One potential problem is ...
- 61
0
votes
0
answers
41
views
How to pick DOM elements in inspector if they have low Z-index using Firefox or Chromium dev tools?
When I open the inspector pane via Shift-Ctrl-C and click somewhere on the page, it selects that element in the DOM tree, but if that element is masking a dozen other elements with lower z-index, I ...
- 15
-1
votes
1
answer
101
views
Google Chrome UI Turned Black Randomly, but the hovering UI is still there and any new windows I open still work
I was in middle of watching a movie on Google Chrome in fullscreen, and suddenly my whole screen turned black. This just happened to me yesterday, and I fixed it by resizing my window that time, so ...
0
votes
1
answer
351
views
Some remote addresses missing from chrome developer tools
For example, if I go onto the quantum computing stack exchange, lsof lists stackoverflow.com, with the ip address of 198.252.206.25. Or if I go onto reddit, it lists ec2-52-87-69-120.compute-1....
- 73
2
votes
0
answers
315
views
How Can I Have the Chrome Development Drawer, Network Panel, to autoscroll along with new lines?
Up to yesterday, the Network Panel of Chrome's Development Drawer would display the new http requests, and the scrolling handle would stay at the bottom of the scrolling guide. The image linked below ...
0
votes
1
answer
63
views
Get the list of all hostnames a website fetches resources from
My VPN service allows me to black/ or whitelist certain hostnames. If for example I want to connect to Youtube not through VPN I need to add to my list not only the youtube's main domain but also a ...
- 101
0
votes
1
answer
626
views
Simple code worked in Chrome DevTool but not in TamperMonkey
Foreword: I am amateur, just trying to make my own js script to make some task easier on myself.
I'm using and learning JavaScript.
The code(s) I've tried:
window.history.go(-1);
history.back
What I ...
- 3
2
votes
0
answers
732
views
Chrome overrides only work when DevTools panel is open
I would like to remove a particular result from the Google Image Search page. To do that I have the following code:
const path = "//h3[contains(text(),'بیاموز')]";
const matchingElementSet = ...
- 51
1
vote
1
answer
178
views
Prevent Chrome Recorder devtool from refreshing the page
I'm starting to use Chrome's new "Recorder" devtool. It's really nice; however, I don't like that it starts the automation by refreshing the page. Is there a way to prevent this behavior? I ...
- 263
0
votes
1
answer
65
views
Find Network Request on Site Given Known Text
So, I have a website I'm interested in writing an API for. I go to the Network tab under dev-tools to find the API call, but am not finding it given that there's just a lot.
Is there a way to find a ...
- 121
2
votes
0
answers
2k
views
How to add a Authorization header into a HTTP request by using Chrome Dev Tools?
Is there a way to add a token into my HTTP request without using Postman or cURL?
- 121
1
vote
2
answers
2k
views
How to set custom zoom in Chrome developer tools Device Toolbar?
I have custom screen sizes set up in my Chrome dev tools, but the zoom levels for how big the screen appears are limited to: 50%, 75%, 100%, 125%, 150%, Fit to window
Is there a way to add custom ...
- 331
3
votes
1
answer
47
views
Source of animation in Chrome tab between favicon and title?
I recently noticed this small animation appearing in Chrome tabs while testing a web app I'm working on. It appears and disappears while the page is loaded and I assume it indicates Ajax activity ...
- 2,510
0
votes
0
answers
28
views
Replace command isn't working on console for Chrome 92.0
I wanted to use replace command for my code but I'm getting two different output in two different version of chrome.
var v = "[\"P10033592\",\"P10057941\"]"
v.replace (/\...
- 1
4
votes
1
answer
1k
views
Is there any way to keep the Payload tab open in Chrome's network inspector?
Am using a graphql endpoint, so to find out what the operation was, I need to see the payload. However, now that said payload is in a new tab, I have to reselect it every time I check another fetch ...
- 41
0
votes
2
answers
83
views
How can i open DevTools from my pc in my android?
I'm wondering how can I open DevTools from my Windows PC in my android phone? is this possible?
EDIT: My question was not clear enough, an example of what I want is: I open a DevTools on a page (Using ...
1
vote
0
answers
426
views
Is it possible to disable tab pinning in Chrome? Or prevent pinned tabs from loading when I open Chrome, until I click on them?
I use a productivity extension that can be bypassed via pinned tabs on Chrome launch.
So I'd like a way to disable pinned tabs, or alternatively prevent pinned tabs from loading when Chrome opens, at ...
- 11
0
votes
0
answers
205
views
Google Chrome Dev Tools keeps popping up on refresh
On every page refresh in Google Chrome, the Dev Tools keeps popping up. I have to manually press Esc each time. Also, I have already tried the settings suggested by some of the other people like below,...
- 121
0
votes
1
answer
1k
views
How do I start Chrome or Edge in a new isolated window with DevTools open?
Sometimes I want to open Chrome or Edge just to access its JavaScript console for a quick scripting experiment, similar to that in Node/Deno REPL mode.
I don't want to use F12 with a currently open ...
- 2,663
1
vote
1
answer
905
views
How to disable zoom (ctrl + scroll wheel) in chrome dev tools?
I want to disable zooming in and out chrome dev tools when I hold ctrl and scroll. One way is to completely disable this action from mouse settings for all applications but that I don't want.
Can I ...
- 237
0
votes
1
answer
72
views
Is there a shortcut key or an extension that can active specific Google Chrome devtool panel?
This is a Chrome devtool, there are some panels in it... "Network", "Console","Sources","Elements",
Is there any shortcut key or extension that can active ...
- 145
14
votes
1
answer
1k
views
Chrome DevTools - Network - Remove overview time filter
Once you click, and thereby filter, on the network timeline overview, I cannot find a way to undo the filtering.
When double clicking, it increases the filter to all, but subsequent requests won't be ...
6
votes
3
answers
8k
views
Is there a shortcut for opening the dev tools Network tab in Chrome?
I want to know if there is a shortcut for opening the Network tab in dev tools in Chrome. I know there is a shortcut for opening dev tools and the Console tab, but not for opening the Network tab.
...
- 163
0
votes
1
answer
222
views
How can I copy a list of class attributes as a CSS selector from Chrome's Elements tab?
I'm copy/pasting a lot of class attributes from the HTML of a web page from the Elements tab in the Chrome Dev Tools like
<label class="s-label mb4 d-block" for="wmd-input">
...
23
votes
2
answers
4k
views
Chrome Dev Tools Color Picker Contrast Ratio not showing up
According to the dev tools docs, you can view the contrast ratio of a text element in the Color Picker as of Chrome 65 - January 2018
However, sometimes the functionality appears buggy, as identified ...
- 5,782
0
votes
0
answers
70
views
Chrome terminal offset so can't see what I'm typing
I have this issue where I have only half a text showing when I'm typing.
How to fix?
- 611
2
votes
1
answer
452
views
How do I change Chrome's formatted indent spacing from 4 spaces to 2 spaces?
The feature: Chrome > Dev Tools > Sources > {page}:formatted
default tab indent is 4 spaces, can I change it two 2? How do I configurate it?
Thanks
- 387
2
votes
0
answers
342
views
How to intercept a flash game's network traffic that doesn't show up in chrome's developer tools
Go to fairgocasino.com in chrome and open any game (let's take for example the first slot in alphabetical order, "5 Wishes"). Open the network tab of developer tools with rightclick -> Inspect -> ...
- 131
1
vote
1
answer
165
views
What's the keyboard key of defocus in address bar in Google Chrome?
I was using extensions like Vimium, Saka Key( to use only keyboard to control web browser )
sometimes, I want to leave focus, in the current tab,
so that I can active those extensions with keyboard ...
- 145
103
votes
6
answers
193k
views
Google Chrome DevTools failed to parse SourceMap: chrome-extension
I am developing on Rails5 with jQuery. All of a sudden, this afternoon, I started getting these messages in my DevTools console. It happens even running DevTools under StackOverflow. I cleared ...
- 1,227
0
votes
1
answer
255
views
Rearranging Panes in Chrome Dev Panel
When Chrome's dev panel is placed on either side of the screen and is not too wide, this is how the panel looks:
I particularly like how the Styles pane and the Computed pane are side by side. For ...
- 729
3
votes
1
answer
400
views
Chrome (Brave) DevTools Sources Panel missing JS colors and tooltips
Suddenly my Brave app's Dev Tools Sources Panel is missing colors and tooltips for JavaScript files.
Here's what I see in Brave:
Here's that same file JS file on the same breakpoint in Chrome, ...
- 353
1
vote
0
answers
159
views
How can I purposely freeze the page at start in google dev tools?
I want to watch what happens the moment my page starts loading. How can I pause the page immediately? (before any js)
- 685
5
votes
0
answers
2k
views
Set Unique proxy per tab in chromium
I am trying to customize chromium-browser such that each tab in the browser has a unique proxy, so connections from one tab do not appear to come from the same IP as another tab.
I used chrome.proxy....
- 51
4
votes
3
answers
2k
views
How to Enforce Dark Mode on Chrome Web Store?
All extensions are disabled on Chrome Web Store, for security reason I believe... However, I like to browse for extensions a lot and I want to save my eyes.
Is there a way to tweak some Chrome ...
- 287
0
votes
1
answer
67
views
Chrome Network Panel - Html5 Video Explanation
In Chrome Developer Tools Network Panel I see my HTML5 video (MP4). I do not understand why it shows up 4 times. What does this mean? What means section "time" and "size" in this context? It seems ...
- 1
1
vote
0
answers
41
views
Chrome Developer Tools SCSS Syncing
When I add a workspace in chrome developer tools it links the css file I'm using but not the scss file it is generated from. No source map file is generated either. However when I compile the scssfile ...
- 11
32
votes
2
answers
12k
views
How do I dismiss the "Drop HAR files here" box in Chrome network panel?
My Chrome console's network panel has become unusable today because it keeps getting overlaid with a drag/drop UI for HAR files. How do I dismiss it, or turn this feature off? Never encountered this ...
- 421
0
votes
1
answer
402
views
Atom is always opening developer console.How could i disable it
I installed atom text editor and compeleted a project.But now,i cant open my project.Its always opening chrome dev tools/debugging console in atom.I uninstalled it and install is again.But its not ...
- 1
0
votes
1
answer
2k
views
Headless Chrome hangs when trying to print page as PDF
At our organization we use headless-chrome for converting web pages into PDFs.
We have a special Java application for that, that uses the following CDT client for launching the chrome instances and ...
- 3
2
votes
1
answer
3k
views
Chrome dev tools not showing on Mac
Whenever I try to open the dev tools in Chrome, nothing seems to happen.
I've tried right-clicking the window and opening it from the drop down menu, opening it from the "more tools" menu found in ...
- 21
1
vote
1
answer
8k
views
Chrome Developer Tools - Network "Content Download" column
I've got a question about the Chrome Developer Tools - Network Tab - "Content Download" part in the waterfall column. What exactly does this mean? Is latency somehow relevant to this?
Retrieving ...
- 11
5
votes
0
answers
10k
views
Modifying Page files - "Changes to this file were not saved to file system"
When you open google chrome devtools, and go to Sources and look at the files under Page, how can you modify them and observe changes?
To be more specific, I want to modify some files inside top/...
- 151