Stack Overflow
Stack Overflow

Questions tagged [google-chrome-devtools]

Chrome DevTools are the web developer tools built into Google Chrome.

Google Chrome DevTools is a set of developer tools included with the Google Chrome browser. It includes inspection, debugging, and profiling capabilities for web pages and web apps.

Chrome Developer Tools features include:

  • Device Mode: emulates various screen sizes
  • Elements Panel: HTML/CSS analysis
  • Console Panel: command line and diagostics
  • Sources Panel: debugger
  • Network Panel: page load performance
  • Performance Panel: runtime performance
  • Memory Panel: memory issues
  • Application Panel: resource monitor
  • Security Panel: security issues

Useful Links:

8740 questions
6
votes
2 answers

How to inspect element while emulating touch screen in Chrome DevTools?

I need to right click on an element and go to inspect element. I have tried to right click but since its a touch device emulator that action doesn't make sense, the dropdown doesn't appear. It works fine when i am not in the emulator mode checking…
Drmjo
  • 584
  • 1
  • 5
  • 21
6
votes
1 answer

How can I access Dart functions/variables from the Dartium DevTool Console?

In JavaScript you can access global variables and functions from the DevTool console (e.g. to call a function manually). I tried to do this in Dartium, but I always get a reference error. I tried following variations: testFunc () { return…
Simon Jentsch
  • 707
  • 5
  • 10
6
votes
3 answers

How can we know if a function is called from console or from source code

I want to know if there is a way to check if a javascript function is being called from console of the browser or from source code. I defined a function that can check if it's from console or from the page but it works only in google chrome, it…
Khalid
  • 4,730
  • 5
  • 27
  • 50
6
votes
0 answers

Map folder to file system Chrome Dev Tools

I have mapped the whole folder in the properties in the workspace, but it does not work. When I map a single file, then the changes that are made there, work. Why?
puppeteer701
  • 1,225
  • 3
  • 17
  • 33
6
votes
1 answer

What is "User stylesheet" in Google Chrome's developer tools?

I know about user agent stylesheet but I am seeing user stylesheet only on some specific sites in the Styles section of the developer tools, even though there is no Custom.css in my User Stylesheets in my Chrome Profile.
eldos
  • 3,132
  • 3
  • 29
  • 32
6
votes
1 answer

Repaints on Scroll populating input boxes

I keep getting an orange box that says Repaints on Scroll in my input boxes. I don't know why I am getting it and would like to remove it. I am not sure if it is an issue with chrome. How do I fix this or remove it? I have restarted chrome and it…
Seth
  • 334
  • 2
  • 11
6
votes
1 answer

What does "document count" in the devtools refer to?

You can see the word "Document Count" in Chrome DevTools. (source: chrome.com) What is it? For example, recording the below website, the number of documents is 8 or…
Nigiri
  • 3,469
  • 6
  • 29
  • 52
6
votes
0 answers

Chrome DevTools - link/jump to source file

So lets assume we have a page with list of javascript errors displayed. For each error I see filename, line and column. Is it possible to make a link on every error that would open up devTools and jump to specified source file directly to that line…
Gapipro
  • 1,913
  • 2
  • 22
  • 34
6
votes
2 answers

Which Database Can be Used With Chrome Extension

I am trying to create a Google Chrome Extension which Needs to store Data from users for login authentication. Can you please advise me which Database I can try to have with the app? I already tried the SQLite but I am not sure that end users can…
user3162145
  • 121
  • 1
  • 2
  • 6
6
votes
1 answer

How to get position information of HTML element

I have a div{position:absolute}. From w3cschools: absolute - The element is positioned relative to its first positioned (not static) ancestor element Is there an easy way with browser inspector(Chrome, Firebug) to get the first not static…
Islam Sabyrgaliyev
  • 340
  • 1
  • 5
  • 10
6
votes
2 answers

Chrome 32 - control emulation via JS or webdriver

I love the new emulation feature introduced in the new Chrome. In fact so much that I like to use it to test a mobile website for multiple resolutions/devices. To do so I would require some sort of control over the emulation feature. Is there any…
scheffield
  • 6,618
  • 2
  • 30
  • 31
6
votes
1 answer

Chrome does not show network traffic of Silverlight RIA services messages after update to version 32.0.1700.76 m

Couple days ago Google Chrome automatically updated from version 31.* to version 32.0.1700.76 m. After that happened it does not show in DevTools network traffic request/responses of "application/msbin1" type anymore. These requests are visible in…
Philipp Munin
  • 5,610
  • 7
  • 37
  • 60
6
votes
1 answer

Understanding Chrome Heap Profile

I am trying to diagnose an SPA. I took two snapshots, one right after another, while the app was idle. Here is a snapshot below. As you can see, the shallow size of these objects is huge. But I have no idea what they are, or where in the code…
Daniel Williams
  • 8,912
  • 15
  • 68
  • 107
6
votes
3 answers

Save css on elements tab manually instead of automatically with Chrome Workspaces?

I just set up Chrome Workspaces but it's doing something that's really upsetting my workflow. If I edit a source file in the sources tab, it won't save it until I tell it to - this is good. But if I edit a style in the elements tab, it…
dallin
  • 8,775
  • 2
  • 36
  • 41
6
votes
1 answer

How to trigger a tap event on Chrome devtool console?

How can I use the Chrome-devtool's console to test if my javascript works? I've located the xpath and converted it to an css locator. Basically it is a button that turns the color from grey to blye. Here is my snippet…
user2763948
  • 91
  • 1
  • 1
  • 7
1 2 3
…
99 100