5 files changed, 768 insertions, 0 deletions
diff --git a/toolkit/mozapps/handling/content/appChooser.js b/toolkit/mozapps/handling/content/appChooser.js
new file mode 100644
index 0000000000..328b4b8822
--- /dev/null
+++ b/toolkit/mozapps/handling/content/appChooser.js
@@ -0,0 +1,386 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { PrivateBrowsingUtils } = ChromeUtils.importESModule(
+  "resource://gre/modules/PrivateBrowsingUtils.sys.mjs"
+);
+const { EnableDelayHelper } = ChromeUtils.import(
+  "resource://gre/modules/SharedPromptUtils.jsm"
+);
+
+class MozHandler extends window.MozElements.MozRichlistitem {
+  static get markup() {
+    return `
+    <vbox pack="center">
+      <image height="32" width="32"/>
+    </vbox>
+    <vbox flex="1">
+      <label class="name"/>
+      <label class="description"/>
+    </vbox>
+    `;
+  }
+
+  connectedCallback() {
+    this.textContent = "";
+    this.appendChild(this.constructor.fragment);
+    this.initializeAttributeInheritance();
+  }
+
+  static get inheritedAttributes() {
+    return {
+      image: "src=image,disabled",
+      ".name": "value=name,disabled",
+      ".description": "value=description,disabled",
+    };
+  }
+
+  get label() {
+    return `${this.getAttribute("name")} ${this.getAttribute("description")}`;
+  }
+}
+
+customElements.define("mozapps-handler", MozHandler, {
+  extends: "richlistitem",
+});
+
+window.addEventListener("DOMContentLoaded", () => dialog.initialize(), {
+  once: true,
+});
+
+let loadPromise = new Promise(resolve => {
+  window.addEventListener("load", resolve, { once: true });
+});
+
+let dialog = {
+  /**
+   * This function initializes the content of the dialog.
+   */
+  initialize() {
+    let args = window.arguments[0].wrappedJSObject || window.arguments[0];
+    let { handler, outArgs, usePrivateBrowsing, enableButtonDelay } = args;
+
+    this._handlerInfo = handler.QueryInterface(Ci.nsIHandlerInfo);
+    this._outArgs = outArgs;
+
+    this.isPrivate =
+      usePrivateBrowsing ||
+      (window.opener && PrivateBrowsingUtils.isWindowPrivate(window.opener));
+
+    this._dialog = document.querySelector("dialog");
+    this._itemChoose = document.getElementById("item-choose");
+    this._rememberCheck = document.getElementById("remember");
+
+    // Register event listener for the checkbox hint.
+    this._rememberCheck.addEventListener("change", () => this.onCheck());
+
+    document.addEventListener("dialogaccept", () => {
+      this.onAccept();
+    });
+
+    // UI is ready, lets populate our list
+    this.populateList();
+
+    document.mozSubdialogReady = this.initL10n().then(() => {
+      window.sizeToContent();
+    });
+
+    if (enableButtonDelay) {
+      this._delayHelper = new EnableDelayHelper({
+        disableDialog: () => {
+          this._acceptBtnDisabled = true;
+          this.updateAcceptButton();
+        },
+        enableDialog: () => {
+          this._acceptBtnDisabled = false;
+          this.updateAcceptButton();
+        },
+        focusTarget: window,
+      });
+    }
+  },
+
+  async initL10n() {
+    document.l10n.pauseObserving();
+
+    let rememberLabel = document.getElementById("remember-label");
+    document.l10n.setAttributes(rememberLabel, "chooser-dialog-remember", {
+      scheme: this._handlerInfo.type,
+    });
+
+    let description = document.getElementById("description");
+    document.l10n.setAttributes(description, "chooser-dialog-description", {
+      scheme: this._handlerInfo.type,
+    });
+
+    document.l10n.resumeObserving();
+
+    await document.l10n.translateElements([rememberLabel, description]);
+    return document.l10n.ready;
+  },
+
+  /**
+   * Populates the list that a user can choose from.
+   */
+  populateList: function populateList() {
+    var items = document.getElementById("items");
+    var possibleHandlers = this._handlerInfo.possibleApplicationHandlers;
+    var preferredHandler = this._handlerInfo.preferredApplicationHandler;
+    for (let i = possibleHandlers.length - 1; i >= 0; --i) {
+      let app = possibleHandlers.queryElementAt(i, Ci.nsIHandlerApp);
+      let elm = document.createXULElement("richlistitem", {
+        is: "mozapps-handler",
+      });
+      elm.setAttribute("name", app.name);
+      elm.obj = app;
+
+      // We defer loading the favicon so it doesn't delay load. The dialog is
+      // opened in a SubDialog which will only show on window load.
+      if (app instanceof Ci.nsILocalHandlerApp) {
+        // See if we have an nsILocalHandlerApp and set the icon
+        let uri = Services.io.newFileURI(app.executable);
+        loadPromise.then(() => {
+          elm.setAttribute("image", "moz-icon://" + uri.spec + "?size=32");
+        });
+      } else if (app instanceof Ci.nsIWebHandlerApp) {
+        let uri = Services.io.newURI(app.uriTemplate);
+        if (/^https?$/.test(uri.scheme)) {
+          // Unfortunately we can't use the favicon service to get the favicon,
+          // because the service looks for a record with the exact URL we give
+          // it, and users won't have such records for URLs they don't visit,
+          // and users won't visit the handler's URL template, they'll only
+          // visit URLs derived from that template (i.e. with %s in the template
+          // replaced by the URL of the content being handled).
+          loadPromise.then(() => {
+            elm.setAttribute("image", uri.prePath + "/favicon.ico");
+          });
+        }
+        elm.setAttribute("description", uri.prePath);
+
+        // Check for extensions needing private browsing access before
+        // creating UI elements.
+        if (this.isPrivate) {
+          let policy = WebExtensionPolicy.getByURI(uri);
+          if (policy && !policy.privateBrowsingAllowed) {
+            elm.setAttribute("disabled", true);
+            this.getPrivateBrowsingDisabledLabel().then(label => {
+              elm.setAttribute("description", label);
+            });
+            if (app == preferredHandler) {
+              preferredHandler = null;
+            }
+          }
+        }
+      } else if (app instanceof Ci.nsIDBusHandlerApp) {
+        elm.setAttribute("description", app.method);
+      } else if (!(app instanceof Ci.nsIGIOMimeApp)) {
+        // We support GIO application handler, but no action required there
+        throw new Error("unknown handler type");
+      }
+
+      items.insertBefore(elm, this._itemChoose);
+      if (preferredHandler && app == preferredHandler) {
+        this.selectedItem = elm;
+      }
+    }
+
+    if (this._handlerInfo.hasDefaultHandler) {
+      let elm = document.createXULElement("richlistitem", {
+        is: "mozapps-handler",
+      });
+      elm.id = "os-default-handler";
+      elm.setAttribute("name", this._handlerInfo.defaultDescription);
+
+      items.insertBefore(elm, items.firstChild);
+      if (
+        this._handlerInfo.preferredAction == Ci.nsIHandlerInfo.useSystemDefault
+      ) {
+        this.selectedItem = elm;
+      }
+    }
+
+    // Add gio handlers
+    if (Cc["@mozilla.org/gio-service;1"]) {
+      let gIOSvc = Cc["@mozilla.org/gio-service;1"].getService(
+        Ci.nsIGIOService
+      );
+      var gioApps = gIOSvc.getAppsForURIScheme(this._handlerInfo.type);
+      for (let handler of gioApps.enumerate(Ci.nsIHandlerApp)) {
+        // OS handler share the same name, it's most likely the same app, skipping...
+        if (handler.name == this._handlerInfo.defaultDescription) {
+          continue;
+        }
+        // Check if the handler is already in possibleHandlers
+        let appAlreadyInHandlers = false;
+        for (let i = possibleHandlers.length - 1; i >= 0; --i) {
+          let app = possibleHandlers.queryElementAt(i, Ci.nsIHandlerApp);
+          // nsGIOMimeApp::Equals is able to compare with nsILocalHandlerApp
+          if (handler.equals(app)) {
+            appAlreadyInHandlers = true;
+            break;
+          }
+        }
+        if (!appAlreadyInHandlers) {
+          let elm = document.createXULElement("richlistitem", {
+            is: "mozapps-handler",
+          });
+          elm.setAttribute("name", handler.name);
+          elm.obj = handler;
+          items.insertBefore(elm, this._itemChoose);
+        }
+      }
+    }
+
+    items.ensureSelectedElementIsVisible();
+  },
+
+  /**
+   * Brings up a filepicker and allows a user to choose an application.
+   */
+  async chooseApplication() {
+    let title = await this.getChooseAppWindowTitle();
+
+    var fp = Cc["@mozilla.org/filepicker;1"].createInstance(Ci.nsIFilePicker);
+    fp.init(window, title, Ci.nsIFilePicker.modeOpen);
+    fp.appendFilters(Ci.nsIFilePicker.filterApps);
+
+    fp.open(rv => {
+      if (rv == Ci.nsIFilePicker.returnOK && fp.file) {
+        let uri = Services.io.newFileURI(fp.file);
+
+        let handlerApp = Cc[
+          "@mozilla.org/uriloader/local-handler-app;1"
+        ].createInstance(Ci.nsILocalHandlerApp);
+        handlerApp.executable = fp.file;
+
+        // if this application is already in the list, select it and don't add it again
+        let parent = document.getElementById("items");
+        for (let i = 0; i < parent.childNodes.length; ++i) {
+          let elm = parent.childNodes[i];
+          if (
+            elm.obj instanceof Ci.nsILocalHandlerApp &&
+            elm.obj.equals(handlerApp)
+          ) {
+            parent.selectedItem = elm;
+            parent.ensureSelectedElementIsVisible();
+            return;
+          }
+        }
+
+        let elm = document.createXULElement("richlistitem", {
+          is: "mozapps-handler",
+        });
+        elm.setAttribute("name", fp.file.leafName);
+        elm.setAttribute("image", "moz-icon://" + uri.spec + "?size=32");
+        elm.obj = handlerApp;
+
+        parent.selectedItem = parent.insertBefore(elm, parent.firstChild);
+        parent.ensureSelectedElementIsVisible();
+      }
+    });
+  },
+
+  /**
+   * Function called when the OK button is pressed.
+   */
+  onAccept() {
+    this.updateHandlerData(this._rememberCheck.checked);
+    this._outArgs.setProperty("openHandler", true);
+  },
+
+  /**
+   * Determines if the accept button should be disabled or not
+   */
+  updateAcceptButton() {
+    this._dialog.setAttribute(
+      "buttondisabledaccept",
+      this._acceptBtnDisabled || this._itemChoose.selected
+    );
+  },
+
+  /**
+   * Update the handler info to reflect the user choice.
+   * @param {boolean} skipAsk - Whether we should persist the application
+   * choice and skip asking next time.
+   */
+  updateHandlerData(skipAsk) {
+    // We need to make sure that the default is properly set now
+    if (this.selectedItem.obj) {
+      // default OS handler doesn't have this property
+      this._outArgs.setProperty(
+        "preferredAction",
+        Ci.nsIHandlerInfo.useHelperApp
+      );
+      this._outArgs.setProperty(
+        "preferredApplicationHandler",
+        this.selectedItem.obj
+      );
+    } else {
+      this._outArgs.setProperty(
+        "preferredAction",
+        Ci.nsIHandlerInfo.useSystemDefault
+      );
+    }
+    this._outArgs.setProperty("alwaysAskBeforeHandling", !skipAsk);
+  },
+
+  /**
+   * Updates the UI based on the checkbox being checked or not.
+   */
+  onCheck() {
+    if (document.getElementById("remember").checked) {
+      document.getElementById("remember-text").setAttribute("visible", "true");
+    } else {
+      document.getElementById("remember-text").removeAttribute("visible");
+    }
+  },
+
+  /**
+   * Function called when the user double clicks on an item of the list
+   */
+  onDblClick: function onDblClick() {
+    if (this.selectedItem == this._itemChoose) {
+      this.chooseApplication();
+    } else {
+      this._dialog.acceptDialog();
+    }
+  },
+
+  // Getters / Setters
+
+  /**
+   * Returns/sets the selected element in the richlistbox
+   */
+  get selectedItem() {
+    return document.getElementById("items").selectedItem;
+  },
+  set selectedItem(aItem) {
+    document.getElementById("items").selectedItem = aItem;
+  },
+
+  /**
+   *  Lazy l10n getter for the title of the app chooser window
+   */
+  async getChooseAppWindowTitle() {
+    if (!this._chooseAppWindowTitle) {
+      this._chooseAppWindowTitle = await document.l10n.formatValues([
+        "choose-other-app-window-title",
+      ]);
+    }
+    return this._chooseAppWindowTitle;
+  },
+
+  /**
+   * Lazy l10n getter for handler menu items which are disabled due to private
+   * browsing.
+   */
+  async getPrivateBrowsingDisabledLabel() {
+    if (!this._privateBrowsingDisabledLabel) {
+      this._privateBrowsingDisabledLabel = await document.l10n.formatValues([
+        "choose-dialog-privatebrowsing-disabled",
+      ]);
+    }
+    return this._privateBrowsingDisabledLabel;
+  },
+};
diff --git a/toolkit/mozapps/handling/content/appChooser.xhtml b/toolkit/mozapps/handling/content/appChooser.xhtml
new file mode 100644
index 0000000000..7aafa9d630
--- /dev/null
+++ b/toolkit/mozapps/handling/content/appChooser.xhtml
@@ -0,0 +1,52 @@
+<?xml version="1.0"?>
+<?xml-stylesheet href="chrome://global/skin/global.css"?>
+<?xml-stylesheet href="chrome://mozapps/content/handling/handler.css"?>
+<?xml-stylesheet href="chrome://mozapps/skin/handling/handling.css"?>
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+
+<!DOCTYPE window>
+
+<window persist="width height screenX screenY"
+        aria-describedby="description-text"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+        xmlns:html="http://www.w3.org/1999/xhtml"
+        data-l10n-id="chooser-window"
+        data-l10n-attrs="style">
+<dialog id="handling"
+        buttons="accept,cancel"
+        defaultButton="none"
+        data-l10n-id="chooser-dialog"
+        data-l10n-attrs="buttonlabelaccept, buttonaccesskeyaccept">
+  <linkset>
+    <html:link rel="localization" href="branding/brand.ftl"/>
+    <html:link rel="localization" href="toolkit/global/handlerDialog.ftl"/>
+  </linkset>
+
+  <script src="chrome://mozapps/content/handling/appChooser.js"
+          type="application/javascript"/>
+
+  <description id="description"/>
+
+  <vbox id="chooser" flex="1">
+    <richlistbox id="items" flex="1"
+                 ondblclick="dialog.onDblClick();"
+                 onselect="dialog.updateAcceptButton();">
+      <richlistitem id="item-choose" orient="horizontal" selected="true">
+        <label data-l10n-id="choose-other-app-description" flex="1"/>
+        <button oncommand="dialog.chooseApplication();"
+                data-l10n-id="choose-app-btn"/>
+      </richlistitem>
+    </richlistbox>
+  </vbox>
+
+  <vbox id="rememberContainer">
+    <html:label class="toggle-container-with-text">
+      <html:input type="checkbox" id="remember"/>
+      <html:span id="remember-label"/>
+    </html:label>
+    <description id="remember-text" data-l10n-id="chooser-dialog-remember-extra"/>
+  </vbox>
+</dialog>
+</window>
diff --git a/toolkit/mozapps/handling/content/handler.css b/toolkit/mozapps/handling/content/handler.css
new file mode 100644
index 0000000000..bde721a289
--- /dev/null
+++ b/toolkit/mozapps/handling/content/handler.css
@@ -0,0 +1,55 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+@namespace html "http://www.w3.org/1999/xhtml";
+
+#description {
+  font-weight: bold;
+}
+
+#remember-text:not([visible]) {
+  visibility: hidden;
+}
+
+dialog {
+  padding: 16px calc(16px - 4px);
+}
+
+#items,
+label, description {
+  margin: 0;
+}
+
+#items label {
+  margin-inline: 4px;
+}
+
+#description,
+#description-box,
+#rememberContainer,
+#chooser {
+  margin: 0 4px 16px;
+}
+
+/* avoid double inline margins when #description is nested: */
+#description-box > #description {
+  margin-inline: 0;
+}
+
+/* Parent selector to win on specificity against common.css */
+#rememberContainer > .toggle-container-with-text {
+  align-items: baseline;
+  color: var(--in-content-deemphasized-text);
+}
+
+.toggle-container-with-text > html|input[type="checkbox"] {
+  margin-inline-end: 8px;
+  /* Ensure the checkbox is properly aligned with the text: */
+  translate: 0 calc(1px + max(60% - .6em, 0px));
+}
+
+#rememberContainer:not([hidden]) {
+  /* Ensure we don't get sized to the smallest child when the checkbox text wraps. */
+  display: block;
+}
diff --git a/toolkit/mozapps/handling/content/permissionDialog.js b/toolkit/mozapps/handling/content/permissionDialog.js
new file mode 100644
index 0000000000..196d7e2411
--- /dev/null
+++ b/toolkit/mozapps/handling/content/permissionDialog.js
@@ -0,0 +1,232 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { EnableDelayHelper } = ChromeUtils.import(
+  "resource://gre/modules/SharedPromptUtils.jsm"
+);
+
+let dialog = {
+  /**
+   * This function initializes the content of the dialog.
+   */
+  initialize() {
+    let args = window.arguments[0].wrappedJSObject || window.arguments[0];
+    let {
+      handler,
+      principal,
+      outArgs,
+      canPersistPermission,
+      preferredHandlerName,
+      browsingContext,
+    } = args;
+
+    this._handlerInfo = handler.QueryInterface(Ci.nsIHandlerInfo);
+    this._principal = principal?.QueryInterface(Ci.nsIPrincipal);
+    this._addonPolicy =
+      this._principal?.addonPolicy ?? this._principal?.contentScriptAddonPolicy;
+    this._browsingContext = browsingContext;
+    this._outArgs = outArgs.QueryInterface(Ci.nsIWritablePropertyBag);
+    this._preferredHandlerName = preferredHandlerName;
+
+    this._dialog = document.querySelector("dialog");
+    this._checkRemember = document.getElementById("remember");
+    this._checkRememberContainer = document.getElementById("rememberContainer");
+
+    if (!canPersistPermission) {
+      this._checkRememberContainer.hidden = true;
+    }
+
+    let changeAppLink = document.getElementById("change-app");
+    if (this._preferredHandlerName) {
+      changeAppLink.hidden = false;
+
+      changeAppLink.addEventListener("click", () => this.onChangeApp());
+    }
+
+    document.addEventListener("dialogaccept", () => this.onAccept());
+    document.mozSubdialogReady = this.initL10n().then(() => {
+      window.sizeToContent();
+    });
+
+    this._delayHelper = new EnableDelayHelper({
+      disableDialog: () => {
+        this._dialog.setAttribute("buttondisabledaccept", true);
+      },
+      enableDialog: () => {
+        this._dialog.setAttribute("buttondisabledaccept", false);
+      },
+      focusTarget: window,
+    });
+  },
+
+  /**
+   * Checks whether the principal that triggered this dialog is top level
+   * (not embedded in a frame).
+   * @returns {boolean} - true if principal is top level, false otherwise.
+   * If the triggering principal is null this method always returns false.
+   */
+  triggeringPrincipalIsTop() {
+    if (!this._principal) {
+      return false;
+    }
+
+    let topContentPrincipal = this._browsingContext?.top.embedderElement
+      ?.contentPrincipal;
+    if (!topContentPrincipal) {
+      return false;
+    }
+    return this._principal.equals(topContentPrincipal);
+  },
+
+  /**
+   * Determines the l10n ID to use for the dialog description, depending on
+   * the triggering principal and the preferred application handler.
+   */
+  get l10nDescriptionId() {
+    if (this._addonPolicy) {
+      if (this._preferredHandlerName) {
+        return "permission-dialog-description-extension-app";
+      }
+      return "permission-dialog-description-extension";
+    }
+
+    if (this._principal?.schemeIs("file")) {
+      if (this._preferredHandlerName) {
+        return "permission-dialog-description-file-app";
+      }
+      return "permission-dialog-description-file";
+    }
+
+    // We only show the website address if the request didn't come from the top
+    // level frame. If we can't get a host to display, fall back to the copy
+    // without host.
+    if (!this.triggeringPrincipalIsTop() && this.displayPrePath) {
+      if (this._preferredHandlerName) {
+        return "permission-dialog-description-host-app";
+      }
+      return "permission-dialog-description-host";
+    }
+
+    if (this._preferredHandlerName) {
+      return "permission-dialog-description-app";
+    }
+
+    return "permission-dialog-description";
+  },
+
+  /**
+   * Determines the l10n ID to use for the "remember permission" checkbox,
+   * depending on the triggering principal and the preferred application
+   * handler.
+   */
+  get l10nCheckboxId() {
+    if (!this._principal) {
+      return null;
+    }
+
+    if (this._addonPolicy) {
+      return "permission-dialog-remember-extension";
+    }
+    if (this._principal.schemeIs("file")) {
+      return "permission-dialog-remember-file";
+    }
+    return "permission-dialog-remember";
+  },
+
+  /**
+   * Computes the prePath to show in the prompt. It's the prePath of the site
+   * that wants to navigate to the external protocol.
+   * @returns {string|null} - prePath to show, or null if we can't derive an
+   * exposable prePath from the triggering principal.
+   */
+  get displayPrePath() {
+    if (!this._principal) {
+      return null;
+    }
+
+    // NullPrincipals don't expose a meaningful prePath. Instead use the
+    // precursorPrincipal, which the NullPrincipal was derived from.
+    if (this._principal.isNullPrincipal) {
+      return this._principal.precursorPrincipal?.exposablePrePath;
+    }
+
+    return this._principal?.exposablePrePath;
+  },
+
+  async initL10n() {
+    // The UI labels depend on whether we will show the application chooser next
+    // or directly open the assigned protocol handler.
+
+    // Fluent id for dialog accept button
+    let idAcceptButton;
+    if (this._preferredHandlerName) {
+      idAcceptButton = "permission-dialog-btn-open-link";
+    } else {
+      idAcceptButton = "permission-dialog-btn-choose-app";
+
+      let descriptionExtra = document.getElementById("description-extra");
+      descriptionExtra.hidden = false;
+    }
+
+    let description = document.getElementById("description");
+
+    document.l10n.pauseObserving();
+    let pendingElements = [description];
+
+    let host = this.displayPrePath;
+    let scheme = this._handlerInfo.type;
+
+    document.l10n.setAttributes(description, this.l10nDescriptionId, {
+      host,
+      scheme,
+      extension: this._addonPolicy?.name,
+      appName: this._preferredHandlerName,
+    });
+
+    if (!this._checkRememberContainer.hidden) {
+      let checkboxLabel = document.getElementById("remember-label");
+      document.l10n.setAttributes(checkboxLabel, this.l10nCheckboxId, {
+        host,
+        scheme,
+      });
+      pendingElements.push(checkboxLabel);
+    }
+
+    // Set the dialog button labels.
+    // Ideally we would do this via attributes, however the <dialog> element
+    // does not support changing l10n ids on the fly.
+    let acceptButton = this._dialog.getButton("accept");
+    let [result] = await document.l10n.formatMessages([{ id: idAcceptButton }]);
+    result.attributes.forEach(attr => {
+      if (attr.name == "label") {
+        acceptButton.label = attr.value;
+      } else {
+        acceptButton.accessKey = attr.value;
+      }
+    });
+
+    document.l10n.resumeObserving();
+
+    await document.l10n.translateElements(pendingElements);
+    return document.l10n.ready;
+  },
+
+  onAccept() {
+    this._outArgs.setProperty("remember", this._checkRemember.checked);
+    this._outArgs.setProperty("granted", true);
+  },
+
+  onChangeApp() {
+    this._outArgs.setProperty("resetHandlerChoice", true);
+
+    // We can't call the dialogs accept handler here. If the accept button is
+    // still disabled, it will prevent closing.
+    this.onAccept();
+    window.close();
+  },
+};
+
+window.addEventListener("DOMContentLoaded", () => dialog.initialize(), {
+  once: true,
+});
diff --git a/toolkit/mozapps/handling/content/permissionDialog.xhtml b/toolkit/mozapps/handling/content/permissionDialog.xhtml
new file mode 100644
index 0000000000..93ad113686
--- /dev/null
+++ b/toolkit/mozapps/handling/content/permissionDialog.xhtml
@@ -0,0 +1,43 @@
+<?xml version="1.0"?>
+<?xml-stylesheet href="chrome://global/skin/global.css"?>
+<?xml-stylesheet href="chrome://mozapps/content/handling/handler.css"?>
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+
+<!DOCTYPE window>
+
+<window aria-describedby="description"
+        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+        xmlns:html="http://www.w3.org/1999/xhtml">
+<dialog buttons="accept,cancel"
+        defaultButton="none"
+        data-l10n-attrs="buttonlabelaccept, buttonaccesskeyaccept">
+  <linkset>
+    <html:link rel="localization" href="toolkit/global/handlerDialog.ftl"/>
+  </linkset>
+
+  <script src="chrome://mozapps/content/handling/permissionDialog.js"
+          type="application/javascript"/>
+
+
+  <vbox id="description-box">
+    <description id="description"></description>
+    <label id="change-app"
+           hidden="true"
+           is="text-link"
+           data-l10n-id="permission-dialog-set-change-app-link"></label>
+    <description id="description-extra"
+                 hidden="true"
+                 data-l10n-id="permission-dialog-unset-description">
+    </description>
+  </vbox>
+
+  <vbox id="rememberContainer">
+    <html:label class="toggle-container-with-text">
+      <html:input type="checkbox" id="remember"/>
+      <html:span id="remember-label"/>
+    </html:label>
+  </vbox>
+</dialog>
+</window>