[DevTools] show inlined shortcuts for go to location

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

 /*
  * Copyright (C) 2011 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 535 matching lines @@
    * @param {!Workspace.UILocation} uiLocation
    */
   setExecutionLocation(uiLocation) {
     this._executionLocation = uiLocation;
     if (!this.loaded)
       return;
 
     this.textEditor.setExecutionLocation(uiLocation.lineNumber, uiLocation.columnNumber);
     if (this.isShowing()) {
       // We need SourcesTextEditor to be initialized prior to this call. @see crbug.com/506566
-      setImmediate(this._generateValuesInSource.bind(this));
+      setImmediate(() => {
+        this._generateValuesInSource();
+        if (Runtime.experiments.isEnabled('inlineContinueToLocation'))
+          this._showContinueToLocations();
+      });
     }
   }
 
   _generateValuesInSource() {
     if (!Common.moduleSetting('inlineVariableValues').get())
       return;
     var executionContext = UI.context.flavor(SDK.ExecutionContext);
     if (!executionContext)
       return;
     var callFrame = UI.context.flavor(SDK.DebuggerModel.CallFrame);
     if (!callFrame)
       return;
 
     var localScope = callFrame.localScope();
     var functionLocation = callFrame.functionLocation();
     if (localScope && functionLocation) {
       Sources.SourceMapNamesResolver.resolveScopeInObject(localScope)
           .getAllProperties(false, false, this._prepareScopeVariables.bind(this, callFrame));
     }
 
     if (this._clearValueWidgetsTimer) {
       clearTimeout(this._clearValueWidgetsTimer);
       delete this._clearValueWidgetsTimer;
     }
   }
 
+  _showContinueToLocations() {
+    var executionContext = UI.context.flavor(SDK.ExecutionContext);
+    if (!executionContext)
+      return;
+    var callFrame = UI.context.flavor(SDK.DebuggerModel.CallFrame);
+    if (!callFrame)
+      return;
+    var localScope = callFrame.localScope();
+    if (!localScope)
+      return;
+    var start = localScope.startLocation();
+    var end = localScope.endLocation();
+    var executionLocation = callFrame.location();
+    var debuggerModel = callFrame.debuggerModel;
+    debuggerModel.getPossibleBreakpoints(start, end, true)
+        .then(locations => this.textEditor.operation(renderLocations.bind(this, locations)));
+
+    if (this._clearContinueToLocationsTimer) {
+      clearTimeout(this._clearContinueToLocationsTimer);
+      delete this._clearContinueToLocationsTimer;
+    }
+
+    /**
+     * @param {!Array<!SDK.DebuggerModel.Location>} locations
+     * @this {Sources.JavaScriptSourceFrame}
+     */
+    function renderLocations(locations) {
+      var bookmarks = this.textEditor.bookmarks(
+          this.textEditor.fullRange(), Sources.JavaScriptSourceFrame.continueToLocationDecorationSymbol);
+      this.textEditor.operation(() => bookmarks.map(bookmark => bookmark.clear()));

[dgozman, 2017/02/24 19:49:42]

This function is already run as operation. Just call bookmark.clear() directly?

[kozy, 2017/02/24 20:04:46]

Done.

+
+      for (var location of locations) {
+        if (location.lineNumber === executionLocation.lineNumber &&
+            location.columnNumber === executionLocation.columnNumber)
+          continue;

[dgozman, 2017/02/24 19:49:42]

So, the current one will appear/disappear anyway?

[kozy, 2017/02/24 20:04:46]

Yes..
I removed this logic because in case of more then one dot in line, e.g.:
promise.then().then().then() 
it forces all other dots jumps - it doesn't look good.

+        var icon = UI.Icon.create('smallicon-green-ball');
+        icon.classList.add('cm-continue-to-location');
+        icon.addEventListener('click', location.continueToLocation.bind(location));
+        icon.addEventListener('mousemove', hidePopoverAndConsumeEvent.bind(this));
+        this.textEditor.addBookmark(
+            location.lineNumber, location.columnNumber, icon,
+            Sources.JavaScriptSourceFrame.continueToLocationDecorationSymbol);
+      }
+    }
+
+    /**
+     * @param {!Event} event
+     * @this {Sources.JavaScriptSourceFrame}
+     */
+    function hidePopoverAndConsumeEvent(event) {
+      event.consume(true);
+      this._popoverHelper.hidePopover();
+    }
+  }
+
   /**
    * @param {!SDK.DebuggerModel.CallFrame} callFrame
    * @param {?Array.<!SDK.RemoteObjectProperty>} properties
    * @param {?Array.<!SDK.RemoteObjectProperty>} internalProperties
    */
   _prepareScopeVariables(callFrame, properties, internalProperties) {
     if (!properties || !properties.length || properties.length > 500 || !this.isShowing()) {
       this._clearValueWidgets();
       return;
     }
@@ skipping 128 matching lines @@
         this.textEditor.addDecoration(widget, i);
       }
     }
   }
 
   clearExecutionLine() {
     if (this.loaded && this._executionLocation)
       this.textEditor.clearExecutionLine();
     delete this._executionLocation;
     this._clearValueWidgetsTimer = setTimeout(this._clearValueWidgets.bind(this), 1000);
+    if (Runtime.experiments.isEnabled('inlineContinueToLocation'))
+      this._clearContinueToLocationsTimer = setTimeout(this._clearContinueToLocations.bind(this), 1000);
   }
 
   _clearValueWidgets() {
     delete this._clearValueWidgetsTimer;
     for (var line of this._valueWidgets.keys())
       this.textEditor.removeDecoration(this._valueWidgets.get(line), line);
     this._valueWidgets.clear();
   }
 
+  _clearContinueToLocations() {
+    delete this._clearContinueToLocationsTimer;
+    var bookmarks = this.textEditor.bookmarks(
+        this.textEditor.fullRange(), Sources.JavaScriptSourceFrame.continueToLocationDecorationSymbol);
+    this.textEditor.operation(() => bookmarks.map(bookmark => bookmark.clear()));
+  }
+
   /**
    * @param {number} lineNumber
    * @return {!Array<!Sources.JavaScriptSourceFrame.BreakpointDecoration>}
    */
   _lineBreakpointDecorations(lineNumber) {
     return Array.from(this._breakpointDecorations)
         .filter(decoration => (decoration.handle.resolve() || {}).lineNumber === lineNumber);
   }
 
   /**
@@ skipping 625 matching lines @@
   hide() {
     if (!this.bookmark)
       return;
     this.bookmark.clear();
     this.bookmark = null;
   }
 };
 
 Sources.JavaScriptSourceFrame.BreakpointDecoration.bookmarkSymbol = Symbol('bookmark');
 Sources.JavaScriptSourceFrame.BreakpointDecoration._elementSymbolForTest = Symbol('element');
+
+Sources.JavaScriptSourceFrame.continueToLocationDecorationSymbol = Symbol('bookmark');