Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(365)

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/network/NetworkDataGridNode.js

Issue 2876983002: DevTools: group by frame, not product in the network panel. (Closed)
Patch Set: more code removed Created 3 years, 7 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 /* 1 /*
2 * Copyright (C) 2007, 2008 Apple Inc. All rights reserved. 2 * Copyright (C) 2007, 2008 Apple Inc. All rights reserved.
3 * Copyright (C) 2008, 2009 Anthony Ricaud <rik@webkit.org> 3 * Copyright (C) 2008, 2009 Anthony Ricaud <rik@webkit.org>
4 * Copyright (C) 2011 Google Inc. All rights reserved. 4 * Copyright (C) 2011 Google Inc. All rights reserved.
5 * 5 *
6 * Redistribution and use in source and binary forms, with or without 6 * Redistribution and use in source and binary forms, with or without
7 * modification, are permitted provided that the following conditions 7 * modification, are permitted provided that the following conditions
8 * are met: 8 * are met:
9 * 9 *
10 * 1. Redistributions of source code must retain the above copyright 10 * 1. Redistributions of source code must retain the above copyright
(...skipping 28 matching lines...) Expand all
39 super({}); 39 super({});
40 this._parentView = parentView; 40 this._parentView = parentView;
41 this._isHovered = false; 41 this._isHovered = false;
42 this._isProduct = false; 42 this._isProduct = false;
43 this._showingInitiatorChain = false; 43 this._showingInitiatorChain = false;
44 /** @type {?SDK.NetworkRequest} */ 44 /** @type {?SDK.NetworkRequest} */
45 this._requestOrFirstKnownChildRequest = null; 45 this._requestOrFirstKnownChildRequest = null;
46 } 46 }
47 47
48 /** 48 /**
49 * @param {!Network.NetworkNode._ProductEntryInfo} entryInfo
50 */
51 static buildReportLinkElement(entryInfo) {
52 var shadowRoot = UI.createShadowRootWithCoreStyles(createElement('div'), 'ne twork/networkReportProductEntry.css');
53 var content = shadowRoot.createChild('div', 'network-product-popover');
54
55 var domainElement = content.createChild('div', 'network-product-domain');
56 domainElement.textContent = entryInfo.matchedURL.domain();
57
58 var entryNameElement = content.createChild('div', 'network-product-entry-nam e');
59 entryNameElement.textContent = entryInfo.entry.name;
60
61 var matchedURL = entryInfo.matchedURL;
62 var reportLink =
63 'https://docs.google.com/forms/d/e/1FAIpQLSchz2FdcQ-rRllzl8BbhWaTRRY-12B pPjW6Hr9e1-BpCA083w/viewform' +
64 '?entry_1425918171=' + encodeURIComponent((matchedURL.domain() + matched URL.path).substr(0, 100));
65 content.appendChild(UI.createExternalLink(reportLink, 'Report mismatch', 'ne twork-report-product-link'));
66 return shadowRoot;
67 }
68
69 /**
70 * @return {!Network.NetworkNode._SupportedBackgroundColors} 49 * @return {!Network.NetworkNode._SupportedBackgroundColors}
71 */ 50 */
72 static _themedBackgroundColors() { 51 static _themedBackgroundColors() {
73 if (Network.NetworkNode._themedBackgroundColorsCache) 52 if (Network.NetworkNode._themedBackgroundColorsCache)
74 return Network.NetworkNode._themedBackgroundColorsCache; 53 return Network.NetworkNode._themedBackgroundColorsCache;
75 var themedColors = {}; 54 var themedColors = {};
76 for (var name in Network.NetworkNode._backgroundColors) { 55 for (var name in Network.NetworkNode._backgroundColors) {
77 var color = Common.Color.fromRGBA(Network.NetworkNode._backgroundColors[na me]); 56 var color = Common.Color.fromRGBA(Network.NetworkNode._backgroundColors[na me]);
78 themedColors[name] = UI.themeSupport.patchColor(color, UI.ThemeSupport.Col orUsage.Background); 57 themedColors[name] = UI.themeSupport.patchColor(color, UI.ThemeSupport.Col orUsage.Background);
79 } 58 }
80 Network.NetworkNode._themedBackgroundColorsCache = 59 Network.NetworkNode._themedBackgroundColorsCache =
81 /** @type {!Network.NetworkNode._SupportedBackgroundColors} */ (themedCo lors); 60 /** @type {!Network.NetworkNode._SupportedBackgroundColors} */ (themedCo lors);
82 return Network.NetworkNode._themedBackgroundColorsCache; 61 return Network.NetworkNode._themedBackgroundColorsCache;
83 } 62 }
84 63
85 /** 64 /**
86 * @param {!ProductRegistry.Registry} productRegistry
87 * @param {!SDK.ResourceTreeFrame} frame
88 * @return {?Network.NetworkNode._ProductEntryInfo}
89 */
90 static productEntryInfoForFrame(productRegistry, frame) {
91 var parsedURL = new Common.ParsedURL(frame.url);
92 var entry = productRegistry.entryForUrl(parsedURL);
93 if (entry)
94 return {entry: entry, matchedURL: parsedURL};
95 frame.findCreationCallFrame(callFrame => {
96 if (!callFrame.url)
97 return false;
98 parsedURL = new Common.ParsedURL(callFrame.url);
99 entry = productRegistry.entryForUrl(parsedURL);
100 return !!entry;
101 });
102 if (!entry)
103 return null;
104 return {entry: entry, matchedURL: parsedURL};
105 }
106
107 /**
108 * @protected
109 * @return {!Promise<?Network.NetworkNode._ProductEntryInfo>}
110 */
111 productEntry() {
112 return Promise.resolve(/** @type {?Network.NetworkNode._ProductEntryInfo} */ (null));
113 }
114
115 /**
116 * @param {!UI.PopoverRequest} popover
117 * @return {!Promise<boolean>}
118 */
119 handleProductPopover(popover) {
120 return this.productEntry().then(entryInfo => {
121 if (!entryInfo)
122 return false;
123 popover.setAnchorBehavior(UI.GlassPane.AnchorBehavior.PreferBottom);
124 popover.contentElement.appendChild(Network.NetworkNode.buildReportLinkElem ent(entryInfo));
125 return true;
126 });
127 }
128
129 /**
130 * @return {string} 65 * @return {string}
131 */ 66 */
132 displayName() { 67 displayName() {
133 return ''; 68 return '';
134 } 69 }
135 70
136 /** 71 /**
137 * @return {boolean} 72 * @return {boolean}
138 */ 73 */
139 isFromFrame() { 74 isFromFrame() {
(...skipping 22 matching lines...) Expand all
162 /** 97 /**
163 * @return {string} 98 * @return {string}
164 */ 99 */
165 backgroundColor() { 100 backgroundColor() {
166 var bgColors = Network.NetworkNode._themedBackgroundColors(); 101 var bgColors = Network.NetworkNode._themedBackgroundColors();
167 var color = this.isStriped() ? bgColors.Stripe : bgColors.Default; 102 var color = this.isStriped() ? bgColors.Stripe : bgColors.Default;
168 if (this.isNavigationRequest()) 103 if (this.isNavigationRequest())
169 color = color.blendWith(bgColors.Navigation); 104 color = color.blendWith(bgColors.Navigation);
170 if (this.hovered()) 105 if (this.hovered())
171 color = color.blendWith(bgColors.Hovered); 106 color = color.blendWith(bgColors.Hovered);
172 if (this.isFromFrame())
173 color = color.blendWith(bgColors.FromFrame);
174 else if (this._isProduct)
175 color = color.blendWith(bgColors.IsProduct);
176 if (this.isOnInitiatorPath()) 107 if (this.isOnInitiatorPath())
177 color = color.blendWith(bgColors.InitiatorPath); 108 color = color.blendWith(bgColors.InitiatorPath);
178 if (this.isOnInitiatedPath()) 109 if (this.isOnInitiatedPath())
179 color = color.blendWith(bgColors.InitiatedPath); 110 color = color.blendWith(bgColors.InitiatedPath);
180 if (this.selected) 111 if (this.selected)
181 color = color.blendWith(bgColors.Selected); 112 color = color.blendWith(bgColors.Selected);
182 113
183 return /** @type {string} */ (color.asString(Common.Color.Format.HEX)); 114 return /** @type {string} */ (color.asString(Common.Color.Format.HEX));
184 } 115 }
185 116
(...skipping 615 matching lines...) Expand 10 before | Expand all | Expand 10 after
801 /** 732 /**
802 * @override 733 * @override
803 * @param {!Element} cell 734 * @param {!Element} cell
804 * @param {string} columnId 735 * @param {string} columnId
805 */ 736 */
806 renderCell(cell, columnId) { 737 renderCell(cell, columnId) {
807 switch (columnId) { 738 switch (columnId) {
808 case 'name': 739 case 'name':
809 this._renderNameCell(cell); 740 this._renderNameCell(cell);
810 break; 741 break;
811 case 'product':
812 if (!Runtime.experiments.isEnabled('networkGroupingRequests')) {
813 this._setTextAndTitle(cell, this._request.responseHeaderValue(columnId ) || '');
814 break;
815 }
816 this.productEntry().then(entryInfo => {
817 if (entryInfo)
818 cell.textContent = entryInfo.entry.name;
819 });
820 break;
821 case 'method': 742 case 'method':
822 this._setTextAndTitle(cell, this._request.requestMethod); 743 this._setTextAndTitle(cell, this._request.requestMethod);
823 break; 744 break;
824 case 'status': 745 case 'status':
825 this._renderStatusCell(cell); 746 this._renderStatusCell(cell);
826 break; 747 break;
827 case 'protocol': 748 case 'protocol':
828 this._setTextAndTitle(cell, this._request.protocol); 749 this._setTextAndTitle(cell, this._request.protocol);
829 break; 750 break;
830 case 'scheme': 751 case 'scheme':
(...skipping 104 matching lines...) Expand 10 before | Expand all | Expand 10 after
935 cell.appendChild(iconElement); 856 cell.appendChild(iconElement);
936 if (!this._nameBadgeElement) 857 if (!this._nameBadgeElement)
937 this._nameBadgeElement = this.parentView().badgePool.badgeForURL(this._req uest.parsedURL); 858 this._nameBadgeElement = this.parentView().badgePool.badgeForURL(this._req uest.parsedURL);
938 cell.appendChild(this._nameBadgeElement); 859 cell.appendChild(this._nameBadgeElement);
939 cell.createTextChild(this._request.networkManager().target().decorateLabel(t his._request.name())); 860 cell.createTextChild(this._request.networkManager().target().decorateLabel(t his._request.name()));
940 this._appendSubtitle(cell, this._request.path()); 861 this._appendSubtitle(cell, this._request.path());
941 cell.title = this._request.url(); 862 cell.title = this._request.url();
942 } 863 }
943 864
944 /** 865 /**
945 * @override
946 * @return {!Promise<?Network.NetworkNode._ProductEntryInfo>}
947 */
948 productEntry() {
949 return ProductRegistry.instance().then(productRegistry => {
950 var frame = SDK.ResourceTreeModel.frameForRequest(this._request);
951 var entry = /** @type {?ProductRegistry.Registry.ProductEntry} */ (null);
952 if (frame && frame.isMainFrame())
953 frame = null;
954 var entryInfo = frame ? Network.NetworkNode.productEntryInfoForFrame(produ ctRegistry, frame) : null;
955 if (entryInfo)
956 return entryInfo;
957 entry = productRegistry.entryForUrl(this._request.parsedURL);
958 return entry ? {entry: entry, matchedURL: this._request.parsedURL} : null;
959 });
960 }
961
962 /**
963 * @param {!Element} cell 866 * @param {!Element} cell
964 */ 867 */
965 _renderStatusCell(cell) { 868 _renderStatusCell(cell) {
966 cell.classList.toggle( 869 cell.classList.toggle(
967 'network-dim-cell', !this._isFailed() && (this._request.cached() || !thi s._request.statusCode)); 870 'network-dim-cell', !this._isFailed() && (this._request.cached() || !thi s._request.statusCode));
968 871
969 if (this._request.failed && !this._request.canceled && !this._request.wasBlo cked()) { 872 if (this._request.failed && !this._request.canceled && !this._request.wasBlo cked()) {
970 var failText = Common.UIString('(failed)'); 873 var failText = Common.UIString('(failed)');
971 if (this._request.localizedFailDescription) { 874 if (this._request.localizedFailDescription) {
972 cell.createTextChild(failText); 875 cell.createTextChild(failText);
(...skipping 159 matching lines...) Expand 10 before | Expand all | Expand 10 after
1132 * @param {boolean=} supressSelectedEvent 1035 * @param {boolean=} supressSelectedEvent
1133 */ 1036 */
1134 select(supressSelectedEvent) { 1037 select(supressSelectedEvent) {
1135 if (this.expanded) { 1038 if (this.expanded) {
1136 this.collapse(); 1039 this.collapse();
1137 return; 1040 return;
1138 } 1041 }
1139 this.expand(); 1042 this.expand();
1140 } 1043 }
1141 }; 1044 };
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698