Fix: Elements select

src/Elements/Elements.es6

@@ -15,6 +15,7 @@ export default class Elements extends Tool
         this._tpl = require('./Elements.hbs');
         this._rmDefComputedStyle = true;
         this._highlightElement = false;
+        this._selectElement = false;
     }
     init($el, parent)
     {
@@ -52,7 +53,6 @@ export default class Elements extends Tool
     _bindEvent()
     {
         var self = this,
-            parent = this._parent,
             select = this._select;
 
         this._$el.on('click', '.eruda-child', function ()
@@ -95,23 +95,10 @@ export default class Elements extends Tool
         $bottomBar.on('click', '.eruda-back', () => this._back())
                   .on('click', '.eruda-refresh', () => this._render())
                   .on('click', '.eruda-highlight', () => this._toggleHighlight())
-                  .on('click', '.eruda-select', () =>
-                  {
-                      parent.hide();
-                      if (this._highlightElement) this._toggleHighlight();
-                      this._render();
-
-                      this._select.enable();
-                  })
+                  .on('click', '.eruda-select', () => this._toggleSelect())
                   .on('click', '.eruda-reset', () => this._setEl(this._htmlEl));
 
-        select.on('select', (target) =>
-        {
-            parent.show();
-
-            if (!this._highlightElement) this._toggleHighlight();
-            this._setEl(target);
-        });
+        select.on('select', (target) => this._setEl(target));
     }
     _toggleAllComputedStyle()
     {
@@ -129,11 +116,30 @@ export default class Elements extends Tool
     }
     _toggleHighlight()
     {
+        if (this._selectElement) return;
+
         this._$el.find('.eruda-highlight').toggleClass('eruda-active');
         this._highlightElement = !this._highlightElement;
 
         this._render();
     }
+    _toggleSelect()
+    {
+        var select = this._select;
+
+        this._$el.find('.eruda-select').toggleClass('eruda-active');
+        if (!this._selectElement && !this._highlightElement) this._toggleHighlight();
+        this._selectElement = !this._selectElement;
+
+        if (this._selectElement)
+        {
+            select.enable();
+            this._parent.hide();
+        } else
+        {
+            select.disable();
+        }
+    }
     _setEl(el)
     {
         this._curEl = el;

src/Elements/Highlight.scss

@@ -5,6 +5,10 @@
     right: 0;
     opacity: .5;
     z-index: -100;
+    pointer-events: none !important;
+    * {
+        pointer-events: none !important;
+    }
     .margin {
         position: absolute;
         background: #e8925b;

src/Elements/Select.es6

@@ -10,7 +10,9 @@ export default class Select extends util.Emitter
 
         this._listener = function (e)
         {
-            self.disable().emit('select', e.target);
+            self.emit('select', e.target);
+
+            e.preventDefault();
 
             return false;
         };