Adding regex support to search bar in dev tools console

Source/devtools/front_end/components/SearchableView.js

Index: Source/devtools/front_end/components/SearchableView.js
diff --git a/Source/devtools/front_end/components/SearchableView.js b/Source/devtools/front_end/components/SearchableView.js
index dd4021a9d8d9b32fd6410a1ff5d68b2fe85cb7b0..ba11a5dc51ae609052a8bec996e5315a4faf8870 100644
--- a/Source/devtools/front_end/components/SearchableView.js
+++ b/Source/devtools/front_end/components/SearchableView.js
@@ -33,9 +33,11 @@
  * @constructor
  * @extends {WebInspector.VBox}
  * @param {!WebInspector.Searchable} searchable
+ * @param {!boolean} supportRegex

[eustas, 2014/10/06 08:16:07]

If you make this parameter optional, then you can remove changes in all
panels/views except console.

Like this:
@param {?boolean=} supportRegex

[robwu, 2014/10/06 08:30:21]

After looking over the rest, I'm not sure if this parameter belongs here. I
think that you should default to plain text, and save the regex preference when
the user changes the checkbox value. When the view is rendered again, you use
the saved preference to render the correct checkbox.

[aknudsen, 2014/10/07 19:39:56]

Done.

  */
-WebInspector.SearchableView = function(searchable)
+WebInspector.SearchableView = function(searchable, supportRegex)
 {
+    var self = this;

[eustas, 2014/10/06 08:16:07]

We usually don't do that way.

[robwu, 2014/10/06 08:30:21]

Remove this and use "this" instead of "self".

[aknudsen, 2014/10/07 19:39:56]

Done.

[aknudsen, 2014/10/07 19:39:57]

Done.

     WebInspector.VBox.call(this);
 
     this._searchProvider = searchable;
@@ -114,6 +116,24 @@ WebInspector.SearchableView = function(searchable)
     this._replaceLabelElement.textContent = WebInspector.UIString("Replace");
     this._replaceLabelElement.setAttribute("for", replaceCheckboxId);
 
+    if (supportRegex) {
+      self._regexElement = self._firstRowElement.createChild("td").createChild("span");
+
+      self._regexCheckboxElement = self._regexElement.createChild("input");
+      self._regexCheckboxElement.type = "checkbox";
+      var regexCheckboxId = "search-regex-trigger" + self._uniqueId;
+      self._regexCheckboxElement.id = regexCheckboxId;
+      self.enableRegex = false;
+      self._regexCheckboxElement.addEventListener("change", function (event) {

[eustas, 2014/10/06 08:16:07]

Don't inline function and bind it to this.

[aknudsen, 2014/10/07 19:39:56]

Done.

+        self.enableRegex = event.target.checked;
+        self._performSearch(true, true, true);
+      }, false);

[robwu, 2014/10/06 08:30:21]

Move the contents of this function to a separate member of this object with an
apprioiate underscore-prefixed name, and use .addEventListener("change",
this._someName.bind(this), false); to bind the "this" context (this eliminates
the need for "var self = this;").

[aknudsen, 2014/10/07 19:39:56]

Done.

+
+      self._regexLabelElement = self._regexElement.createChild("label");
+      self._regexLabelElement.textContent = WebInspector.UIString("Regex");
+      self._regexElement.setAttribute("for", regexCheckboxId);

[robwu, 2014/10/06 08:30:21]

Change to

this._regexLabelElement.setAttribute("for", regexCheckboxId);

[aknudsen, 2014/10/07 19:39:56]

Done.

+    }
+
     // Column 5
     var cancelButtonElement = this._firstRowElement.createChild("td").createChild("button");
     cancelButtonElement.textContent = WebInspector.UIString("Cancel");