[Devtools][Regression] Fixed websocket frame selection loss on frame received

Fixed bug where if a websocket frame was received it would sometimes move the selected node in network panel to a new request. Offending patch: https://codereview.chromium.org/2694103007 R=dgozman,caseq BUG=714229 Review-Url: https://codereview.chromium.org/2838673003 Cr-Commit-Position: refs/heads/master@{#468185}

[Devtools][Regression] Fixed websocket frame selection loss on frame received
Fixed bug where if a websocket frame was received it would sometimes move the selected node in network panel to a new request. Offending patch: https://codereview.chromium.org/2694103007 R=dgozman,caseq BUG=714229 Review-Url: https://codereview.chromium.org/2838673003 Cr-Commit-Position: refs/heads/master@{#468185}
fc4b4d8f · allada · Commit bot · 0a54e880 · fc4b4d8f · fc4b4d8f
Commit fc4b4d8f authored Apr 28, 2017 by allada Committed by Commit bot Apr 29, 2017
4 changed files
--- a/third_party/WebKit/LayoutTests/http/tests/inspector/network-test.js
+++ b/third_party/WebKit/LayoutTests/http/tests/inspector/network-test.js
@@ -56,6 +56,84 @@ var initialize_NetworkTest = function() {
 InspectorTest.preloadPanel("network");
+/**
+ * @param {!SDK.NetworkRequest} request
+ * @return {!Promise<!SDK.NetworkRequest>}
+ */
+InspectorTest.waitForRequestResponse = function(request)
+{
+    return new Promise(resolve => {
+        if (request.responseReceivedTime !== -1) {
+            resolve(request);
+            return;
+        }
+        InspectorTest.networkManager.addEventListener(SDK.NetworkManager.Events.RequestUpdated, checkRequestUpdated);
+        function checkRequestUpdated(data)
+        {
+            if (data.data !== request || request.responseReceivedTime === -1)
+                return;
+            InspectorTest.networkManager.removeEventListener(SDK.NetworkManager.Events.RequestUpdated, checkRequestUpdated);
+            resolve(request);
+        }
+    });
+}
+/**
+ * @param {!SDK.NetworkRequest} request
+ * @return {!Promise<!Network.NetworkRequestNode>}
+ */
+InspectorTest.waitForNetworkLogViewNodeForRequest = function(request)
+{
+    var networkLogView = UI.panels.network._networkLogView;
+    var node = networkLogView._nodesByRequestId.get(request.requestId());
+    if (node)
+        return Promise.resolve(node);
+    return new Promise(resolve => {
+        networkLogView.addEventToListeners(Network.NetworkLogView.Events.UpdateRequest, requestUpdated);
+        networkLogView._appendRequest;
+        function requestUpdated(data) {
+            if (data.data !== request)
+                return;
+            networkLogView.removeEventToListeners(Network.NetworkLogView.Events.UpdateRequest, requestUpdated);
+            var node = networkLogView._nodesByRequestId.get(request.requestId());
+            console.assert(node);
+            resolve(node);
+        }
+    });
+}
+/**
+ * @param {!SDK.NetworkRequest} wsRequest
+ * @param {string} message
+ * @return {!Promise<!SDK.NetworkRequest.WebSocketFrame>}
+ */
+InspectorTest.waitForWebsocketFrameReceived = function(wsRequest, message)
+{
+    return new Promise(resolve => {
+        for (var frame of wsRequest.frames()) {
+            if (resolveIfNeeded(frame))
+                return;
+        }
+        wsRequest.addEventListener(SDK.NetworkRequest.Events.WebsocketFrameAdded, handleFrameReceived);
+        function handleFrameReceived(data)
+        {
+            if (resolveIfNeeded(/** @type {!SDK.NetworkRequest.WebSocketFrame} */ (data.data)))
+                wsRequest.removeEventListener(SDK.NetworkRequest.Events.WebsocketFrameAdded, handleFrameReceived);
+        }
+        function resolveIfNeeded(frame)
+        {
+            if (frame.type !== SDK.NetworkRequest.WebSocketFrameType.Receive || frame.text !== message)
+                return false;
+            resolve(frame);
+            return true;
+        }
+    });
+}
 InspectorTest.recordNetwork = function()
 {
    UI.panels.network._networkLogView.setRecording(true);

--- a/third_party/WebKit/LayoutTests/http/tests/inspector/websocket/network-preserve-selection-on-frame-receive-expected.txt
+++ b/third_party/WebKit/LayoutTests/http/tests/inspector/websocket/network-preserve-selection-on-frame-receive-expected.txt
+Tests that WebSocket network requests do not loose focus on frame being received.
+Selected Request: ws://localhost:8880/echo
+Sending Websocket frame
+Websocket Frame Received
+Selected Request: ws://localhost:8880/echo
--- a/third_party/WebKit/LayoutTests/http/tests/inspector/websocket/network-preserve-selection-on-frame-receive.html
+++ b/third_party/WebKit/LayoutTests/http/tests/inspector/websocket/network-preserve-selection-on-frame-receive.html
+<html>
+<head>
+<script src="/inspector/inspector-test.js"></script>
+<script src="/inspector/network-test.js"></script>
+<script>
+async function test() {
+    InspectorTest.recordNetwork();
+    const wsUrl = "ws://localhost:8880/echo";
+    const networkLogView = UI.panels.network._networkLogView;
+    const dataGrid = networkLogView._dataGrid;
+    await InspectorTest.evaluateInPagePromise("ws = new WebSocket('" + wsUrl + "')");
+    var websocketRequest = InspectorTest.findRequestsByURLPattern(createPlainTextSearchRegex(wsUrl))[0];
+    await InspectorTest.waitForRequestResponse(websocketRequest);
+    var node = await InspectorTest.waitForNetworkLogViewNodeForRequest(websocketRequest);
+    networkLogView._refresh();
+    node.select();
+    logSelectedNode();
+    InspectorTest.addResult("Sending Websocket frame");
+    await InspectorTest.evaluateInPagePromise("ws.send('test')");
+    await InspectorTest.waitForWebsocketFrameReceived(websocketRequest, "test");
+    networkLogView._refresh();
+    InspectorTest.addResult("Websocket Frame Received");
+    logSelectedNode();
+    InspectorTest.completeTest();
+    function logSelectedNode() {
+        InspectorTest.addResult("Selected Request: " + (dataGrid.selectedNode && dataGrid.selectedNode.request().url()) || '');        
+    }
+}
+</script>
+</head>
+<body onload="runTest()">
+<p>Tests that WebSocket network requests do not loose focus on frame being received.</p>
+</body>
+</html>
--- a/third_party/WebKit/Source/devtools/front_end/network/NetworkLogView.js
+++ b/third_party/WebKit/Source/devtools/front_end/network/NetworkLogView.js
@@ -837,7 +837,8 @@ Network.NetworkLogView = class extends UI.VBox {
      var request = node.request();
      this._timeCalculator.updateBoundaries(request);
      this._durationCalculator.updateBoundaries(request);
+      if (node[Network.NetworkLogView._isFilteredOutSymbol] === isFilteredOut)
+        continue;
      node[Network.NetworkLogView._isFilteredOutSymbol] = isFilteredOut;
      var newParent = this._parentNodeForInsert(node);
      var removeFromParent = node.parent && (isFilteredOut || node.parent !== newParent);