Tweak besTAService and besService for successful popup display

service.js

@@ -471,11 +471,14 @@ class BesService {
    * @param {PointerEvent} event The event produced by a pointer such as the geometry of the contact point, the device type that generated the event, the amount of pressure that was applied on the contact surface, etc.
    */
   static handleClick(event) {
-    const hostElement = BesService.findParent(event.target)
+    const source = event?.detail || event
+    const hostElement = BesService.findParent(
+      source.targetElement || source.target
+    )
     let service = besServices.find(e => e.hostElement === hostElement)
     if (!service) return
-    const target = service.getBlockParent(event.target)
-    service.renderPopup(target, event.clientX, event.clientY)
+    const target = service.getBlockParent(source.targetElement || source.target)
+    service.renderPopup(target, source.clientX, source.clientY)
   }
 
   /**
@@ -676,6 +679,22 @@ class BesTAService {
     this.cloneDiv = this.createCloneDiv(textAreaEl)
     this.service = BesService.register(this.cloneDiv)
     this.textAreaEl.addEventListener('input', () => this.handleInput())
+    this.textAreaEl.addEventListener('click', e => {
+      //TODO: Consider adding some kind of proofing?
+      this.textAreaEl.style.display = 'none'
+      const deepestElement = document.elementFromPoint(e.clientX, e.clientY)
+      this.textAreaEl.style.display = ''
+
+      const clickEvent = new CustomEvent('click', {
+        detail: {
+          clientX: e.clientX,
+          clientY: e.clientY,
+          targetElement: deepestElement
+        }
+      })
+
+      this.cloneDiv.dispatchEvent(clickEvent)
+    })
   }
 
   createCloneDiv(textAreaEl) {