[DevTools] Search in Elements tab is not working for newly added elements

third_party/WebKit/Source/devtools/front_end/elements/ElementsPanel.js

Index: third_party/WebKit/Source/devtools/front_end/elements/ElementsPanel.js
diff --git a/third_party/WebKit/Source/devtools/front_end/elements/ElementsPanel.js b/third_party/WebKit/Source/devtools/front_end/elements/ElementsPanel.js
index fab103e3cd75237967b1aadd9579034955290831..6117171d951d29d11af105c9b32b7167c43f4f6f 100644
--- a/third_party/WebKit/Source/devtools/front_end/elements/ElementsPanel.js
+++ b/third_party/WebKit/Source/devtools/front_end/elements/ElementsPanel.js
@@ -461,11 +461,15 @@ Elements.ElementsPanel = class extends UI.Panel {
    * @param {!UI.SearchableView.SearchConfig} searchConfig
    * @param {boolean} shouldJump
    * @param {boolean=} jumpBackwards
+   * @param {boolean=} reset
    */
-  performSearch(searchConfig, shouldJump, jumpBackwards) {
+  performSearch(searchConfig, shouldJump, jumpBackwards, reset) {
     var query = searchConfig.query;
-    // Call searchCanceled since it will reset everything we need before doing a new search.
-    this.searchCanceled();
+    if (reset)
+      // Call searchCanceled since it will reset everything we need before doing a new search.
+      this.searchCanceled();
+    else
+      this._hideSearchHighlights();
 
     const whitespaceTrimmedQuery = query.trim();
     if (!whitespaceTrimmedQuery.length)
@@ -498,10 +502,18 @@ Elements.ElementsPanel = class extends UI.Panel {
       this._searchableView.updateSearchMatchesCount(this._searchResults.length);
       if (!this._searchResults.length)
         return;
-      this._currentSearchResultIndex = -1;
+      if (reset || typeof this._currentSearchResultIndex === 'undefined')
+        this._currentSearchResultIndex = -1;
+
+      var index = this._currentSearchResultIndex;
 
-      if (shouldJump)
-        this._jumpToSearchResult(jumpBackwards ? -1 : 0);
+      if (shouldJump) {
+        if (index === -1)
+          index = jumpBackwards ? -1 : 0;
+        else
+          index = jumpBackwards ? index - 1 : index + 1;
+        this._jumpToSearchResult(index);
+      }
     }
   }
 
@@ -554,7 +566,10 @@ Elements.ElementsPanel = class extends UI.Panel {
 
   _jumpToSearchResult(index) {
     this._hideSearchHighlights();
-    this._currentSearchResultIndex = (index + this._searchResults.length) % this._searchResults.length;
+    if (index > this._searchResults.length)
+      this._currentSearchResultIndex = 0;
+    else
+      this._currentSearchResultIndex = (index + this._searchResults.length) % this._searchResults.length;
     this._highlightCurrentSearchResult();
   }
 
@@ -630,7 +645,8 @@ Elements.ElementsPanel = class extends UI.Panel {
   }
 
   _hideSearchHighlights() {
-    if (!this._searchResults || !this._searchResults.length || this._currentSearchResultIndex < 0)
+    if (!this._searchResults || !this._searchResults.length || this._currentSearchResultIndex < 0 ||
+        this._currentSearchResultIndex > this._searchResults.length - 1)
       return;
     var searchResult = this._searchResults[this._currentSearchResultIndex];
     if (!searchResult.node)