summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--devtools/client/locales/en-US/netmonitor.properties5
-rw-r--r--devtools/client/netmonitor/actions/index.js3
-rw-r--r--devtools/client/netmonitor/actions/moz.build1
-rw-r--r--devtools/client/netmonitor/actions/timing-markers.js19
-rw-r--r--devtools/client/netmonitor/components/summary-button.js24
-rw-r--r--devtools/client/netmonitor/constants.js2
-rw-r--r--devtools/client/netmonitor/netmonitor-controller.js2
-rw-r--r--devtools/client/netmonitor/reducers/index.js2
-rw-r--r--devtools/client/netmonitor/reducers/moz.build1
-rw-r--r--devtools/client/netmonitor/reducers/timing-markers.js52
-rw-r--r--devtools/client/netmonitor/requests-menu-view.js7
-rw-r--r--devtools/client/netmonitor/selectors/index.js18
12 files changed, 132 insertions, 4 deletions
diff --git a/devtools/client/locales/en-US/netmonitor.properties b/devtools/client/locales/en-US/netmonitor.properties
index 021b56a2b..4926c234b 100644
--- a/devtools/client/locales/en-US/netmonitor.properties
+++ b/devtools/client/locales/en-US/netmonitor.properties
@@ -150,6 +150,11 @@ networkMenu.empty=No requests
# #2 is the size, #3 is the transferred size, #4 is the number of seconds.
networkMenu.summary2=One request, #2 KB (transferred: #3 KB), #4 s;#1 requests, #2 KB (transferred: #3 KB), #4 s
+# LOCALIZATION NOTE (networkMenu.timeS): This is the label displayed
+# in the network table footer providing concise information about all requests.
+# Events DOMContentLoaded and load - specifying the number of seconds.
+networkMenu.timeS=%S s
+
# LOCALIZATION NOTE (networkMenu.sizeB): This is the label displayed
# in the network menu specifying the size of a request (in bytes).
networkMenu.sizeB=%S B
diff --git a/devtools/client/netmonitor/actions/index.js b/devtools/client/netmonitor/actions/index.js
index 2ce23448e..de8f4ae1d 100644
--- a/devtools/client/netmonitor/actions/index.js
+++ b/devtools/client/netmonitor/actions/index.js
@@ -5,6 +5,7 @@
const filters = require("./filters");
const requests = require("./requests");
+const timingMarkers = require("./timing-markers");
const ui = require("./ui");
-module.exports = Object.assign({}, filters, requests, ui);
+module.exports = Object.assign({}, filters, requests, timingMarkers, ui);
diff --git a/devtools/client/netmonitor/actions/moz.build b/devtools/client/netmonitor/actions/moz.build
index d0ac61944..ce904cae8 100644
--- a/devtools/client/netmonitor/actions/moz.build
+++ b/devtools/client/netmonitor/actions/moz.build
@@ -7,5 +7,6 @@ DevToolsModules(
'filters.js',
'index.js',
'requests.js',
+ 'timing-markers.js',
'ui.js',
)
diff --git a/devtools/client/netmonitor/actions/timing-markers.js b/devtools/client/netmonitor/actions/timing-markers.js
new file mode 100644
index 000000000..4f1363a70
--- /dev/null
+++ b/devtools/client/netmonitor/actions/timing-markers.js
@@ -0,0 +1,19 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+"use strict";
+
+const { ADD_TIMING_MARKER, CLEAR_TIMING_MARKERS } = require("../constants");
+
+exports.addTimingMarker = (marker) => {
+ return {
+ type: ADD_TIMING_MARKER,
+ marker
+ };
+};
+
+exports.clearTimingMarkers = () => {
+ return {
+ type: CLEAR_TIMING_MARKERS
+ };
+};
diff --git a/devtools/client/netmonitor/components/summary-button.js b/devtools/client/netmonitor/components/summary-button.js
index 223552fbf..00595e5e6 100644
--- a/devtools/client/netmonitor/components/summary-button.js
+++ b/devtools/client/netmonitor/components/summary-button.js
@@ -15,16 +15,22 @@ const { connect } = require("devtools/client/shared/vendor/react-redux");
const { PluralForm } = require("devtools/shared/plural-form");
const { L10N } = require("../l10n");
const {
- getDisplayedRequestsSummary
+ getDisplayedRequestsSummary,
+ getDisplayedTimingMarker
} = require("../selectors/index");
const { button, span } = DOM;
function SummaryButton({
summary,
- triggerSummary
+ triggerSummary,
+ timingMarkers
}) {
let { count, contentSize, transferredSize, millis } = summary;
+ let {
+ DOMContentLoaded,
+ load,
+ } = timingMarkers;
const text = (count === 0) ? L10N.getStr("networkMenu.empty") :
PluralForm.get(count, L10N.getStr("networkMenu.summary2"))
.replace("#1", count)
@@ -33,7 +39,13 @@ function SummaryButton({
.replace("#3", L10N.numberWithDecimals(transferredSize / 1024,
CONTENT_SIZE_DECIMALS))
.replace("#4", L10N.numberWithDecimals(millis / 1000,
- REQUEST_TIME_DECIMALS));
+ REQUEST_TIME_DECIMALS))
+ + ((DOMContentLoaded > -1)
+ ? ", " + "DOMContentLoaded: " + L10N.getFormatStrWithNumbers("networkMenu.timeS", L10N.numberWithDecimals(DOMContentLoaded / 1000, REQUEST_TIME_DECIMALS))
+ : "")
+ + ((load > -1)
+ ? ", " + "load: " + L10N.getFormatStrWithNumbers("networkMenu.timeS", L10N.numberWithDecimals(load / 1000, REQUEST_TIME_DECIMALS))
+ : "");
return button({
id: "requests-menu-network-summary-button",
@@ -47,11 +59,17 @@ function SummaryButton({
SummaryButton.propTypes = {
summary: PropTypes.object.isRequired,
+ timingMarkers: PropTypes.object.isRequired,
};
module.exports = connect(
(state) => ({
summary: getDisplayedRequestsSummary(state),
+ timingMarkers: {
+ DOMContentLoaded:
+ getDisplayedTimingMarker(state, "firstDocumentDOMContentLoadedTimestamp"),
+ load: getDisplayedTimingMarker(state, "firstDocumentLoadTimestamp"),
+ },
}),
(dispatch) => ({
triggerSummary: () => {
diff --git a/devtools/client/netmonitor/constants.js b/devtools/client/netmonitor/constants.js
index 33bc71ea7..1605496a5 100644
--- a/devtools/client/netmonitor/constants.js
+++ b/devtools/client/netmonitor/constants.js
@@ -10,6 +10,8 @@ const general = {
};
const actionTypes = {
+ ADD_TIMING_MARKER: "ADD_TIMING_MARKER",
+ CLEAR_TIMING_MARKERS: "CLEAR_TIMING_MARKERS",
TOGGLE_FILTER_TYPE: "TOGGLE_FILTER_TYPE",
ENABLE_FILTER_TYPE_ONLY: "ENABLE_FILTER_TYPE_ONLY",
SET_FILTER_TEXT: "SET_FILTER_TEXT",
diff --git a/devtools/client/netmonitor/netmonitor-controller.js b/devtools/client/netmonitor/netmonitor-controller.js
index 739e174fb..939b6e4f5 100644
--- a/devtools/client/netmonitor/netmonitor-controller.js
+++ b/devtools/client/netmonitor/netmonitor-controller.js
@@ -414,6 +414,7 @@ TargetEventsHandler.prototype = {
}
// Clear any accumulated markers.
NetMonitorController.NetworkEventsHandler.clearMarkers();
+ gStore.dispatch(Actions.clearTimingMarkers());
window.emit(EVENTS.TARGET_WILL_NAVIGATE);
break;
@@ -534,6 +535,7 @@ NetworkEventsHandler.prototype = {
_onDocLoadingMarker: function (marker) {
window.emit(EVENTS.TIMELINE_EVENT, marker);
this._markers.push(marker);
+ gStore.dispatch(Actions.addTimingMarker(marker));
},
/**
diff --git a/devtools/client/netmonitor/reducers/index.js b/devtools/client/netmonitor/reducers/index.js
index f36b1d91f..f003c7805 100644
--- a/devtools/client/netmonitor/reducers/index.js
+++ b/devtools/client/netmonitor/reducers/index.js
@@ -6,10 +6,12 @@
const { combineReducers } = require("devtools/client/shared/vendor/redux");
const filters = require("./filters");
const requests = require("./requests");
+const timingMarkers = require("./timing-markers");
const ui = require("./ui");
module.exports = combineReducers({
filters,
requests,
+ timingMarkers,
ui,
});
diff --git a/devtools/client/netmonitor/reducers/moz.build b/devtools/client/netmonitor/reducers/moz.build
index d0ac61944..ce904cae8 100644
--- a/devtools/client/netmonitor/reducers/moz.build
+++ b/devtools/client/netmonitor/reducers/moz.build
@@ -7,5 +7,6 @@ DevToolsModules(
'filters.js',
'index.js',
'requests.js',
+ 'timing-markers.js',
'ui.js',
)
diff --git a/devtools/client/netmonitor/reducers/timing-markers.js b/devtools/client/netmonitor/reducers/timing-markers.js
new file mode 100644
index 000000000..cb500b2c4
--- /dev/null
+++ b/devtools/client/netmonitor/reducers/timing-markers.js
@@ -0,0 +1,52 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const I = require("devtools/client/shared/vendor/immutable");
+const { ADD_TIMING_MARKER,
+ CLEAR_TIMING_MARKERS } = require("../constants");
+
+const TimingMarkers = I.Record({
+ firstDocumentDOMContentLoadedTimestamp: -1,
+ firstDocumentLoadTimestamp: -1,
+});
+
+function addTimingMarker(state, action) {
+ if (action.marker.name == "document::DOMContentLoaded" &&
+ state.firstDocumentDOMContentLoadedTimestamp == -1) {
+ return state.set("firstDocumentDOMContentLoadedTimestamp",
+ action.marker.unixTime / 1000);
+ }
+
+ if (action.marker.name == "document::Load" &&
+ state.firstDocumentLoadTimestamp == -1) {
+ return state.set("firstDocumentLoadTimestamp",
+ action.marker.unixTime / 1000);
+ }
+
+ return state;
+}
+
+function clearTimingMarkers(state) {
+ return state.withMutations(st => {
+ st.remove("firstDocumentDOMContentLoadedTimestamp");
+ st.remove("firstDocumentLoadTimestamp");
+ });
+}
+
+function timingMarkers(state = new TimingMarkers(), action) {
+ switch (action.type) {
+ case ADD_TIMING_MARKER:
+ return addTimingMarker(state, action);
+
+ case CLEAR_TIMING_MARKERS:
+ return clearTimingMarkers(state);
+
+ default:
+ return state;
+ }
+}
+
+module.exports = timingMarkers;
diff --git a/devtools/client/netmonitor/requests-menu-view.js b/devtools/client/netmonitor/requests-menu-view.js
index 4ee307145..c491fcb0e 100644
--- a/devtools/client/netmonitor/requests-menu-view.js
+++ b/devtools/client/netmonitor/requests-menu-view.js
@@ -275,6 +275,7 @@ RequestsMenuView.prototype = Heritage.extend(WidgetMethods, {
this._addQueue = [];
this._updateQueue = [];
this._firstRequestStartedMillis = -1;
+ this._firstRequestStartedMillisInRequests = false;
this._lastRequestEndedMillis = -1;
},
@@ -650,6 +651,9 @@ RequestsMenuView.prototype = Heritage.extend(WidgetMethods, {
// Append a network request item to this container.
let requestItem = this.push([menuView, id], {
attachment: {
+ firstRequestStartedMillis: this._firstRequestStartedMillisInRequests
+ ? null
+ : this._firstRequestStartedMillis,
startedDeltaMillis: unixTime - this._firstRequestStartedMillis,
startedMillis: unixTime,
method: method,
@@ -661,6 +665,8 @@ RequestsMenuView.prototype = Heritage.extend(WidgetMethods, {
}
});
+ this._firstRequestStartedMillisInRequests = true;
+
if (id == this._preferredItemId) {
this.selectedItem = requestItem;
}
@@ -1563,6 +1569,7 @@ RequestsMenuView.prototype = Heritage.extend(WidgetMethods, {
_ctx: null,
_cachedWaterfallWidth: 0,
_firstRequestStartedMillis: -1,
+ _firstRequestStartedMillisInRequests: false,
_lastRequestEndedMillis: -1,
_updateQueue: [],
_addQueue: [],
diff --git a/devtools/client/netmonitor/selectors/index.js b/devtools/client/netmonitor/selectors/index.js
index 60d6007cd..612188758 100644
--- a/devtools/client/netmonitor/selectors/index.js
+++ b/devtools/client/netmonitor/selectors/index.js
@@ -73,6 +73,24 @@ const getDisplayedRequestsSummary = createSelector(
})
);
+function getDisplayedTimingMarker(state, marker) {
+ let timingMarker = null;
+ if (state.timingMarkers) {
+ timingMarker = state.timingMarkers.get(marker);
+ }
+ let firstRequestStartedMillis = null;
+ if (state.requests.items.length) {
+ firstRequestStartedMillis = state.requests.items[0]
+ .attachment.firstRequestStartedMillis;
+ }
+ if (timingMarker && firstRequestStartedMillis) {
+ return timingMarker - firstRequestStartedMillis;
+ } else {
+ return -1;
+ }
+}
+
module.exports = {
getDisplayedRequestsSummary,
+ getDisplayedTimingMarker,
};