If you have an extension that is set as the new tab provider of Chrome (e.g. chrome://newtab), then the developer tools (inspect), etc. seem to be disabled. Is there a way to enable them for debugging purposes?
Related
There's a bug on Vivaldi browser which will probably remain unfixed for the upcoming months: undocked dev tools windows do not remember their previous size across tabs, so each time you open dev tools they are small. There's also another dev tools bug which I'd like to workaround which includes focusing the dev tools window. Those bugs are driving me nuts!
So, I tried to create a Chrome extension and see if that could catch the dev tools opening event and resize the dev tools undocked window.
The first part, I've done it by using a content script which catches f12 and ctrl+shift+i and other ways of opening dev tools. Then, the content script sends a message to a background script and it should resize the opened dev tools window.
Here's the problem: there doesn't seem to be any way to get opened dev tools window in Chrome Extension API.
I can get all the opened normal windows, but from that same API (chrome.windows) I can't find opened dev tools windows.
Is there any way one can access opened dev tools windows?
I tried using chrome.devtools API but that's only accessible inside dev tools panels.
Being this a private extension which will never get published, I can also try to use chrome.developerPrivate and other private APIs, but I don't know how to make them work.
Do you have any idea on how to proceed to get all opened dev tools windows? Could it be there isn't a way?
If there isn't a way, could you maybe point me in the right direction into using private Chrome APIs in any way?
Is it possible to open Chrome Developer Tools to inspect a Chrome App ?
All debuggable targets are listed under chrome://inspect/. See the 'Apps' tab.
I managed to do it by following instructions to debug postman chrome app:
Go to chrome://flags/
Search for Debugging for packed apps
Enable this flag
Restart chrome
Then go to your app, right-click anywhere inside of it, and click on the option menu inspect.
To open it by context menu, enable at chrome://flags/#debug-packed-apps
If the app blocks the context menu, find it at chrome://extensions (developer mode) or the Apps and Extensions Developer Tool.
Is it possible for chrome dev tools to remember preferences when loading a new incognito session?
I prefer to have dev tools docked on the right - and it's annoying to constantly set this every time a new incognito instance is started.
A similar question was filed as an issue on the chromium project here: https://code.google.com/p/chromium/issues/detail?id=376788
Currently it's possible only with Chrome Canary:
DevTools will now persist your appearance preferences (docking
position, size, pane layout, etc) and devtools settings (disable
cache, etc) into the incognito window.
About the feature
Download Chrome Canary here
When you click a target='_blank' link, it naturally opens a new tab in Google Chrome. For particular sites, I need to use the Chrome Developer Tools to examine the http requests for any new tabs that are opened.
Whenever you have Chrome Dev Tools open on your current page and then click a link that opens a new tab, Chrome Dev Tools are not opened on the new page by default. Opening Chrome Dev Tools at this point is too late because the tools do not capture the http requests for the page.
Also, in many cases, these new tabs go through a series of redirects before reaching the final page, so I cannot simply reload the page after opening Chrome Dev Tools.
The only workaround I can think of is, in the case that the site I'm working on is on a local development server, I can temporarily change the link from target='_blank' to target='_self', but this is unrealistic for a site with thousands of links or for a site that I have no control over the code.
Is it possible to set Chrome Dev Tools to automatically open with every new tab (opened either manually or via target='_blank'?
I'm not sure as of which Chrome version this changed, but if you click on the Settings wheel on dev tools:
You'll see a Global section with a checkmark for "Auto-Open DevTools for popups", which works for opening target="_blank" links with a devtools window:
It's possible to auto open devtools for all the new tabs instead of just target = _blank. When launching google chrome, pass the flag --auto-open-devtools-for-tabs. It enables launching of devtools for all the windows created automatically.
For linux
google-chrome --auto-open-devtools-for-tabs
For Mac
open -a "Google Chrome" --args --auto-open-devtools-for-tabs
You can only open DevTools window via UI action or keyboard shortcut. There is no way to do this automatically.
How can I view the contents of HTML5 local storage in IE? Chrome and FireFox provide a way through their developer tools to view the contents of local storage but I couldn't find that information using IE9 developer tool.
In IE11, you can see local storage in console on dev tools:
Show dev tools (press F12)
Click "Console" or press Ctrl+2
Type localStorage and press Enter
Also, if you need to clear the localStorage, type localStorage.clear() on console.
Since localStorage is a global object, you can add a watch in the dev tools. Just enter the dev tools, goto "watch", click on "Click to add..." and type in "localStorage".
Edge (as opposed to IE11) has a better UI for Local storage / Session storage and cookies:
Open Dev tools (F12)
Go to Debugger tab
Click the folder icon to show a list of resources - opens in a separate tab