--- a/toolkit/mozapps/handling/content/dialog.js
+++ b/toolkit/mozapps/handling/content/dialog.js
@@ -27,16 +27,48 @@
  * window.arguments[9]:
  *   The nsIInterfaceRequestor of the parent window; may be null
  */
 
 const {EnableDelayHelper} = ChromeUtils.import("resource://gre/modules/SharedPromptUtils.jsm");
 const {Services} = ChromeUtils.import("resource://gre/modules/Services.jsm");
 const {PrivateBrowsingUtils} = ChromeUtils.import("resource://gre/modules/PrivateBrowsingUtils.jsm");
 
+class MozHandler extends window.MozElements.MozRichlistitem {
+  connectedCallback() {
+    this.textContent = "";
+    this.appendChild(window.MozXULElement.parseXULToFragment(`
+      <vbox pack="center">
+        <image height="32" width="32"/>
+      </vbox>
+      <vbox flex="1">
+        <label class="name"/>
+        <label class="description"/>
+      </vbox>
+    `));
+    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",
+});
+
 var dialog = {
   // Member Variables
 
   _handlerInfo: null,
   _URI: null,
   _itemChoose: null,
   _okButton: null,
   _windowCtxt: null,
@@ -117,18 +149,17 @@ var dialog = {
   * 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.createElement("richlistitem");
-      elm.setAttribute("type", "handler");
+      let elm = document.createElement("richlistitem", {is: "mozapps-handler"});
       elm.setAttribute("name", app.name);
       elm.obj = app;
 
       if (app instanceof Ci.nsILocalHandlerApp) {
         // See if we have an nsILocalHandlerApp and set the icon
         let uri = Services.io.newFileURI(app.executable);
         elm.setAttribute("image", "moz-icon://" + uri.spec + "?size=32");
       } else if (app instanceof Ci.nsIWebHandlerApp) {
@@ -166,18 +197,17 @@ var dialog = {
       }
 
       items.insertBefore(elm, this._itemChoose);
       if (preferredHandler && app == preferredHandler)
         this.selectedItem = elm;
     }
 
     if (this._handlerInfo.hasDefaultHandler) {
-      let elm = document.createElement("richlistitem");
-      elm.setAttribute("type", "handler");
+      let elm = document.createElement("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;
     }
@@ -198,18 +228,17 @@ var dialog = {
           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.createElement("richlistitem");
-          elm.setAttribute("type", "handler");
+          let elm = document.createElement("richlistitem", {is: "mozapps-handler"});
           elm.setAttribute("name", handler.name);
           elm.obj = handler;
           items.insertBefore(elm, this._itemChoose);
         }
       }
     }
 
     items.ensureSelectedElementIsVisible();
@@ -240,18 +269,17 @@ var dialog = {
           let elm = parent.childNodes[i];
           if (elm.obj instanceof Ci.nsILocalHandlerApp && elm.obj.equals(handlerApp)) {
             parent.selectedItem = elm;
             parent.ensureSelectedElementIsVisible();
             return;
           }
         }
 
-        let elm = document.createElement("richlistitem");
-        elm.setAttribute("type", "handler");
+        let elm = document.createElement("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();
       }
     });

--- a/toolkit/mozapps/handling/content/handler.css
+++ b/toolkit/mozapps/handling/content/handler.css
@@ -1,11 +1,7 @@
 /* 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/. */
 
-richlistitem[type="handler"] {
-  -moz-binding: url('chrome://mozapps/content/handling/handler.xml#handler');
-}
-
 #remember-text:not([visible]) {
   visibility: hidden;
 }

deleted file mode 100644
--- a/toolkit/mozapps/handling/content/handler.xml
+++ /dev/null
@@ -1,28 +0,0 @@
-<?xml version="1.0"?>
-<!-- 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/. -->
-
-<bindings id="hanlder-bindings"
-          xmlns="http://www.mozilla.org/xbl"
-          xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
-          xmlns:xbl="http://www.mozilla.org/xbl">
-
-  <binding id="handler"
-           extends="chrome://global/content/bindings/richlistbox.xml#richlistitem">
-
-    <content>
-      <xul:vbox pack="center">
-        <xul:image xbl:inherits="src=image,disabled" height="32" width="32"/>
-      </xul:vbox>
-      <xul:vbox flex="1">
-        <xul:label class="name" xbl:inherits="value=name,disabled"/>
-        <xul:label class="description" xbl:inherits="value=description,disabled"/>
-      </xul:vbox>
-    </content>
-    <implementation>
-      <property name="label" onget="return this.getAttribute('name') + ' ' + this.getAttribute('description');"/>
-    </implementation>
-  </binding>
-
-</bindings>

--- a/toolkit/mozapps/handling/jar.mn
+++ b/toolkit/mozapps/handling/jar.mn
@@ -1,10 +1,9 @@
 # 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/.
 
 toolkit.jar:
 % content mozapps %content/mozapps/
   content/mozapps/handling/handler.css                          (content/handler.css)
-  content/mozapps/handling/handler.xml                          (content/handler.xml)
   content/mozapps/handling/dialog.xul                           (content/dialog.xul)
   content/mozapps/handling/dialog.js                            (content/dialog.js)