Add: Elements set element api

dev/typo.dic

@@ -1,15 +0,0 @@
-anim
-autoprefixer
-btns
-devtool
-draggabilly
-eruda
-eustia
-focusin
-iframe
-iteratee
-onerror
-postcss
-scss
-textarea
-unenumerable

doc/CONTRIBUTING.md

@@ -24,7 +24,6 @@ npm run build
 
 ## Project Structure
 
-- **dev**: development related files.
 - **doc**: documents.
 - **eustia**: eustia extended utilties.
 - **script**: webpack configuration, and some other useful scripts.

doc/TOOL_API.md

@@ -74,6 +74,14 @@ Check dom element status.
 |-------------------|-------|---------------------|
 |overrideEventTarget|boolean|Catch Event Listeners|
 
+### set
+
+Set dom element to show.
+
+|Name|Type   |Desc              |
+|----|-------|------------------|
+|el  |element|Element to display|
+
 ## Network
 
 Display performance timing, resource timing and xhr requests.

src/Elements/Elements.es6

@@ -43,6 +43,13 @@ export default class Elements extends Tool
         if (!this._curEl) this._setEl(this._htmlEl);
         this._render();
     }
+    set(e)
+    {
+        this._setEl(e);
+        this._render();
+
+        return this;
+    }
     overrideEventTarget()
     {
         let winEventProto = getWinEventProto();
@@ -78,7 +85,7 @@ export default class Elements extends Tool
 
         while (!isElExist(parent)) parent = parentQueue.shift();
 
-        this._setElAndRender(parent);
+        this.set(parent);
     }
     _bindEvent()
     {
@@ -115,7 +122,7 @@ export default class Elements extends Tool
                 return;
             }
 
-            !isElExist(el) ? self._render() : self._setElAndRender(el);
+            !isElExist(el) ? self._render() : self.set(el);
         }).on('click', '.eruda-listener-content', function ()
         {
             let text = util.$(this).text(),
@@ -146,7 +153,7 @@ export default class Elements extends Tool
 
             while (idx-- && el.parentNode) el = el.parentNode;
 
-            !isElExist(el) ? self._render() : self._setElAndRender(el);
+            !isElExist(el) ? self._render() : self.set(el);
         }).on('click', '.toggle-all-computed-style', () => this._toggleAllComputedStyle());
 
         let $bottomBar = this._$el.find('.eruda-bottom-bar');
@@ -154,9 +161,9 @@ export default class Elements extends Tool
         $bottomBar.on('click', '.eruda-refresh', () => this._render())
                   .on('click', '.eruda-highlight', () => this._toggleHighlight())
                   .on('click', '.eruda-select', () => this._toggleSelect())
-                  .on('click', '.eruda-reset', () => this._setElAndRender(this._htmlEl));
+                  .on('click', '.eruda-reset', () => this.set(this._htmlEl));
 
-        select.on('select', target => this._setElAndRender(target));
+        select.on('select', target => this.set(target));
     }
     _toggleAllComputedStyle()
     {
@@ -208,11 +215,6 @@ export default class Elements extends Tool
         }
         this._curParentQueue = parentQueue;
     }
-    _setElAndRender(e)
-    {
-        this._setEl(e);
-        this._render();
-    }
     _getData()
     {
         let ret = {};

test/elements.js

@@ -0,0 +1,12 @@
+var tool = eruda.get('elements'),
+    $tool = $('.eruda-elements');
+
+describe('api', function ()
+{
+    it('set element', function ()
+    {
+        tool.set(document.body);
+        expect($tool.find('.eruda-parent')).toContainText('html');
+        expect($tool.find('.eruda-breadcrumb')).toContainText('body');
+    });
+});