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

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

Issue 2914033002: [Devtools] NetworkLogView now uses NetworkLog as source of truth. (Closed)
Patch Set: fixes Created 3 years, 6 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 91 matching lines...) Expand 10 before | Expand all | Expand 10 after
102 this._updateUI(); 102 this._updateUI();
103 103
104 SDK.targetManager.addModelListener( 104 SDK.targetManager.addModelListener(
105 SDK.ResourceTreeModel, SDK.ResourceTreeModel.Events.WillReloadPage, this ._willReloadPage, this); 105 SDK.ResourceTreeModel, SDK.ResourceTreeModel.Events.WillReloadPage, this ._willReloadPage, this);
106 SDK.targetManager.addModelListener(SDK.ResourceTreeModel, SDK.ResourceTreeMo del.Events.Load, this._load, this); 106 SDK.targetManager.addModelListener(SDK.ResourceTreeModel, SDK.ResourceTreeMo del.Events.Load, this._load, this);
107 this._networkLogView.addEventListener(Network.NetworkLogView.Events.RequestS elected, this._onRequestSelected, this); 107 this._networkLogView.addEventListener(Network.NetworkLogView.Events.RequestS elected, this._onRequestSelected, this);
108 this._networkLogView.addEventListener( 108 this._networkLogView.addEventListener(
109 Network.NetworkLogView.Events.SearchCountUpdated, this._onSearchCountUpd ated, this); 109 Network.NetworkLogView.Events.SearchCountUpdated, this._onSearchCountUpd ated, this);
110 this._networkLogView.addEventListener( 110 this._networkLogView.addEventListener(
111 Network.NetworkLogView.Events.SearchIndexUpdated, this._onSearchIndexUpd ated, this); 111 Network.NetworkLogView.Events.SearchIndexUpdated, this._onSearchIndexUpd ated, this);
112 this._networkLogView.addEventListener(Network.NetworkLogView.Events.UpdateRe quest, this._onUpdateRequest, this); 112 NetworkLog.networkLog.addEventListener(NetworkLog.NetworkLog.Events.RequestU pdated, this._onUpdateRequest, this);
113 NetworkLog.networkLog.addEventListener(NetworkLog.NetworkLog.Events.Reset, t his._onNetworkLogReset, this);
114 NetworkLog.networkLog.addEventListener(NetworkLog.NetworkLog.Events.Requests Removed, this._onRequestsRemoved, this);
113 115
114 Components.DataSaverInfobar.maybeShowInPanel(this); 116 Components.DataSaverInfobar.maybeShowInPanel(this);
115 } 117 }
116 118
117 /** 119 /**
118 * @param {!Array<{filterType: !Network.NetworkLogView.FilterType, filterValue : string}>} filters 120 * @param {!Array<{filterType: !Network.NetworkLogView.FilterType, filterValue : string}>} filters
119 */ 121 */
120 static revealAndFilter(filters) { 122 static revealAndFilter(filters) {
121 var panel = Network.NetworkPanel._instance(); 123 var panel = Network.NetworkPanel._instance();
122 var filterString = ''; 124 var filterString = '';
(...skipping 16 matching lines...) Expand all
139 _onWindowChanged(event) { 141 _onWindowChanged(event) {
140 var startTime = Math.max(this._calculator.minimumBoundary(), event.data.star tTime / 1000); 142 var startTime = Math.max(this._calculator.minimumBoundary(), event.data.star tTime / 1000);
141 var endTime = Math.min(this._calculator.maximumBoundary(), event.data.endTim e / 1000); 143 var endTime = Math.min(this._calculator.maximumBoundary(), event.data.endTim e / 1000);
142 this._networkLogView.setWindow(startTime, endTime); 144 this._networkLogView.setWindow(startTime, endTime);
143 } 145 }
144 146
145 _createToolbarButtons() { 147 _createToolbarButtons() {
146 this._panelToolbar.appendToolbarItem(UI.Toolbar.createActionButton(this._tog gleRecordAction)); 148 this._panelToolbar.appendToolbarItem(UI.Toolbar.createActionButton(this._tog gleRecordAction));
147 149
148 this._clearButton = new UI.ToolbarButton(Common.UIString('Clear'), 'largeico n-clear'); 150 this._clearButton = new UI.ToolbarButton(Common.UIString('Clear'), 'largeico n-clear');
149 this._clearButton.addEventListener(UI.ToolbarButton.Events.Click, this._onCl earButtonClicked, this); 151 this._clearButton.addEventListener(UI.ToolbarButton.Events.Click, () => Netw orkLog.networkLog.reset());
150 this._panelToolbar.appendToolbarItem(this._clearButton); 152 this._panelToolbar.appendToolbarItem(this._clearButton);
151 this._panelToolbar.appendSeparator(); 153 this._panelToolbar.appendSeparator();
152 var recordFilmStripButton = new UI.ToolbarSettingToggle( 154 var recordFilmStripButton = new UI.ToolbarSettingToggle(
153 this._networkRecordFilmStripSetting, 'largeicon-camera', Common.UIString ('Capture screenshots')); 155 this._networkRecordFilmStripSetting, 'largeicon-camera', Common.UIString ('Capture screenshots'));
154 this._panelToolbar.appendToolbarItem(recordFilmStripButton); 156 this._panelToolbar.appendToolbarItem(recordFilmStripButton);
155 157
156 this._panelToolbar.appendToolbarItem(this._filterBar.filterButton()); 158 this._panelToolbar.appendToolbarItem(this._filterBar.filterButton());
157 this._panelToolbar.appendSeparator(); 159 this._panelToolbar.appendSeparator();
158 160
159 this._panelToolbar.appendText(Common.UIString('View:')); 161 this._panelToolbar.appendText(Common.UIString('View:'));
160 162
161 var largerRequestsButton = new UI.ToolbarSettingToggle( 163 var largerRequestsButton = new UI.ToolbarSettingToggle(
162 this._networkLogLargeRowsSetting, 'largeicon-large-list', Common.UIStrin g('Use large request rows'), 164 this._networkLogLargeRowsSetting, 'largeicon-large-list', Common.UIStrin g('Use large request rows'),
163 Common.UIString('Use small request rows')); 165 Common.UIString('Use small request rows'));
164 this._panelToolbar.appendToolbarItem(largerRequestsButton); 166 this._panelToolbar.appendToolbarItem(largerRequestsButton);
165 167
166 var showOverviewButton = new UI.ToolbarSettingToggle( 168 var showOverviewButton = new UI.ToolbarSettingToggle(
167 this._networkLogShowOverviewSetting, 'largeicon-waterfall', Common.UIStr ing('Show overview'), 169 this._networkLogShowOverviewSetting, 'largeicon-waterfall', Common.UIStr ing('Show overview'),
168 Common.UIString('Hide overview')); 170 Common.UIString('Hide overview'));
169 this._panelToolbar.appendToolbarItem(showOverviewButton); 171 this._panelToolbar.appendToolbarItem(showOverviewButton);
170 172
171 if (Runtime.experiments.isEnabled('networkGroupingRequests')) { 173 if (Runtime.experiments.isEnabled('networkGroupingRequests')) {
172 this._panelToolbar.appendToolbarItem(new UI.ToolbarSettingCheckbox( 174 this._panelToolbar.appendToolbarItem(new UI.ToolbarSettingCheckbox(
173 Common.moduleSetting('network.group-by-frame'), '', Common.UIString('G roup by frame'))); 175 Common.moduleSetting('network.group-by-frame'), '', Common.UIString('G roup by frame')));
174 } 176 }
175 177
176 this._panelToolbar.appendSeparator(); 178 this._panelToolbar.appendSeparator();
177 this._preserveLogSetting = Common.moduleSetting('network.preserve-log'); 179 this._preserveLogSetting = Common.moduleSetting('network_log.preserve-log');
dgozman 2017/06/14 22:21:47 This does not work, right?
allada 2017/06/15 00:19:48 Done.
178 this._panelToolbar.appendToolbarItem(new UI.ToolbarSettingCheckbox( 180 this._panelToolbar.appendToolbarItem(new UI.ToolbarSettingCheckbox(
179 this._preserveLogSetting, Common.UIString('Do not clear log on page relo ad / navigation'), 181 this._preserveLogSetting, Common.UIString('Do not clear log on page relo ad / navigation'),
180 Common.UIString('Preserve log'))); 182 Common.UIString('Preserve log')));
181 183
182 this._disableCacheCheckbox = new UI.ToolbarSettingCheckbox( 184 this._disableCacheCheckbox = new UI.ToolbarSettingCheckbox(
183 Common.moduleSetting('cacheDisabled'), Common.UIString('Disable cache (w hile DevTools is open)'), 185 Common.moduleSetting('cacheDisabled'), Common.UIString('Disable cache (w hile DevTools is open)'),
184 Common.UIString('Disable cache')); 186 Common.UIString('Disable cache'));
185 this._panelToolbar.appendToolbarItem(this._disableCacheCheckbox); 187 this._panelToolbar.appendToolbarItem(this._disableCacheCheckbox);
186 188
187 this._panelToolbar.appendSeparator(); 189 this._panelToolbar.appendSeparator();
188 this._panelToolbar.appendToolbarItem(MobileThrottling.NetworkConditionsSelec tor.createOfflineToolbarCheckbox()); 190 this._panelToolbar.appendToolbarItem(MobileThrottling.NetworkConditionsSelec tor.createOfflineToolbarCheckbox());
189 this._panelToolbar.appendToolbarItem(this._createNetworkConditionsSelect()); 191 this._panelToolbar.appendToolbarItem(this._createNetworkConditionsSelect());
190 192
191 this._panelToolbar.appendToolbarItem(new UI.ToolbarItem(this._progressBarCon tainer)); 193 this._panelToolbar.appendToolbarItem(new UI.ToolbarItem(this._progressBarCon tainer));
192 } 194 }
193 195
194 /** 196 /**
195 * @return {!UI.ToolbarComboBox} 197 * @return {!UI.ToolbarComboBox}
196 */ 198 */
197 _createNetworkConditionsSelect() { 199 _createNetworkConditionsSelect() {
198 var toolbarItem = new UI.ToolbarComboBox(null); 200 var toolbarItem = new UI.ToolbarComboBox(null);
199 toolbarItem.setMaxWidth(140); 201 toolbarItem.setMaxWidth(140);
200 MobileThrottling.NetworkConditionsSelector.decorateSelect(toolbarItem.select Element()); 202 MobileThrottling.NetworkConditionsSelector.decorateSelect(toolbarItem.select Element());
201 return toolbarItem; 203 return toolbarItem;
202 } 204 }
203 205
204 _toggleRecording() { 206 _toggleRecording() {
205 if (!this._preserveLogSetting.get() && !this._toggleRecordAction.toggled()) 207 if (!this._preserveLogSetting.get() && !this._toggleRecordAction.toggled())
206 this._reset(); 208 NetworkLog.networkLog.reset();
207 this._toggleRecord(!this._toggleRecordAction.toggled()); 209 this._toggleRecord(!this._toggleRecordAction.toggled());
208 } 210 }
209 211
210 /** 212 /**
211 * @param {boolean} toggled 213 * @param {boolean} toggled
212 */ 214 */
213 _toggleRecord(toggled) { 215 _toggleRecord(toggled) {
214 this._toggleRecordAction.setToggled(toggled); 216 this._toggleRecordAction.setToggled(toggled);
215 this._networkLogView.setRecording(toggled); 217 this._networkLogView.setRecording(toggled);
216 if (!toggled && this._filmStripRecorder) 218 if (!toggled && this._filmStripRecorder)
217 this._filmStripRecorder.stopRecording(this._filmStripAvailable.bind(this)) ; 219 this._filmStripRecorder.stopRecording(this._filmStripAvailable.bind(this)) ;
220 // TODO(einbinder) This should be moved to a setting/action that NetworkLog owns but NetworkPanel controls, but
221 // always be present in the command menu.
222 NetworkLog.networkLog.setIsRecording(toggled);
218 } 223 }
219 224
220 /** 225 /**
221 * @param {?SDK.FilmStripModel} filmStripModel 226 * @param {?SDK.FilmStripModel} filmStripModel
222 */ 227 */
223 _filmStripAvailable(filmStripModel) { 228 _filmStripAvailable(filmStripModel) {
224 if (!filmStripModel) 229 if (!filmStripModel)
225 return; 230 return;
226 var calculator = this._networkLogView.timeCalculator(); 231 var calculator = this._networkLogView.timeCalculator();
227 this._filmStripView.setModel(filmStripModel, calculator.minimumBoundary() * 1000, calculator.boundarySpan() * 1000); 232 this._filmStripView.setModel(filmStripModel, calculator.minimumBoundary() * 1000, calculator.boundarySpan() * 1000);
228 this._networkOverview.setFilmStripModel(filmStripModel); 233 this._networkOverview.setFilmStripModel(filmStripModel);
229 var timestamps = filmStripModel.frames().map(mapTimestamp); 234 var timestamps = filmStripModel.frames().map(mapTimestamp);
230 235
231 /** 236 /**
232 * @param {!SDK.FilmStripModel.Frame} frame 237 * @param {!SDK.FilmStripModel.Frame} frame
233 * @return {number} 238 * @return {number}
234 */ 239 */
235 function mapTimestamp(frame) { 240 function mapTimestamp(frame) {
236 return frame.timestamp / 1000; 241 return frame.timestamp / 1000;
237 } 242 }
238 243
239 this._networkLogView.addFilmStripFrames(timestamps); 244 this._networkLogView.addFilmStripFrames(timestamps);
240 } 245 }
241 246
242 /** 247 _onNetworkLogReset() {
243 * @param {!Common.Event} event
244 */
245 _onClearButtonClicked(event) {
246 this._reset();
247 }
248
249 _reset() {
250 this._calculator.reset(); 248 this._calculator.reset();
251 this._overviewPane.reset(); 249 this._overviewPane.reset();
252 this._networkLogView.reset();
253 Network.BlockedURLsPane.reset(); 250 Network.BlockedURLsPane.reset();
254 if (this._filmStripView) 251 if (this._filmStripView)
255 this._resetFilmStripView(); 252 this._resetFilmStripView();
256 } 253 }
257 254
255 _onRequestsRemoved() {
256 this._calculator.reset();
257 this._overviewPane.reset();
258 for (var request of NetworkLog.networkLog.requests()) {
259 this._calculator.updateBoundaries(request);
260 this._networkOverview.updateRequest(request);
261 }
262 this._overviewPane.setBounds(this._calculator.minimumBoundary() * 1000, this ._calculator.maximumBoundary() * 1000);
263 this._overviewPane.scheduleUpdate();
264 }
265
258 /** 266 /**
259 * @param {!Common.Event} event 267 * @param {!Common.Event} event
260 */ 268 */
261 _willReloadPage(event) { 269 _willReloadPage(event) {
262 if (!this._preserveLogSetting.get())
263 this._reset();
264 this._toggleRecord(true); 270 this._toggleRecord(true);
265 if (this._pendingStopTimer) { 271 if (this._pendingStopTimer) {
266 clearTimeout(this._pendingStopTimer); 272 clearTimeout(this._pendingStopTimer);
267 delete this._pendingStopTimer; 273 delete this._pendingStopTimer;
268 } 274 }
269 if (this.isShowing() && this._filmStripRecorder) 275 if (this.isShowing() && this._filmStripRecorder)
270 this._filmStripRecorder.startRecording(); 276 this._filmStripRecorder.startRecording();
271 } 277 }
272 278
273 /** 279 /**
(...skipping 438 matching lines...) Expand 10 before | Expand all | Expand 10 after
712 * @param {string} actionId 718 * @param {string} actionId
713 * @return {boolean} 719 * @return {boolean}
714 */ 720 */
715 handleAction(context, actionId) { 721 handleAction(context, actionId) {
716 var panel = UI.context.flavor(Network.NetworkPanel); 722 var panel = UI.context.flavor(Network.NetworkPanel);
717 console.assert(panel && panel instanceof Network.NetworkPanel); 723 console.assert(panel && panel instanceof Network.NetworkPanel);
718 panel._toggleRecording(); 724 panel._toggleRecording();
719 return true; 725 return true;
720 } 726 }
721 }; 727 };
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698