release: v2.9.1

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 2.9.1 (20 Dec 2022)
+
+* fix(elements): select element using touch events
+
 ## 2.9.0 (20 Dec 2022)
 
 * feat(elements): integrate dom viewer

package.json

@@ -1,6 +1,6 @@
 {
   "name": "eruda",
-  "version": "2.9.0",
+  "version": "2.9.1",
   "description": "Console for Mobile Browsers",
   "main": "eruda.js",
   "browserslist": [
@@ -44,7 +44,7 @@
     "autoprefixer": "^9.7.4",
     "babel-eslint": "^10.1.0",
     "babel-loader": "^8.2.5",
-    "chobitsu": "^1.4.3",
+    "chobitsu": "^1.4.4",
     "core-js": "^3.26.1",
     "css-loader": "^3.4.2",
     "es-check": "^6.2.1",
@@ -65,7 +65,7 @@
     "licia": "^1.37.0",
     "luna-console": "^1.2.0",
     "luna-data-grid": "^0.3.2",
-    "luna-dom-viewer": "^1.2.2",
+    "luna-dom-viewer": "^1.2.3",
     "luna-modal": "^1.0.0",
     "luna-notification": "^0.1.4",
     "luna-object-viewer": "^0.2.4",

src/Elements/Detail.js

@@ -231,10 +231,12 @@ export default class Detail {
       <span class="${c('element-name')}">${data.name}</span>
       <span class="${c('icon-refresh refresh')}"></span>
     </div>
-    ${attribute}
-    ${styles}
-    ${computedStyle}
-    ${listeners}`
+    <div class="${c('element')}">
+      ${attribute}
+      ${styles}
+      ${computedStyle}
+      ${listeners}
+    </div>`
 
     this._$container.html(html).show()
   }

src/Elements/Elements.js

@@ -51,7 +51,7 @@ export default class Elements extends Tool {
     super.show()
 
     if (!this._curNode) {
-      this._setNode(document.body)
+      this.select(document.body)
     }
   }
   // To be removed in 3.0.0
@@ -59,6 +59,7 @@ export default class Elements extends Tool {
     return this.select(node)
   }
   select(node) {
+    this._domViewer.select(node)
     this._setNode(node)
     this.emit('change', node)
     return this
@@ -155,7 +156,7 @@ export default class Elements extends Tool {
       }
 
       if (isElExist(node)) {
-        self._setNode(node)
+        self.select(node)
       }
     })
 
@@ -226,7 +227,6 @@ export default class Elements extends Tool {
     if (node === this._curNode) return
 
     this._curNode = node
-    this._domViewer.select(node)
     this._renderCrumbs()
 
     const parentQueue = []

src/Elements/Elements.scss

@@ -52,7 +52,6 @@
   }
   .detail {
     @include absolute();
-    @include overflow-auto(y);
     z-index: 10;
     padding-top: 40px;
     display: none;
@@ -74,6 +73,10 @@
         right: 0;
       }
     }
+    .element {
+      @include overflow-auto(y);
+      height: 100%;
+    }
   }
   .section {
     border-bottom: 1px solid var(--border);

src/style/luna.scss

@@ -235,7 +235,8 @@
     }
     &.luna-dom-viewer-selected:focus {
       .luna-dom-viewer-selection {
-        background: var(--contrast);
+        background: var(--accent);
+        opacity: 0.2;
       }
     }
   }