DevTools: cleanup button styles

third_party/WebKit/Source/devtools/front_end/ui/SearchableView.js

Index: third_party/WebKit/Source/devtools/front_end/ui/SearchableView.js
diff --git a/third_party/WebKit/Source/devtools/front_end/ui/SearchableView.js b/third_party/WebKit/Source/devtools/front_end/ui/SearchableView.js
index 3d33e23230a293790192b26aa4a91539c1544a66..8c8e917ac3683650950ca4586e9ea446f96c0d7d 100644
--- a/third_party/WebKit/Source/devtools/front_end/ui/SearchableView.js
+++ b/third_party/WebKit/Source/devtools/front_end/ui/SearchableView.js
@@ -103,43 +103,40 @@ UI.SearchableView = class extends UI.VBox {
     // Build the buttons (Find, Previous, Replace, Replace All).
     this._buttonsContainer = this._footerElement.createChild('div', 'toolbar-search-buttons hidden');
 
-    var findButtonElement = this._buttonsContainer.createChild('button', 'search-action-button');
-    findButtonElement.textContent = Common.UIString('Find');
+    var findButtonElement =
+        UI.createTextButton(Common.UIString('Find'), this._onFindClick.bind(this), 'search-action-button');
     findButtonElement.tabIndex = -1;
-    findButtonElement.addEventListener('click', this._onFindClick.bind(this), false);
+    this._buttonsContainer.appendChild(findButtonElement);
 
-    var prevButtonElement = this._buttonsContainer.createChild('button', 'search-action-button');
-    prevButtonElement.textContent = Common.UIString('Previous');
+    var prevButtonElement =
+        UI.createTextButton(Common.UIString('Previous'), this._onPreviousClick.bind(this), 'search-action-button');
     prevButtonElement.tabIndex = -1;
-    prevButtonElement.addEventListener('click', this._onPreviousClick.bind(this), false);
+    this._buttonsContainer.appendChild(prevButtonElement);
 
-    this._replaceButtonElement = this._buttonsContainer.createChild('button', 'search-action-button');
-    this._replaceButtonElement.textContent = Common.UIString('Replace');
+    this._replaceButtonElement =
+        UI.createTextButton(Common.UIString('Replace'), this._replace.bind(this), 'search-action-button');
     this._replaceButtonElement.disabled = true;
     this._replaceButtonElement.tabIndex = -1;
-    this._replaceButtonElement.addEventListener('click', this._replace.bind(this), false);
+    this._buttonsContainer.appendChild(this._replaceButtonElement);
 
-    var replaceAllButtonElement = this._buttonsContainer.createChild('button', 'search-action-button');
-    replaceAllButtonElement.textContent = Common.UIString('Replace All');
-    replaceAllButtonElement.addEventListener('click', this._replaceAll.bind(this), false);
+    var replaceAllButtonElement =
+        UI.createTextButton(Common.UIString('Replace All'), this._replaceAll.bind(this), 'search-action-button');
+    this._buttonsContainer.appendChild(replaceAllButtonElement);
 
     // Build the replace checkbox and cancel button.
     this._replaceElement = this._footerElement.createChild('div').createChild('span', 'toolbar-replace-checkbox');
 
     var replaceLabelElement = UI.CheckboxLabel.create(Common.UIString('Replace'));
     this._replaceCheckboxElement = replaceLabelElement.checkboxElement;
-    var uniqueId = ++UI.SearchableView._lastUniqueId;

[einbinder, 2017/05/31 21:20:10]

What was this doing? Looks interesting.

[luoe, 2017/05/31 21:42:49]

It looks like there used to be a bug when multiple SearchableViews were shown on
the screen, and clicking 'Replace' on one would affect another, and this logic
ensured uniqueness (https://codereview.chromium.org/232133008).

At the time, SearchableView made its own checkbox, and then later migrated to
the UIUtils component (https://codereview.chromium.org/805853002).

Todays UIUtils.CheckboxLabel already has unique, incrementing IDs built in as of
(https://codereview.chromium.org/2776263006), so these lines are old.

-    var replaceCheckboxId = 'search-replace-trigger' + uniqueId;
-    this._replaceCheckboxElement.id = replaceCheckboxId;
     this._replaceCheckboxElement.addEventListener('change', this._updateSecondRowVisibility.bind(this), false);
 
     this._replaceElement.appendChild(replaceLabelElement);
 
-    var cancelButtonElement = this._footerElement.createChild('div').createChild('button', 'search-action-button');
-    cancelButtonElement.textContent = Common.UIString('Cancel');
+    var cancelButtonElement =
+        UI.createTextButton(Common.UIString('Cancel'), this.closeSearch.bind(this), 'search-action-button');
     cancelButtonElement.tabIndex = -1;
-    cancelButtonElement.addEventListener('click', this.closeSearch.bind(this), false);
     this._minimalSearchQuerySize = 3;
+    this._footerElement.createChild('div').appendChild(cancelButtonElement);
 
     this._loadSetting();
   }
@@ -510,7 +507,6 @@ UI.SearchableView = class extends UI.VBox {
   }
 };
 
-UI.SearchableView._lastUniqueId = 0;
 
 UI.SearchableView._symbol = Symbol('searchableView');