Improved click handling

css/highlight.css

@@ -1,6 +1,7 @@
 circle {
     stroke: white;
     fill: transparent;
+    stroke-width: 8px;
 }
 
 mask circle {

lib/card/highlight.js

@@ -215,6 +215,9 @@ export default class Highlight extends Object {
             this._bringToFront(target)
 
             let svgRoot = target.closest('svg')
+            if (svgRoot == null) {
+                return
+            }
             let image = svgRoot.querySelector('image')
 
             // eslint-disable-next-line no-unused-vars

lib/card/wrapper.js

@@ -45,8 +45,22 @@ export default class CardWrapper extends Object {
         )
     }
 
+    isClickPrevented(node) {
+        if (node == null) {
+            return false
+        }
+        if (node.style && node.style.pointerEvents == 'none') {
+            return true
+        }
+        return this.isClickPrevented(node.parentNode)
+    }
+
     isClickable(node) {
         if (node == null) return false
+      //  console.log("isClickable", node, this.isClickPrevented(node))
+        if (this.isClickPrevented(node)) {
+            return false
+        }
         if (node.tagName == 'A' && node.hasAttribute('href')) return true
         if (node.hasAttribute('onclick')) return true
         return false
@@ -140,6 +154,7 @@ export default class CardWrapper extends Object {
     }
 
     nodeTapped(node, event) {
+        console.log("nodeTapped", node, this.isClickable(node))
         if (this.isClickable(node)) {
             this.simulateClick(node, event)
             return true
@@ -150,6 +165,7 @@ export default class CardWrapper extends Object {
             return true
         }
         for (let [selector, handler] of this.tapHandler.entries()) {
+            console.log("nodeTapped", selector)
             for (let obj of this.domNode.querySelectorAll(selector)) {
                 if (node == obj) {
                     handler(event)
@@ -161,8 +177,10 @@ export default class CardWrapper extends Object {
     }
 
     tap(event, calledBy = 'unknown') {
+        
         if (event.isTrusted) {
             let node = this.nearestActive(event)
+            console.log("tap", node)
             this.nodeTapped(node, event)
 
             /*  let node = document.elementFromPoint(event.clientX, event.clientY)