Bug 1593831 - WebSockets: Display separate uploaded and downloaded transfer size r=Honza
authorhayden <hunghongda41@gmail.com>
Thu, 28 Nov 2019 14:14:12 +0000
changeset 504229 608abbf990f2925e8eaa4913e21a5fbc89c4bc42
parent 504228 9b97128e83d8f0b2a1e586b9de280e57a55a549d
child 504230 35d7fa76293777acff553fd867d71677e75cde2d
push id36859
push userrgurzau@mozilla.com
push dateThu, 28 Nov 2019 21:48:53 +0000
treeherdermozilla-central@5afa8f03bfed [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersHonza
bugs1593831
milestone72.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1593831 - WebSockets: Display separate uploaded and downloaded transfer size r=Honza Differential Revision: https://phabricator.services.mozilla.com/D54059
devtools/client/locales/en-US/netmonitor.properties
devtools/client/netmonitor/src/components/websockets/StatusBar.js
devtools/client/netmonitor/src/selectors/web-sockets.js
--- a/devtools/client/locales/en-US/netmonitor.properties
+++ b/devtools/client/locales/en-US/netmonitor.properties
@@ -220,16 +220,21 @@ networkMenu.ws.summary.framesCountEmpty=
 # LOCALIZATION NOTE (networkMenu.ws.summary.tooltip.framesCount): A tooltip explaining
 # what the framesCount label displays
 networkMenu.ws.summary.tooltip.framesCount=Number of messages
 
 # LOCALIZATION NOTE (networkMenu.ws.summary.tooltip.framesTotalSize): A tooltip explaining
 # what the framesTotalSize label displays
 networkMenu.ws.summary.tooltip.framesTotalSize=Total size of displayed messages
 
+# LOCALIZATION NOTE (networkMenu.ws.summary.tooltip.framesTranferredSize): A tooltip explaining
+# what the framesTranferredSize label displays
+# %1$S is the total size of the transferred data, %2$S is the size of sent data, %3$S is the size of received data.
+networkMenu.ws.summary.tooltip.framesTranferredSize=%1$S total, %2$S sent, %3$S received
+
 # LOCALIZATION NOTE (networkMenu.ws.summary.tooltip.framesTotalTime): A tooltip explaining
 # what framesTotalTime displays
 networkMenu.ws.summary.tooltip.framesTotalTime=Total elapsed time between the first and last displayed messages
 
 # 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
 
--- a/devtools/client/netmonitor/src/components/websockets/StatusBar.js
+++ b/devtools/client/netmonitor/src/components/websockets/StatusBar.js
@@ -56,26 +56,28 @@ class StatusBar extends Component {
       UPDATED_WS_SUMMARY_PROPS,
       summary,
       nextProps.summary
     );
   }
 
   render() {
     const { summary } = this.props;
-    const { count, totalSize, totalMs } = summary;
+    const { count, totalMs, sentSize, receivedSize, totalSize } = summary;
 
     const countText =
       count === 0
         ? FRAMES_COUNT_EMPTY
         : PluralForm.get(
             count,
             L10N.getStr("networkMenu.ws.summary.framesCount2")
           ).replace("#1", count);
     const totalSizeText = getFormattedSize(totalSize);
+    const sentSizeText = getFormattedSize(sentSize);
+    const receivedText = getFormattedSize(receivedSize);
     const totalMillisText = getFormattedTime(totalMs);
 
     return footer(
       { className: "devtools-toolbar devtools-toolbar-bottom" },
       div(
         {
           className: "status-bar-label frames-list-network-summary-count",
           title: TOOLTIP_FRAMES_COUNT,
@@ -84,17 +86,22 @@ class StatusBar extends Component {
       ),
       count !== 0 &&
         div(
           {
             className:
               "status-bar-label frames-list-network-summary-total-size",
             title: TOOLTIP_FRAMES_TOTAL_SIZE,
           },
-          totalSizeText
+          L10N.getFormatStr(
+            "networkMenu.ws.summary.tooltip.framesTranferredSize",
+            totalSizeText,
+            sentSizeText,
+            receivedText
+          )
         ),
       count !== 0 &&
         div(
           {
             className:
               "status-bar-label frames-list-network-summary-total-millis",
             title: TOOLTIP_FRAMES_TOTAL_TIME,
           },
--- a/devtools/client/netmonitor/src/selectors/web-sockets.js
+++ b/devtools/client/netmonitor/src/selectors/web-sockets.js
@@ -57,31 +57,40 @@ const getSelectedFrame = createSelector(
  * Returns summary data of the list of frames that are visible to the user.
  * Filtered frames by types and text are factored in.
  */
 const getDisplayedFramesSummary = createSelector(
   getDisplayedFrames,
   displayedFrames => {
     let firstStartedMs = +Infinity;
     let lastEndedMs = -Infinity;
+    let sentSize = 0;
+    let receivedSize = 0;
     let totalSize = 0;
 
     displayedFrames.forEach(frame => {
+      if (frame.type == "received") {
+        receivedSize += frame.payload.length;
+      } else if (frame.type == "sent") {
+        sentSize += frame.payload.length;
+      }
       totalSize += frame.payload.length;
       if (frame.timeStamp < firstStartedMs) {
         firstStartedMs = frame.timeStamp;
       }
       if (frame.timeStamp > lastEndedMs) {
         lastEndedMs = frame.timeStamp;
       }
     });
 
     return {
       count: displayedFrames.length,
       totalMs: (lastEndedMs - firstStartedMs) / 1000,
+      sentSize,
+      receivedSize,
       totalSize,
     };
   }
 );
 
 module.exports = {
   getSelectedFrame,
   isSelectedFrameVisible,