DevTools: make StylesSourceMapping in charge of creating and removing UISourceCodes

third_party/WebKit/Source/devtools/front_end/sources/NavigatorView.js

Index: third_party/WebKit/Source/devtools/front_end/sources/NavigatorView.js
diff --git a/third_party/WebKit/Source/devtools/front_end/sources/NavigatorView.js b/third_party/WebKit/Source/devtools/front_end/sources/NavigatorView.js
index fc433ab3c6559eed4b487e099400bf424ef4ffdb..70be6e8d60b4cfa12e4e6255a55b9b26f1fb8047 100644
--- a/third_party/WebKit/Source/devtools/front_end/sources/NavigatorView.js
+++ b/third_party/WebKit/Source/devtools/front_end/sources/NavigatorView.js
@@ -78,6 +78,9 @@ Sources.NavigatorView = class extends UI.VBox {
     SDK.targetManager.observeTargets(this);
     this._resetWorkspace(Workspace.workspace);
     this._workspace.uiSourceCodes().forEach(this._addUISourceCode.bind(this));
+
+    Bindings.networkProjectManager.on(
+        Bindings.NetworkProjectManager.FrameAttributionChangedEvent, this._frameAttributionChanged, this);
   }
 
   /**
@@ -176,7 +179,8 @@ Sources.NavigatorView = class extends UI.VBox {
    */
   _onBindingRemoved(event) {
     var binding = /** @type {!Persistence.PersistenceBinding} */ (event.data);
-    this._addUISourceCode(binding.network);
+    if (this._addUISourceCode(binding.network))
+      this.uiSourceCodeAdded(binding.network);
   }
 
   /**
@@ -247,16 +251,26 @@ Sources.NavigatorView = class extends UI.VBox {
 
   /**
    * @param {!Workspace.UISourceCode} uiSourceCode
-   * @return {?SDK.ResourceTreeFrame}
+   * @return {!Array<?SDK.ResourceTreeFrame>}
    */
-  _uiSourceCodeFrame(uiSourceCode) {
-    var frame = Bindings.NetworkProject.frameForProject(uiSourceCode.project());
-    if (!frame) {
+  _uiSourceCodeFrames(uiSourceCode) {
+    var frames = Bindings.NetworkProject.framesForUISourceCode(uiSourceCode).slice();
+    if (!frames.length) {
       var target = Bindings.NetworkProject.targetForProject(uiSourceCode.project());
       var resourceTreeModel = target && SDK.ResourceTreeModel.fromTarget(target);
-      frame = resourceTreeModel && resourceTreeModel.mainFrame;
+      var frame = resourceTreeModel && resourceTreeModel.mainFrame;
+      frames.push(frame ? frame : null);
     }
-    return frame;
+    return frames;
+  }
+
+  /**
+   * @param {!Bindings.NetworkProjectManager.FrameAttributionChangedEvent} event
+   */
+  _frameAttributionChanged(event) {
+    var uiSourceCode = event.uiSourceCode;
+    this._removeUISourceCode(uiSourceCode);
+    this._addUISourceCode(uiSourceCode);
   }
 
   /**
@@ -264,11 +278,11 @@ Sources.NavigatorView = class extends UI.VBox {
    */
   _addUISourceCode(uiSourceCode) {
     if (!this.accept(uiSourceCode))
-      return;
+      return false;
 
     var binding = Persistence.persistence.binding(uiSourceCode);
     if (!Runtime.experiments.isEnabled('persistence2') && binding && binding.network === uiSourceCode)
-      return;
+      return false;
 
     var isFromSourceMap = uiSourceCode.contentType().isFromSourceMap();
     var path;
@@ -279,14 +293,18 @@ Sources.NavigatorView = class extends UI.VBox {
 
     var project = uiSourceCode.project();
     var target = Bindings.NetworkProject.targetForUISourceCode(uiSourceCode);
-    var frame = this._uiSourceCodeFrame(uiSourceCode);
+    var frames = this._uiSourceCodeFrames(uiSourceCode);
+    var uiSourceCodeNodes = [];
+    for (var frame of frames) {
+      var folderNode =
+          this._folderNode(uiSourceCode, project, target, frame, uiSourceCode.origin(), path, isFromSourceMap);
+      var uiSourceCodeNode = new Sources.NavigatorUISourceCodeTreeNode(this, uiSourceCode, frame);
+      folderNode.appendChild(uiSourceCodeNode);
+      uiSourceCodeNodes.push(uiSourceCodeNode);
+    }
 
-    var folderNode =
-        this._folderNode(uiSourceCode, project, target, frame, uiSourceCode.origin(), path, isFromSourceMap);
-    var uiSourceCodeNode = new Sources.NavigatorUISourceCodeTreeNode(this, uiSourceCode);
-    this._uiSourceCodeNodes.set(uiSourceCode, [uiSourceCodeNode]);
-    folderNode.appendChild(uiSourceCodeNode);
-    this.uiSourceCodeAdded(uiSourceCode);
+    this._uiSourceCodeNodes.set(uiSourceCode, uiSourceCodeNodes);
+    return true;
   }
 
   /**
@@ -300,7 +318,8 @@ Sources.NavigatorView = class extends UI.VBox {
    */
   _uiSourceCodeAdded(event) {
     var uiSourceCode = /** @type {!Workspace.UISourceCode} */ (event.data);
-    this._addUISourceCode(uiSourceCode);
+    if (this._addUISourceCode(uiSourceCode))
+      this.uiSourceCodeAdded(uiSourceCode);
   }
 
   /**
@@ -532,7 +551,7 @@ Sources.NavigatorView = class extends UI.VBox {
 
       var project = uiSourceCode.project();
       var target = Bindings.NetworkProject.targetForUISourceCode(uiSourceCode);
-      var frame = this._uiSourceCodeFrame(uiSourceCode);
+      var frame = node.frame();
 
       var parentNode = node.parent;
       parentNode.removeChild(node);
@@ -1238,13 +1257,22 @@ Sources.NavigatorUISourceCodeTreeNode = class extends Sources.NavigatorTreeNode
   /**
    * @param {!Sources.NavigatorView} navigatorView
    * @param {!Workspace.UISourceCode} uiSourceCode
+   * @param {?SDK.ResourceTreeFrame} frame
    */
-  constructor(navigatorView, uiSourceCode) {
+  constructor(navigatorView, uiSourceCode, frame) {
     super(uiSourceCode.project().id() + ':' + uiSourceCode.url(), Sources.NavigatorView.Types.File);
     this._navigatorView = navigatorView;
     this._uiSourceCode = uiSourceCode;
     this._treeElement = null;
     this._eventListeners = [];
+    this._frame = frame;
+  }
+
+  /**
+   * @return {?SDK.ResourceTreeFrame}
+   */
+  frame() {
+    return this._frame;
   }
 
   /**