Bug 1342297 - Propagate keypress events from the child frames to the toolbox. r=ochameau draft
authorTim Nguyen <ntim.bugs@gmail.com>
Sat, 25 Feb 2017 13:14:34 +0000
changeset 489664 cc410cd568de56d9453e68a9642b23b91d323998
parent 489663 209ac747ca55f2a72270cc37a8a3672ea7ddd2fd
child 489665 410c046949afc77173c3c3edf3dc8bf32b6b1b41
push id46875
push userbmo:ntim.bugs@gmail.com
push dateSat, 25 Feb 2017 13:15:07 +0000
reviewersochameau
bugs1342297
milestone54.0a1
Bug 1342297 - Propagate keypress events from the child frames to the toolbox. r=ochameau MozReview-Commit-ID: 3u17W167bdi
devtools/client/framework/toolbox.js
--- a/devtools/client/framework/toolbox.js
+++ b/devtools/client/framework/toolbox.js
@@ -1423,16 +1423,19 @@ Toolbox.prototype = {
 
     let onLoad = () => {
       // Prevent flicker while loading by waiting to make visible until now.
       iframe.style.visibility = "visible";
 
       // Try to set the dir attribute as early as possible.
       this.setIframeDocumentDir(iframe);
 
+      // Propagate keypress event from frame to toolbox
+      this.setIframeKeypressListener(iframe);
+
       // The build method should return a panel instance, so events can
       // be fired with the panel as an argument. However, in order to keep
       // backward compatibility with existing extensions do a check
       // for a promise return value.
       let built = definition.build(iframe.contentWindow, this);
 
       if (!(typeof built.then == "function")) {
         let panel = built;
@@ -1524,16 +1527,31 @@ Toolbox.prototype = {
       let top = this.win.top;
       let topDocEl = top.document.documentElement;
       let isRtl = top.getComputedStyle(topDocEl).direction === "rtl";
       docEl.setAttribute("dir", isRtl ? "rtl" : "ltr");
     }
   },
 
   /**
+   * Due to the use of content event handling, keypress events in the child iframes
+   * are not propagated to the toolbox window
+   *
+   * @param {IframeElement} iframe
+   */
+  setIframeKeypressListener: function (iframe) {
+    iframe.contentWindow.addEventListener("keypress", (e) => {
+      for (let eventName of ["keypress", "keydown", "keyup"]) {
+        let event = new this.win.KeyboardEvent(eventName, e);
+        this.doc.dispatchEvent(event);
+      }
+    });
+  },
+
+  /**
    * Mark all in collection as unselected; and id as selected
    * @param {string} collection
    *        DOM collection of items
    * @param {string} id
    *        The Id of the item within the collection to select
    */
   selectSingleNode: function (collection, id) {
     [...collection].forEach(node => {