New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 550453 link

Starred by 14 users

Issue metadata

Status: Fixed
Owner:
Closed: Jan 2018
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: All
Pri: 3
Type: Feature

Blocking:
issue 563578



Sign in to add a comment

Blackbox third party sources in dev tools Network tab

Reported by nosov.an...@gmail.com, Nov 2 2015

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2490.80 Safari/537.36

Steps to reproduce the problem:
1. Open Dev tools
2. Go to network tab
3. Hover over any request initiator column

What is the expected behavior?
It should be possible to blackbox third party sources, same as in debugger call stack (https://developer.chrome.com/devtools/docs/blackboxing)

What went wrong?
When using frameworks(e.g. angular) initiator stack only contains framework calls.

Did this work before? No 

Chrome version: 46.0.2490.80  Channel: stable
OS Version: OS X 10.11.1
Flash Version: Shockwave Flash 19.0 r0
 
Owner: kozyatinskiy@chromium.org
Status: Assigned
Blocking: chromium:563578
Labels: -Pri-2 -Type-Bug -OS-Mac Pri-3 Type-Feature OS-All Cr-Platform-DevTools-Network
Any updates on this bug? Same issue still exists (on Windows).
Even worse, Angular and jquery together consumes more than 10 levels deep, which is the max depth of call stack shown there. So, it becomes pretty much useless as you can never reach your application code from there.

Is there any option that can be used to increase network initiator stack depth? Atleast, that would be a temporary solution.
Owner: kozy@chromium.org

Comment 6 by kozy@chromium.org, Jan 3 2018

Cc: kozy@chromium.org sc00335...@techmahindra.com
 Issue 780539  has been merged into this issue.
Project Member

Comment 7 by bugdroid1@chromium.org, Jan 6 2018

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/f8d5a80ca32b9ac0d487143a11e26bc26772eac1

commit f8d5a80ca32b9ac0d487143a11e26bc26772eac1
Author: Alexey Kozyatinskiy <kozyatinskiy@chromium.org>
Date: Sat Jan 06 03:00:37 2018

[DevTools] instrument load and error events with async stacks

Some frameworks actively use load and error events for dynamic script
loading. This async stacks can be super usefull in initiator stack in
network panel.

R=dgozman@chromium.org
TBR=pfeldman@chromium.org

Bug:  chromium:550453 
Change-Id: Idb2a31364421e17e456cfeb0bf9b4a299f0d50b7
Reviewed-on: https://chromium-review.googlesource.com/852854
Reviewed-by: Aleksey Kozyatinskiy <kozyatinskiy@chromium.org>
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Commit-Queue: Aleksey Kozyatinskiy <kozyatinskiy@chromium.org>
Cr-Commit-Position: refs/heads/master@{#527489}
[modify] https://crrev.com/f8d5a80ca32b9ac0d487143a11e26bc26772eac1/third_party/WebKit/LayoutTests/http/tests/devtools/console/console-uncaught-exception-expected.txt
[add] https://crrev.com/f8d5a80ca32b9ac0d487143a11e26bc26772eac1/third_party/WebKit/LayoutTests/inspector-protocol/debugger/async-stacks-for-load-and-error-events-expected.txt
[add] https://crrev.com/f8d5a80ca32b9ac0d487143a11e26bc26772eac1/third_party/WebKit/LayoutTests/inspector-protocol/debugger/async-stacks-for-load-and-error-events.js
[add] https://crrev.com/f8d5a80ca32b9ac0d487143a11e26bc26772eac1/third_party/WebKit/LayoutTests/inspector-protocol/debugger/resources/simple.js
[modify] https://crrev.com/f8d5a80ca32b9ac0d487143a11e26bc26772eac1/third_party/WebKit/Source/bindings/core/v8/V8AbstractEventListener.cpp
[modify] https://crrev.com/f8d5a80ca32b9ac0d487143a11e26bc26772eac1/third_party/WebKit/Source/core/dom/events/EventTarget.cpp
[modify] https://crrev.com/f8d5a80ca32b9ac0d487143a11e26bc26772eac1/third_party/WebKit/Source/core/inspector/InspectorTraceEvents.cpp
[modify] https://crrev.com/f8d5a80ca32b9ac0d487143a11e26bc26772eac1/third_party/WebKit/Source/core/inspector/InspectorTraceEvents.h
[modify] https://crrev.com/f8d5a80ca32b9ac0d487143a11e26bc26772eac1/third_party/WebKit/Source/core/inspector/ThreadDebugger.cpp
[modify] https://crrev.com/f8d5a80ca32b9ac0d487143a11e26bc26772eac1/third_party/WebKit/Source/core/inspector/ThreadDebugger.h
[modify] https://crrev.com/f8d5a80ca32b9ac0d487143a11e26bc26772eac1/third_party/WebKit/Source/core/probe/CoreProbes.cpp
[modify] https://crrev.com/f8d5a80ca32b9ac0d487143a11e26bc26772eac1/third_party/WebKit/Source/core/probe/CoreProbes.h

Project Member

Comment 8 by bugdroid1@chromium.org, Jan 10 2018

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/c6b648112dcd063a794a4ce3ef061c039e266fad

commit c6b648112dcd063a794a4ce3ef061c039e266fad
Author: Alexey Kozyatinskiy <kozyatinskiy@chromium.org>
Date: Wed Jan 10 19:52:33 2018

[DevTools] show top not blackboxed frame as initator url

R=dgozman@chromium.org

Bug:  chromium:550453 
Change-Id: I91ec10f7961c60c321678ec433a7f7461fb799f3
Reviewed-on: https://chromium-review.googlesource.com/853160
Commit-Queue: Aleksey Kozyatinskiy <kozyatinskiy@chromium.org>
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Cr-Commit-Position: refs/heads/master@{#528391}
[modify] https://crrev.com/c6b648112dcd063a794a4ce3ef061c039e266fad/third_party/WebKit/Source/devtools/front_end/network/NetworkDataGridNode.js
[modify] https://crrev.com/c6b648112dcd063a794a4ce3ef061c039e266fad/third_party/WebKit/Source/devtools/front_end/network_log/NetworkLog.js

Cc: krajshree@chromium.org
Labels: Needs-Feedback
Tested the issue on Win-10, mac 10.12.6 and ubuntu 14.04 using latest chrome version #65.0.3318.0 as per the merged  issue 780539 .
Attached a screen cast for reference.

Following are the steps followed to reproduce the issue.
------------
1. Navigated to https://www.bbc.co.uk/radio2
2. Opened dev tools, and navigated to the Network tab
3. Observed that inside the initiator column many rows showed require.js:1958 as in the chrome reported version #62.0.3202.75 and not as require.js:1958:app.js
or [libraryLoader:actualJSModule] as in the expected behaviour.

kozy@ - Could you please check the attached screen cast and please let us know the expected behaviour and please confirm the fix.

Thanks...!!

550453.mp4
4.9 MB View Download
Tested the issue on MacOS 10.12.6 using Chrome Canary Version 65.0.3318.0 (Official Build) canary (64-bit)

First i tried without blackbox, and i got many rows with "require.js" in them.

I've set "require\.js" as my blackbox pattern, and i can confirm it works.
Screenshot attached

Screen Shot 2018-01-11 at 17.42.54.png
213 KB View Download

Comment 11 by kozy@chromium.org, Jan 16 2018

This feature is not ready yet. I am going to improve stack trace popover: hide blackboxed frames in popover and provide context menu items for blackbox/unblackbox urls.
#9: you need to blackbox require.js to hide require.js in network panel as Jase mentioned.
Thank you kozy@ for providing an update.
Project Member

Comment 13 by bugdroid1@chromium.org, Jan 17 2018

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/6de15c229fce75c5ff1fcffd4ca0a08d60c0eca1

commit 6de15c229fce75c5ff1fcffd4ca0a08d60c0eca1
Author: Alexey Kozyatinskiy <kozyatinskiy@chromium.org>
Date: Wed Jan 17 21:07:31 2018

[DevTools] append blackbox items for urls context menu

If url has UILocation we can append blackbox/unblackbox url menu item
for urls inside stack trace popover.

R=dgozman@chromium.org

Bug:  chromium:550453 
Change-Id: If15749909402dea328a23f063d8d27189f685193
Reviewed-on: https://chromium-review.googlesource.com/868395
Commit-Queue: Aleksey Kozyatinskiy <kozyatinskiy@chromium.org>
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Cr-Commit-Position: refs/heads/master@{#529891}
[modify] https://crrev.com/6de15c229fce75c5ff1fcffd4ca0a08d60c0eca1/third_party/WebKit/Source/devtools/front_end/components/DOMPresentationUtils.js
[modify] https://crrev.com/6de15c229fce75c5ff1fcffd4ca0a08d60c0eca1/third_party/WebKit/Source/devtools/front_end/components/Linkifier.js

Comment 15 by kozy@chromium.org, Jan 23 2018

Status: Fixed (was: Assigned)
Labels: TE-Verified-M66 TE-Verified-66.0.3329.0
Verified the fix on Mac 10.12.6, Win-10 and Ubuntu 14.04 using latest Chrome version #66.0.3329.0 as per the comment# 14
Note: Verified by following the steps mentioned in comment#10.
Attaching screen cast for reference.
Observed that "require.js" is not seen in Network tab in Devtools after setting "require\.js" as blackbox pattern
Hence, the fix is working as expected.
Adding the verified labels.

Thanks...!!

550453.mp4
3.7 MB View Download

Sign in to add a comment