Bug 1650486 - guard search-textbox from multiple connectedCallbacks, so that we don't get multiple search icons. r=bgrins

Differential Revision: https://phabricator.services.mozilla.com/D86175

toolkit/content/tests/chrome/test_textbox_search.xhtml

@@ -9,7 +9,7 @@
   <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"/>
   <script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"/>
 
-  <hbox>
+  <hbox id="searchbox-container">
     <search-textbox id="searchbox"
                     oncommand="doSearch(this.value);"
                     placeholder="random placeholder"
@@ -29,6 +29,14 @@ var gLastTest;
 
 function doTests() {
   var textbox = $("searchbox");
+
+  // Reconnect the searchbox to ensure connectedCallback only runs once
+  // (bug 1650486).
+  textbox.remove();
+  $("searchbox-container").append(textbox);
+  is(textbox.shadowRoot.querySelectorAll(".textbox-search-sign").length, 1,
+      "only one search icon in the search box");
+
   var icons = textbox._searchIcons;
   var searchIcon = icons.querySelector(".textbox-search-icon");
   var clearIcon = icons.querySelector(".textbox-search-clear");

toolkit/content/widgets/search-textbox.js

@@ -71,9 +71,10 @@
     }
 
     connectedCallback() {
-      if (this.delayConnectedCallback()) {
+      if (this.delayConnectedCallback() || this.connected) {
         return;
       }
+      this.connected = true;
       this.textContent = "";
 
       const stylesheet = document.createElement("link");