Bug 1416363 - Remove colorpicker binding and related code. r=bgrins,surkov
authorTim Nguyen <ntim.bugs@gmail.com>
Thu, 04 Oct 2018 01:03:19 +0000
changeset 495547 93395637457196a6e01987dde862bbcb3327b976
parent 495546 26607bdd2fbf548e94a62a7565d585a5125a09ce
child 495548 d58b6e90927f9dd762717179c547276024a624bc
push id9984
push userffxbld-merge
push dateMon, 15 Oct 2018 21:07:35 +0000
treeherdermozilla-beta@183d27ea8570 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersbgrins, surkov
bugs1416363
milestone64.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1416363 - Remove colorpicker binding and related code. r=bgrins,surkov Depends on D7575 Differential Revision: https://phabricator.services.mozilla.com/D7576
accessible/base/XULMap.h
accessible/base/nsAccessibilityService.cpp
accessible/tests/mochitest/events/test_focus_general.xul
accessible/tests/mochitest/states/test_controls.xul
accessible/tests/mochitest/treeupdate/a11y.ini
accessible/tests/mochitest/treeupdate/test_colorpicker.xul
accessible/xul/XULAlertAccessible.cpp
accessible/xul/XULColorPickerAccessible.cpp
accessible/xul/XULColorPickerAccessible.h
accessible/xul/moz.build
toolkit/content/jar.mn
toolkit/content/tests/chrome/chrome.ini
toolkit/content/tests/chrome/test_colorpicker_popup.xul
toolkit/content/widgets/colorpicker.xml
toolkit/content/xul.css
toolkit/themes/linux/global/colorpicker.css
toolkit/themes/linux/global/jar.mn
toolkit/themes/osx/global/colorpicker.css
toolkit/themes/osx/global/jar.mn
toolkit/themes/windows/global/colorpicker.css
toolkit/themes/windows/global/jar.mn
xpcom/ds/StaticAtoms.py
--- a/accessible/base/XULMap.h
+++ b/accessible/base/XULMap.h
@@ -34,47 +34,32 @@ XULMAP_TYPE(toolbarspring, XULToolbarSep
 XULMAP_TYPE(treecol, XULColumnItemAccessible)
 XULMAP_TYPE(treecolpicker, XULButtonAccessible)
 XULMAP_TYPE(treecols, XULTreeColumAccessible)
 XULMAP_TYPE(toolbar, XULToolbarAccessible)
 XULMAP_TYPE(toolbarbutton, XULToolbarButtonAccessible)
 XULMAP_TYPE(tooltip, XULTooltipAccessible)
 
 XULMAP(
-  colorpicker,
-  [](Element* aElement, Accessible* aContext) -> Accessible* {
-    if (aElement->AttrValueIs(kNameSpaceID_None, nsGkAtoms::type,
-                              nsGkAtoms::button, eIgnoreCase)) {
-      return new XULColorPickerAccessible(aElement, aContext->Document());
-    }
-    return nullptr;
-  }
-)
-
-XULMAP(
   label,
   [](Element* aElement, Accessible* aContext) -> Accessible* {
     if (aElement->ClassList()->Contains(NS_LITERAL_STRING("text-link"))) {
       return new XULLinkAccessible(aElement, aContext->Document());
     }
     return new XULLabelAccessible(aElement, aContext->Document());
   }
 )
 
 XULMAP(
   image,
   [](Element* aElement, Accessible* aContext) -> Accessible* {
     if (aElement->HasAttr(kNameSpaceID_None, nsGkAtoms::onclick)) {
       return new XULToolbarButtonAccessible(aElement, aContext->Document());
     }
 
-    if (aElement->ClassList()->Contains(NS_LITERAL_STRING("colorpickertile"))) {
-      return new XULColorPickerTileAccessible(aElement, aContext->Document());
-    }
-
     // Don't include nameless images in accessible tree.
     if (!aElement->HasAttr(kNameSpaceID_None, nsGkAtoms::tooltiptext)) {
       return nullptr;
     }
 
     return new ImageAccessibleWrap(aElement, aContext->Document());
   }
 )
--- a/accessible/base/nsAccessibilityService.cpp
+++ b/accessible/base/nsAccessibilityService.cpp
@@ -70,17 +70,16 @@
 #include "mozilla/dom/DOMStringList.h"
 #include "mozilla/dom/EventTarget.h"
 #include "mozilla/Preferences.h"
 #include "mozilla/Services.h"
 #include "nsDeckFrame.h"
 
 #ifdef MOZ_XUL
 #include "XULAlertAccessible.h"
-#include "XULColorPickerAccessible.h"
 #include "XULComboboxAccessible.h"
 #include "XULElementAccessibles.h"
 #include "XULFormControlAccessible.h"
 #include "XULListboxAccessibleWrap.h"
 #include "XULMenuAccessibleWrap.h"
 #include "XULTabAccessible.h"
 #include "XULTreeGridAccessibleWrap.h"
 #endif
--- a/accessible/tests/mochitest/events/test_focus_general.xul
+++ b/accessible/tests/mochitest/events/test_focus_general.xul
@@ -16,24 +16,16 @@
   <script type="application/javascript"
           src="../role.js" />
   <script type="application/javascript"
           src="../states.js" />
   <script type="application/javascript"
           src="../events.js" />
 
   <script type="application/javascript">
-    function getColorBtn(aBtnObj)
-    {
-      var colorpicker = aBtnObj.colorpicker;
-      var container = colorpicker.firstChild;
-      var btn = container.getChildAt(aBtnObj.btnIndex);
-      return btn;
-    }
-
     //gA11yEventDumpID = "eventdump"; // debug stuff
     //gA11yEventDumpToConsole = true; // debug stuff
 
     var gQueue = null;
     function doTests()
     {
       // Test focus events.
       gQueue = new eventQueue();
@@ -69,29 +61,16 @@
       gQueue.push(new synthClick("popupbutton", new nofocusChecker()));
       // select first menu item ("item 1"), focus on menu item
       gQueue.push(new synthDownKey("popupbutton", new focusChecker("bp_item1")));
       // choose select menu item, focus gets back to menubutton
       gQueue.push(new synthEnterKey("bp_item1", new focusChecker("menubutton")));
       // show popup again for the next test
       gQueue.push(new synthClick("popupbutton", new nofocusChecker()));
 
-      // focus colorpicker button
-      gQueue.push(new synthFocus("colorpicker"));
-      // click on button, open popup, focus goes to current color button
-      var btnObj = { colorpicker: getAccessible("colorpicker"), btnIndex: 0 };
-      var checker = new focusChecker(getColorBtn, btnObj);
-      gQueue.push(new synthClick("colorpicker", checker));
-      // select sibling color button, focus on it
-      btnObj = { colorpicker: getAccessible("colorpicker"), btnIndex: 1 };
-      var checker = new focusChecker(getColorBtn, btnObj);
-      gQueue.push(new synthRightKey("colorpicker", checker));
-      // choose selected color button, close popup, focus on colorpicker button
-      gQueue.push(new synthEnterKey("colorpicker", new focusChecker("colorpicker")));
-
       gQueue.invoke(); // Will call SimpleTest.finish();
     }
 
     SimpleTest.waitForExplicitFinish();
     addA11yLoadEvent(doTests);
   </script>
 
   <hbox flex="1" style="overflow: auto;">
@@ -124,19 +103,16 @@
           <menuitem id="mb_item1" label="item1"/>
           <menuitem id="mb_item2" label="item2"/>
         </menupopup>
       </button>
 
       <button id="checkbutton" type="checkbox" label="checkbutton"/>
       <button id="radiobutton" type="radio" group="rbgroup" label="radio1"/>
 
-      <colorpicker id="colorpicker" type="button" label="color picker"
-                   color="#FFFFFF"/>
-
       <popupset>
         <menupopup id="backpopup" position="after_start">
           <menuitem id="bp_item1" label="Page 1"/>
           <menuitem id="bp_item2" label="Page 2"/>
         </menupopup>
       </popupset>
       <button id="popupbutton" label="Pop Me Up" popup="backpopup"/>
 
--- a/accessible/tests/mochitest/states/test_controls.xul
+++ b/accessible/tests/mochitest/states/test_controls.xul
@@ -15,71 +15,41 @@
           src="../role.js" />
   <script type="application/javascript"
           src="../states.js" />
   <script type="application/javascript"
           src="../events.js" />
 
   <script type="application/javascript">
   <![CDATA[
-    function openColorpicker(aID)
-    {
-      this.popupNode = getNode(aID).mPicker.parentNode;
-      this.popup = getAccessible(this.popupNode);
-
-      this.eventSeq = [
-        new invokerChecker(EVENT_REORDER, this.popupNode)
-      ];
-
-      this.invoke = function openColorpicker_invoke()
-      {
-        getNode(aID).showPopup();
-      }
-
-      this.finalCheck = function openColorpicker_finalCheck()
-      {
-        testStates(this.popup.firstChild,
-                   STATE_FOCUSABLE | STATE_SELECTABLE, 0,
-                   STATE_UNAVAILABLE);
-      }
-
-      this.getID = function openColorpicker_getID()
-      {
-        return "open colorpicker";
-      }
-    }
-
     var gQueue = null;
     function doTest()
     {
       testStates("checkbox", STATE_FOCUSABLE, 0, STATE_UNAVAILABLE);
       testStates("checkbox2", STATE_UNAVAILABLE, 0 , STATE_FOCUSABLE);
       testStates("radiogroup", 0, 0, STATE_FOCUSABLE | STATE_UNAVAILABLE);
       testStates("radio", STATE_FOCUSABLE, 0, STATE_UNAVAILABLE);
       testStates("radio-disabled", STATE_UNAVAILABLE, 0 , STATE_FOCUSABLE);
       testStates("radiogroup-disabled", STATE_UNAVAILABLE, 0 , STATE_FOCUSABLE);
       testStates("radio-disabledradiogroup", STATE_UNAVAILABLE, 0 , STATE_FOCUSABLE);
       testStates("button", STATE_FOCUSABLE, 0, STATE_UNAVAILABLE);
       testStates("button-disabled", STATE_UNAVAILABLE, 0 , STATE_FOCUSABLE);
-      testStates("colorpicker", STATE_FOCUSABLE | STATE_HASPOPUP, 0, STATE_UNAVAILABLE);
-      testStates("colorpicker-disabled", STATE_HASPOPUP, 0, STATE_FOCUSABLE);
       testStates("combobox", STATE_FOCUSABLE | STATE_HASPOPUP, 0, STATE_UNAVAILABLE);
       testStates("combobox-disabled", STATE_UNAVAILABLE | STATE_HASPOPUP, 0, STATE_FOCUSABLE);
       testStates("listbox", STATE_FOCUSABLE, 0, STATE_UNAVAILABLE);
       testStates("listitem", STATE_FOCUSABLE | STATE_SELECTABLE | STATE_SELECTED, 0, STATE_UNAVAILABLE);
       testStates("listbox-disabled", STATE_UNAVAILABLE, 0, STATE_FOCUSABLE | STATE_SELECTABLE);
       testStates("listitem-disabledlistbox", STATE_UNAVAILABLE | STATE_SELECTED, 0, STATE_FOCUSABLE | STATE_SELECTABLE);
       testStates("menubar", 0, 0, STATE_FOCUSABLE);
       testStates("menu", STATE_FOCUSABLE, 0, STATE_UNAVAILABLE);
       testStates("menu-disabled", STATE_UNAVAILABLE, 0, STATE_FOCUSABLE | STATE_SELECTABLE);
       testStates("tab", STATE_FOCUSABLE | STATE_SELECTABLE | STATE_SELECTED, 0, STATE_UNAVAILABLE);
       testStates("tab-disabled", STATE_UNAVAILABLE, 0, STATE_FOCUSABLE | STATE_SELECTABLE | STATE_SELECTED);
 
       gQueue = new eventQueue();
-      gQueue.push(new openColorpicker("colorpicker"));
       gQueue.invoke(); // Will call SimpleTest.finish()
     }
 
     SimpleTest.waitForExplicitFinish();
     addA11yLoadEvent(doTest);
   ]]>
   </script>
 
@@ -115,19 +85,16 @@
     <radiogroup id="radiogroup-disabled" disabled="true">
       <radio id="radio-disabledradiogroup" label="Orange"/>
       <radio id="violet2" selected="true" label="Violet"/>
     </radiogroup>
 
     <button id="button" value="button"/>
     <button id="button-disabled" disabled="true" value="button"/>
 
-    <colorpicker id="colorpicker" type="button"/>
-    <colorpicker id="colorpicker-disabled" type="button" disabled="true"/>
-
     <menulist id="combobox">
       <menupopup>
         <menuitem label="item1"/>
       </menupopup>
     </menulist>
 
     <menulist id="combobox-disabled" disabled="true">
       <menupopup>
@@ -173,9 +140,8 @@
       </tabpanels>
     </tabbox>
 
     <tooltip id="tooltip"><description>tooltip</description></tooltip>
     </vbox>
   </hbox>
 
 </window>
-
--- a/accessible/tests/mochitest/treeupdate/a11y.ini
+++ b/accessible/tests/mochitest/treeupdate/a11y.ini
@@ -13,17 +13,16 @@ support-files =
 [test_bug895082.html]
 [test_bug1040735.html]
 [test_bug1100602.html]
 [test_bug1175913.html]
 [test_bug1189277.html]
 [test_bug1276857.html]
 support-files = test_bug1276857_subframe.html
 [test_canvas.html]
-[test_colorpicker.xul]
 [test_contextmenu.xul]
 [test_cssoverflow.html]
 [test_deck.xul]
 [test_doc.html]
 [test_gencontent.html]
 [test_general.html]
 [test_hidden.html]
 [test_imagemap.html]
deleted file mode 100644
--- a/accessible/tests/mochitest/treeupdate/test_colorpicker.xul
+++ /dev/null
@@ -1,150 +0,0 @@
-<?xml version="1.0"?>
-<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
-<?xml-stylesheet href="chrome://mochikit/content/tests/SimpleTest/test.css"
-                 type="text/css"?>
-
-<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
-        title="Accessible XUL button hierarchy tests">
-
-  <script type="application/javascript"
-          src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js" />
-
-  <script type="application/javascript"
-          src="../common.js" />
-  <script type="application/javascript"
-          src="../role.js" />
-  <script type="application/javascript"
-          src="../events.js" />
-
-  <script type="application/javascript">
-  <![CDATA[
-    ////////////////////////////////////////////////////////////////////////////
-    // Test
-
-    function openColorpicker(aColorpickerID)
-    {
-      this.node = getNode(aColorpickerID);
-
-      this.eventSeq = [];
-
-      var it = new colorButtonIterator(this.node);
-      for (var btnNode = it.next(); btnNode = it.next(); btnNode)
-        this.eventSeq.push(new invokerChecker(EVENT_SHOW, btnNode));
-
-      var popupNode = getPopupNode(this.node);
-      this.eventSeq.push(new invokerChecker(EVENT_REORDER, popupNode));
-
-      this.invoke = function openColorpicker_invoke()
-      {
-        var tree =
-          { BUTTONDROPDOWNGRID: [
-            { ALERT: [ ] }
-          ] };
-        testAccessibleTree(this.node, tree);
-
-        this.node.showPopup();
-      }
-
-      this.finalCheck = function openColorpicker_finalCheck()
-      {
-        var tree =
-          { BUTTONDROPDOWNGRID: [
-            { ALERT: [ ] }
-          ] };
-
-        var colorButtons = tree.BUTTONDROPDOWNGRID[0].ALERT;
-        var it = new colorButtonIterator(this.node);
-        while (it.next()) {
-          var obj = { PUSHBUTTON: [ ] };
-          colorButtons.push(obj);
-        }
-
-        testAccessibleTree(this.node, tree);
-      }
-
-      this.getID = function openColorpicker_getID()
-      {
-        return "open colorpicker " + prettyName(aColorpickerID);
-      }
-    }
-
-    function getPopupNode(aColorpickerNode)
-    {
-      return aColorpickerNode.mPicker.parentNode;
-    }
-
-    function colorButtonIterator(aColorpickerNode)
-    {
-      this.container = aColorpickerNode.mPicker.mBox;
-      this.group = this.container.firstChild;
-      this.item = null;
-
-      this.next = function colorButtonIterator_next()
-      {
-        if (!this.group)
-          return null;
-
-        if (!this.item) {
-          this.item = this.group.firstChild;
-          return this.item;
-        }
-
-        if (this.item.nextSibling) {
-          this.item = this.item.nextSibling;
-          return this.item;
-        }
-
-        if (this.group.nextSibling) {
-          this.group = this.group.nextSibling;
-          this.item = this.group.firstChild;
-          return this.item;
-        }
-
-        this.group = null;
-        this.item = null;
-        return null;
-      }
-    }
-
-    //gA11yEventDumpToConsole = true; // debug stuff
-
-    var gQueue = null;
-    function doTest()
-    {
-      gQueue = new eventQueue();
-      gQueue.push(new openColorpicker("colorpicker"));
-      gQueue.invoke(); // Will call SimpleTest.finish()
-    }
-
-    SimpleTest.waitForExplicitFinish();
-    addA11yLoadEvent(doTest);
-  ]]>
-  </script>
-
-  <hbox flex="1" style="overflow: auto;">
-    <body xmlns="http://www.w3.org/1999/xhtml">
-      <a target="_blank"
-         href="https://bugzilla.mozilla.org/show_bug.cgi?id=249292"
-         title="Ensure accessible children for toolbarbutton types 'menu'">
-        Mozilla Bug 249292
-      </a>
-      <a target="_blank"
-         href="https://bugzilla.mozilla.org/show_bug.cgi?id=630486"
-         title="Don't force accessible creation for popup children.">
-        Mozilla Bug 630486
-      </a>
-      <br/>
-      <p id="display"></p>
-      <div id="content" style="display: none">
-      </div>
-      <pre id="test">
-      </pre>
-    </body>
-
-    <vbox flex="1">
-      <colorpicker id="colorpicker" type="button"/>
-    </vbox>
-  </hbox>
-
-</window>
-
--- a/accessible/xul/XULAlertAccessible.cpp
+++ b/accessible/xul/XULAlertAccessible.cpp
@@ -54,13 +54,10 @@ bool
 XULAlertAccessible::IsWidget() const
 {
   return true;
 }
 
 Accessible*
 XULAlertAccessible::ContainerWidget() const
 {
-  // If a part of colorpicker widget.
-  if (mParent && mParent->IsMenuButton())
-    return mParent;
   return nullptr;
 }
deleted file mode 100644
--- a/accessible/xul/XULColorPickerAccessible.cpp
+++ /dev/null
@@ -1,139 +0,0 @@
-/* -*- Mode: C++; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
-/* 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/. */
-
-#include "XULColorPickerAccessible.h"
-
-#include "Accessible-inl.h"
-#include "nsAccUtils.h"
-#include "DocAccessible.h"
-#include "Role.h"
-#include "States.h"
-
-#include "nsMenuPopupFrame.h"
-
-using namespace mozilla::a11y;
-
-////////////////////////////////////////////////////////////////////////////////
-// XULColorPickerTileAccessible
-////////////////////////////////////////////////////////////////////////////////
-
-XULColorPickerTileAccessible::
-  XULColorPickerTileAccessible(nsIContent* aContent, DocAccessible* aDoc) :
-  AccessibleWrap(aContent, aDoc)
-{
-}
-
-////////////////////////////////////////////////////////////////////////////////
-// XULColorPickerTileAccessible: Accessible
-
-void
-XULColorPickerTileAccessible::Value(nsString& aValue) const
-{
-  aValue.Truncate();
-
-  mContent->AsElement()->GetAttr(kNameSpaceID_None, nsGkAtoms::color, aValue);
-}
-
-role
-XULColorPickerTileAccessible::NativeRole() const
-{
-  return roles::PUSHBUTTON;
-}
-
-uint64_t
-XULColorPickerTileAccessible::NativeState() const
-{
-  uint64_t state = AccessibleWrap::NativeState();
-  if (mContent->AsElement()->HasAttr(kNameSpaceID_None, nsGkAtoms::selected))
-    state |= states::SELECTED;
-
-  return state;
-}
-
-uint64_t
-XULColorPickerTileAccessible::NativeInteractiveState() const
-{
-  return NativelyUnavailable() ?
-    states::UNAVAILABLE : states::FOCUSABLE | states::SELECTABLE;
-}
-
-////////////////////////////////////////////////////////////////////////////////
-// XULColorPickerTileAccessible: Widgets
-
-Accessible*
-XULColorPickerTileAccessible::ContainerWidget() const
-{
-  Accessible* parent = Parent();
-  if (parent) {
-    Accessible* grandParent = parent->Parent();
-    if (grandParent && grandParent->IsMenuButton())
-      return grandParent;
-  }
-  return nullptr;
-}
-
-////////////////////////////////////////////////////////////////////////////////
-// XULColorPickerAccessible
-////////////////////////////////////////////////////////////////////////////////
-
-XULColorPickerAccessible::
-  XULColorPickerAccessible(nsIContent* aContent, DocAccessible* aDoc) :
-  XULColorPickerTileAccessible(aContent, aDoc)
-{
-  mGenericTypes |= eMenuButton;
-}
-
-////////////////////////////////////////////////////////////////////////////////
-// XULColorPickerAccessible: Accessible
-
-uint64_t
-XULColorPickerAccessible::NativeState() const
-{
-  uint64_t state = AccessibleWrap::NativeState();
-  return state | states::HASPOPUP;
-}
-
-role
-XULColorPickerAccessible::NativeRole() const
-{
-  return roles::BUTTONDROPDOWNGRID;
-}
-
-////////////////////////////////////////////////////////////////////////////////
-// XULColorPickerAccessible: Widgets
-
-bool
-XULColorPickerAccessible::IsWidget() const
-{
-  return true;
-}
-
-bool
-XULColorPickerAccessible::IsActiveWidget() const
-{
-  return FocusMgr()->HasDOMFocus(mContent);
-}
-
-bool
-XULColorPickerAccessible::AreItemsOperable() const
-{
-  Accessible* menuPopup = mChildren.SafeElementAt(0, nullptr);
-  if (menuPopup) {
-    nsMenuPopupFrame* menuPopupFrame = do_QueryFrame(menuPopup->GetFrame());
-    return menuPopupFrame && menuPopupFrame->IsOpen();
-  }
-  return false;
-}
-
-////////////////////////////////////////////////////////////////////////////////
-// XULColorPickerAccessible: Accessible
-
-bool
-XULColorPickerAccessible::IsAcceptableChild(nsIContent* aEl) const
-{
-  return aEl->IsXULElement(nsGkAtoms::panel) &&
-    aEl->AsElement()->AttrValueIs(kNameSpaceID_None, nsGkAtoms::noautofocus,
-                                  nsGkAtoms::_true, eCaseMatters);
-}
deleted file mode 100644
--- a/accessible/xul/XULColorPickerAccessible.h
+++ /dev/null
@@ -1,57 +0,0 @@
-/* -*- Mode: C++; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
-/* 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/. */
-
-#ifndef mozilla_a11y_XULColorPickerAccessible_h__
-#define mozilla_a11y_XULColorPickerAccessible_h__
-
-#include "AccessibleWrap.h"
-
-namespace mozilla {
-namespace a11y {
-
-/**
- * Used for color button in colorpicker palette.
- */
-class XULColorPickerTileAccessible : public AccessibleWrap
-{
-public:
-  XULColorPickerTileAccessible(nsIContent* aContent,
-                               DocAccessible* aDoc);
-
-  // Accessible
-  virtual void Value(nsString& aValue) const override;
-  virtual a11y::role NativeRole() const override;
-  virtual uint64_t NativeState() const override;
-  virtual uint64_t NativeInteractiveState() const override;
-
-  // Widgets
-  virtual Accessible* ContainerWidget() const override;
-};
-
-
-/**
- * Used for colorpicker button (xul:colorpicker@type="button").
- */
-class XULColorPickerAccessible : public XULColorPickerTileAccessible
-{
-public:
-  XULColorPickerAccessible(nsIContent* aContent, DocAccessible* aDoc);
-
-  // Accessible
-  virtual a11y::role NativeRole() const override;
-  virtual uint64_t NativeState() const override;
-
-  // Widgets
-  virtual bool IsWidget() const override;
-  virtual bool IsActiveWidget() const override;
-  virtual bool AreItemsOperable() const override;
-
-  virtual bool IsAcceptableChild(nsIContent* aEl) const override;
-};
-
-} // namespace a11y
-} // namespace mozilla
-
-#endif
--- a/accessible/xul/moz.build
+++ b/accessible/xul/moz.build
@@ -1,17 +1,16 @@
 # -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
 # vim: set filetype=python:
 # 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/.
 
 UNIFIED_SOURCES += [
     'XULAlertAccessible.cpp',
-    'XULColorPickerAccessible.cpp',
     'XULComboboxAccessible.cpp',
     'XULElementAccessibles.cpp',
     'XULFormControlAccessible.cpp',
     'XULListboxAccessible.cpp',
     'XULMenuAccessible.cpp',
     'XULSelectControlAccessible.cpp',
     'XULTabAccessible.cpp',
     'XULTreeAccessible.cpp',
--- a/toolkit/content/jar.mn
+++ b/toolkit/content/jar.mn
@@ -63,17 +63,16 @@ toolkit.jar:
    content/global/viewZoomOverlay.js
 #endif
    content/global/widgets.css
    content/global/bindings/autocomplete.xml    (widgets/autocomplete.xml)
    content/global/bindings/browser.xml         (widgets/browser.xml)
    content/global/bindings/button.xml          (widgets/button.xml)
    content/global/bindings/calendar.js         (widgets/calendar.js)
    content/global/bindings/checkbox.xml        (widgets/checkbox.xml)
-   content/global/bindings/colorpicker.xml     (widgets/colorpicker.xml)
    content/global/bindings/datekeeper.js       (widgets/datekeeper.js)
    content/global/bindings/datepicker.js       (widgets/datepicker.js)
    content/global/bindings/datetimepopup.xml   (widgets/datetimepopup.xml)
    content/global/bindings/datetimebox.xml     (widgets/datetimebox.xml)
    content/global/bindings/datetimebox.css     (widgets/datetimebox.css)
 *  content/global/bindings/dialog.xml          (widgets/dialog.xml)
    content/global/bindings/general.xml         (widgets/general.xml)
    content/global/bindings/groupbox.xml        (widgets/groupbox.xml)
--- a/toolkit/content/tests/chrome/chrome.ini
+++ b/toolkit/content/tests/chrome/chrome.ini
@@ -98,17 +98,16 @@ support-files = bug451540_window.xul
 [test_bug585946.xul]
 [test_bug624329.xul]
 skip-if = (os == 'mac' && os_version == '10.10') # Unexpectedly perma-passes on OSX 10.10
 [test_bug792324.xul]
 [test_bug1048178.xul]
 skip-if = toolkit == "cocoa"
 [test_button.xul]
 [test_closemenu_attribute.xul]
-[test_colorpicker_popup.xul]
 [test_contextmenu_list.xul]
 [test_custom_element_base.xul]
 [test_deck.xul]
 [test_dialogfocus.xul]
 [test_editor_for_input_with_autocomplete.html]
 [test_editor_for_textbox_with_autocomplete.xul]
 [test_findbar.xul]
 subsuite = clipboard
deleted file mode 100644
--- a/toolkit/content/tests/chrome/test_colorpicker_popup.xul
+++ /dev/null
@@ -1,148 +0,0 @@
-<?xml version="1.0"?>
-<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
-<?xml-stylesheet href="chrome://mochikit/content/tests/SimpleTest/test.css" type="text/css"?>
-
-<window title="Colorpicker Tests"
-  onload="setTimeout(runTests, 0);"
-  onpopupshown="popupShown();"
-  onpopuphidden="popupHiding();"
-  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
-
-  <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>      
-  <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>      
-
-<colorpicker id="colorpicker-popup" type="button" color="#FF0000" tabindex="1"/>
-
-<script class="testbody" type="application/javascript">
-<![CDATA[
-
-var gTestPhase = -1;
-var gCp = null;
-
-SimpleTest.waitForExplicitFinish();
-
-function preventDefault(event) {
-  event.preventDefault();
-}
-
-function runTests()
-{
-  gCp = document.getElementById("colorpicker-popup");
-  is(gCp.color, "#FF0000", "popup color is initialized");
-  is(gCp.tabIndex, 1, "button tabindex is initialized");
-  is(gCp.disabled, false, "button is not disabled");
-  
-  document.addEventListener("keypress", preventDefault, false);
-
-  goNext();
-}
-
-var phases = [ "mouse click", "showPopup",
-               "key left", "key right", "key up", "key down", "key space" ];
-
-function popupShown()
-{
-  if (gTestPhase >= phases.length)
-    return;
-
-  var phase = phases[gTestPhase];
-
-  is(gCp.open, true, phase + " popup shown, open property is true");
-
-  switch (phase) {
-    case "mouse click":
-      synthesizeMouse(gCp, 2, 2, { });
-      break;
-    case "showPopup":
-      gCp.hidePopup();
-      break;
-    case "key left":
-      synthesizeKey("KEY_ArrowLeft");
-      synthesizeKeyExpectEvent("KEY_Enter");
-      is(gCp.color, "#C0C0C0", "key left while open");
-      break;
-    case "key right":
-      synthesizeKey("KEY_ArrowRight");
-      synthesizeKeyExpectEvent("VK_SPACE");
-      is(gCp.color, "#FF0000", "key right while open");
-      break;
-    case "key up":
-      synthesizeKey("KEY_ArrowUp");
-      synthesizeKeyExpectEvent("KEY_Enter");
-      is(gCp.color, "#FF6666", "key up while open");
-      break;
-    case "key down":
-      synthesizeKey("KEY_ArrowDown");
-      synthesizeKeyExpectEvent(" ");
-      is(gCp.color, "#FF0000", "key down while open");
-      break;
-    default:
-      synthesizeMouse(gCp, 2, 2, { });
-// this breaks on the Mac, so disable for now
-//      synthesizeKey("KEY_Escape");
-      break;
-  }
-}
-
-function popupHiding()
-{
-  var phase = phases[gTestPhase];
-  if (phase == "showPopup")
-    phase = "hidePopup";
-  if (phase == "key left")
-    phase = "escape";
-  is(gCp.open, false, phase + " popup hidden, open property is false");
-
-  goNext();
-}
-
-function goNext()
-{
-  gTestPhase++;
-  if (gTestPhase >= phases.length) {
-    document.removeEventListener("keypress", preventDefault, false);
-    SimpleTest.finish();
-    return;
-  }
-
-  gCp.focus();
-
-  var phase = phases[gTestPhase];
-  switch (phase) {
-    case "mouse click":
-      synthesizeMouse(gCp, 2, 2, { });
-      break;
-    case "showPopup":
-      gCp.showPopup();
-      break;
-    case "key left":
-      synthesizeKey("KEY_ArrowLeft");
-      break;
-    case "key right":
-      synthesizeKey("KEY_ArrowRight");
-      break;
-    case "key down":
-      synthesizeKey("KEY_ArrowUp");
-      break;
-    case "key up":
-      synthesizeKey("KEY_ArrowDown");
-      break;
-    case "key space":
-      sendString(" ");
-      break;
-  }
-}
-
-]]>
-</script>
-
-<body xmlns="http://www.w3.org/1999/xhtml">
-<p id="display">
-</p>
-<div id="content" style="display: none">
-</div>
-<pre id="test">
-</pre>
-</body>
-
-</window>
deleted file mode 100644
--- a/toolkit/content/widgets/colorpicker.xml
+++ /dev/null
@@ -1,560 +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="colorpickerBindings"
-   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="colorpicker" extends="chrome://global/content/bindings/general.xml#basecontrol">
-    <resources>
-      <stylesheet src="chrome://global/skin/colorpicker.css"/>
-    </resources>
-
-    <content>
-      <xul:vbox flex="1">
-
-        <xul:hbox>
-          <xul:image class="colorpickertile cp-light" color="#FFFFFF"/>
-          <xul:image class="colorpickertile cp-light" color="#FFCCCC"/>
-          <xul:image class="colorpickertile cp-light" color="#FFCC99"/>
-          <xul:image class="colorpickertile cp-light" color="#FFFF99"/>
-          <xul:image class="colorpickertile cp-light" color="#FFFFCC"/>
-          <xul:image class="colorpickertile cp-light" color="#99FF99"/>
-          <xul:image class="colorpickertile cp-light" color="#99FFFF"/>
-          <xul:image class="colorpickertile cp-light" color="#CCFFFF"/>
-          <xul:image class="colorpickertile cp-light" color="#CCCCFF"/>
-          <xul:image class="colorpickertile cp-light" color="#FFCCFF"/>
-        </xul:hbox>
-        <xul:hbox>
-          <xul:image class="colorpickertile" color="#CCCCCC"/>
-          <xul:image class="colorpickertile" color="#FF6666"/>
-          <xul:image class="colorpickertile" color="#FF9966"/>
-          <xul:image class="colorpickertile cp-light" color="#FFFF66"/>
-          <xul:image class="colorpickertile cp-light" color="#FFFF33"/>
-          <xul:image class="colorpickertile cp-light" color="#66FF99"/>
-          <xul:image class="colorpickertile cp-light" color="#33FFFF"/>
-          <xul:image class="colorpickertile cp-light" color="#66FFFF"/>
-          <xul:image class="colorpickertile" color="#9999FF"/>
-          <xul:image class="colorpickertile" color="#FF99FF"/>
-        </xul:hbox>
-        <xul:hbox>
-          <xul:image class="colorpickertile" color="#C0C0C0"/>
-          <xul:image class="colorpickertile" color="#FF0000"/>
-          <xul:image class="colorpickertile" color="#FF9900"/>
-          <xul:image class="colorpickertile" color="#FFCC66"/>
-          <xul:image class="colorpickertile cp-light" color="#FFFF00"/>
-          <xul:image class="colorpickertile cp-light" color="#33FF33"/>
-          <xul:image class="colorpickertile" color="#66CCCC"/>
-          <xul:image class="colorpickertile" color="#33CCFF"/>
-          <xul:image class="colorpickertile" color="#6666CC"/>
-          <xul:image class="colorpickertile" color="#CC66CC"/>
-        </xul:hbox>
-        <xul:hbox>
-          <xul:image class="colorpickertile" color="#999999"/>
-          <xul:image class="colorpickertile" color="#CC0000"/>
-          <xul:image class="colorpickertile" color="#FF6600"/>
-          <xul:image class="colorpickertile" color="#FFCC33"/>
-          <xul:image class="colorpickertile" color="#FFCC00"/>
-          <xul:image class="colorpickertile" color="#33CC00"/>
-          <xul:image class="colorpickertile" color="#00CCCC"/>
-          <xul:image class="colorpickertile" color="#3366FF"/>
-          <xul:image class="colorpickertile" color="#6633FF"/>
-          <xul:image class="colorpickertile" color="#CC33CC"/>
-        </xul:hbox>
-        <xul:hbox>
-          <xul:image class="colorpickertile" color="#666666"/>
-          <xul:image class="colorpickertile" color="#990000"/>
-          <xul:image class="colorpickertile" color="#CC6600"/>
-          <xul:image class="colorpickertile" color="#CC9933"/>
-          <xul:image class="colorpickertile" color="#999900"/>
-          <xul:image class="colorpickertile" color="#009900"/>
-          <xul:image class="colorpickertile" color="#339999"/>
-          <xul:image class="colorpickertile" color="#3333FF"/>
-          <xul:image class="colorpickertile" color="#6600CC"/>
-          <xul:image class="colorpickertile" color="#993399"/>
-        </xul:hbox>
-        <xul:hbox>
-          <xul:image class="colorpickertile" color="#333333"/>
-          <xul:image class="colorpickertile" color="#660000"/>
-          <xul:image class="colorpickertile" color="#993300"/>
-          <xul:image class="colorpickertile" color="#996633"/>
-          <xul:image class="colorpickertile" color="#666600"/>
-          <xul:image class="colorpickertile" color="#006600"/>
-          <xul:image class="colorpickertile" color="#336666"/>
-          <xul:image class="colorpickertile" color="#000099"/>
-          <xul:image class="colorpickertile" color="#333399"/>
-          <xul:image class="colorpickertile" color="#663366"/>
-        </xul:hbox>
-        <xul:hbox>
-          <xul:image class="colorpickertile" color="#000000"/>
-          <xul:image class="colorpickertile" color="#330000"/>
-          <xul:image class="colorpickertile" color="#663300"/>
-          <xul:image class="colorpickertile" color="#663333"/>
-          <xul:image class="colorpickertile" color="#333300"/>
-          <xul:image class="colorpickertile" color="#003300"/>
-          <xul:image class="colorpickertile" color="#003333"/>
-          <xul:image class="colorpickertile" color="#000066"/>
-          <xul:image class="colorpickertile" color="#330099"/>
-          <xul:image class="colorpickertile" color="#330033"/>
-        </xul:hbox>
-      </xul:vbox>
-      <!-- Something to take tab focus
-      <button style="border : 0px; width: 0px; height: 0px;"/>
-      -->
-    </content>
-
-    <implementation>
-      <property name="color">
-        <getter><![CDATA[
-          return this.mSelectedCell ? this.mSelectedCell.getAttribute("color") : null;
-        ]]></getter>
-        <setter><![CDATA[
-          if (!val)
-            return val;
-          var uppercaseVal = val.toUpperCase();
-          // Translate standard HTML color strings:
-          if (uppercaseVal[0] != "#") {
-            switch (uppercaseVal) {
-              case "GREEN":
-                uppercaseVal = "#008000";
-                break;
-              case "LIME":
-                uppercaseVal = "#00FF00";
-                break;
-              case "OLIVE":
-                uppercaseVal = "#808000";
-                break;
-              case "TEAL":
-                uppercaseVal = "#008080";
-                break;
-              case "YELLOW":
-                uppercaseVal = "#FFFF00";
-                break;
-              case "RED":
-                uppercaseVal = "#FF0000";
-                break;
-              case "MAROON":
-                uppercaseVal = "#800000";
-                break;
-              case "PURPLE":
-                uppercaseVal = "#800080";
-                break;
-              case "FUCHSIA":
-                uppercaseVal = "#FF00FF";
-                break;
-              case "NAVY":
-                uppercaseVal = "#000080";
-                break;
-              case "BLUE":
-                uppercaseVal = "#0000FF";
-                break;
-              case "AQUA":
-                uppercaseVal = "#00FFFF";
-                break;
-              case "WHITE":
-                uppercaseVal = "#FFFFFF";
-                break;
-              case "SILVER":
-                uppercaseVal = "#C0C0C0";
-                break;
-              case "GRAY":
-                uppercaseVal = "#808080";
-                break;
-              default: // BLACK
-                uppercaseVal = "#000000";
-                break;
-            }
-          }
-          var cells = this.mBox.getElementsByAttribute("color", uppercaseVal);
-          if (cells.item(0)) {
-            this.selectCell(cells[0]);
-            this.hoverCell(this.mSelectedCell);
-          }
-          return val;
-        ]]></setter>
-      </property>
-
-      <method name="initColor">
-        <parameter name="aColor"/>
-        <body><![CDATA[
-          // Use this to initialize color without
-          //  triggering the "onselect" handler,
-          //  which closes window when it's a popup
-          this.mDoOnSelect = false;
-          this.color = aColor;
-          this.mDoOnSelect = true;
-        ]]></body>
-      </method>
-
-      <method name="initialize">
-        <body><![CDATA[
-          this.mSelectedCell = null;
-          this.mHoverCell = null;
-          this.mBox = document.getAnonymousNodes(this)[0];
-          this.mIsPopup = false;
-          this.mDoOnSelect = true;
-
-          let imageEls = this.mBox.querySelectorAll("image");
-          // We set the background of the picker tiles here using images in
-          // order for the color to show up even when author colors are
-          // disabled or the user is using high contrast mode.
-          for (let el of imageEls) {
-            let dataURI = "data:image/svg+xml,<svg style='background-color: " +
-                          encodeURIComponent(el.getAttribute("color")) +
-                          "' xmlns='http://www.w3.org/2000/svg' />";
-            el.setAttribute("src", dataURI);
-          }
-
-          this.hoverCell(this.mBox.childNodes[0].childNodes[0]);
-
-          // used to capture keydown at the document level
-          this.mPickerKeyDown = function(aEvent) {
-            document._focusedPicker.pickerKeyDown(aEvent);
-          };
-
-        ]]></body>
-      </method>
-
-      <method name="_fireEvent">
-        <parameter name="aTarget"/>
-        <parameter name="aEventName"/>
-        <body>
-        <![CDATA[
-          try {
-            var event = document.createEvent("Events");
-            event.initEvent(aEventName, true, true);
-            var cancel = !aTarget.dispatchEvent(event);
-            if (aTarget.hasAttribute("on" + aEventName)) {
-              var fn = new Function("event", aTarget.getAttribute("on" + aEventName));
-              var rv = fn.call(aTarget, event);
-              // eslint-disable-next-line mozilla/no-compare-against-boolean-literals
-              if (rv == false)
-                cancel = true;
-            }
-            return !cancel;
-          } catch (e) {
-            Cu.reportError(e);
-          }
-          return false;
-        ]]>
-        </body>
-      </method>
-
-      <method name="resetHover">
-        <body><![CDATA[
-          if (this.mHoverCell)
-            this.mHoverCell.removeAttribute("hover");
-        ]]></body>
-      </method>
-
-      <method name="getColIndex">
-        <parameter name="aCell"/>
-        <body><![CDATA[
-          var cell = aCell;
-          var idx;
-          for (idx = -1; cell; idx++)
-            cell = cell.previousSibling;
-
-          return idx;
-        ]]></body>
-      </method>
-
-      <method name="isColorCell">
-        <parameter name="aCell"/>
-        <body><![CDATA[
-          return aCell && aCell.hasAttribute("color");
-        ]]></body>
-      </method>
-
-      <method name="hoverLeft">
-        <body><![CDATA[
-          var cell = this.mHoverCell.previousSibling;
-          this.hoverCell(cell);
-        ]]></body>
-      </method>
-
-      <method name="hoverRight">
-        <body><![CDATA[
-          var cell = this.mHoverCell.nextSibling;
-          this.hoverCell(cell);
-        ]]></body>
-      </method>
-
-      <method name="hoverUp">
-        <body><![CDATA[
-          var row = this.mHoverCell.parentNode.previousSibling;
-          if (row) {
-            var colIdx = this.getColIndex(this.mHoverCell);
-            var cell = row.childNodes[colIdx];
-            this.hoverCell(cell);
-          }
-        ]]></body>
-      </method>
-
-      <method name="hoverDown">
-        <body><![CDATA[
-          var row = this.mHoverCell.parentNode.nextSibling;
-          if (row) {
-            var colIdx = this.getColIndex(this.mHoverCell);
-            var cell = row.childNodes[colIdx];
-            this.hoverCell(cell);
-          }
-        ]]></body>
-      </method>
-
-      <method name="hoverTo">
-        <parameter name="aRow"/>
-        <parameter name="aCol"/>
-
-        <body><![CDATA[
-          var row = this.mBox.childNodes[aRow];
-          if (!row) return;
-          var cell = row.childNodes[aCol];
-          if (!cell) return;
-          this.hoverCell(cell);
-        ]]></body>
-      </method>
-
-      <method name="hoverCell">
-        <parameter name="aCell"/>
-
-        <body><![CDATA[
-          if (this.isColorCell(aCell)) {
-            this.resetHover();
-            aCell.setAttribute("hover", "true");
-            this.mHoverCell = aCell;
-            var event = document.createEvent("Events");
-            event.initEvent("DOMMenuItemActive", true, true);
-            aCell.dispatchEvent(event);
-          }
-        ]]></body>
-      </method>
-
-      <method name="selectHoverCell">
-        <body><![CDATA[
-          this.selectCell(this.mHoverCell);
-        ]]></body>
-      </method>
-
-      <method name="selectCell">
-        <parameter name="aCell"/>
-
-        <body><![CDATA[
-          if (this.isColorCell(aCell)) {
-            if (this.mSelectedCell)
-              this.mSelectedCell.removeAttribute("selected");
-
-            this.mSelectedCell = aCell;
-            aCell.setAttribute("selected", "true");
-
-            if (this.mDoOnSelect)
-              this._fireEvent(this, "select");
-          }
-        ]]></body>
-      </method>
-
-      <method name="handleEvent">
-        <parameter name="aEvent"/>
-        <body><![CDATA[
-          switch (aEvent.keyCode) {
-            case 37: // left
-              this.hoverLeft();
-              break;
-            case 38: // up
-              this.hoverUp();
-              break;
-            case 39: // right
-              this.hoverRight();
-              break;
-            case 40: // down
-              this.hoverDown();
-              break;
-            case 13: // enter
-            case 32: // space
-              this.selectHoverCell();
-              break;
-          }
-        ]]></body>
-      </method>
-
-	  <constructor><![CDATA[
-        this.initialize();
-      ]]></constructor>
-
-    </implementation>
-
-    <handlers>
-      <handler event="mouseover"><![CDATA[
-        this.hoverCell(event.originalTarget);
-      ]]></handler>
-
-      <handler event="click"><![CDATA[
-        if (event.originalTarget.hasAttribute("color")) {
-          this.selectCell(event.originalTarget);
-          this.hoverCell(this.mSelectedCell);
-        }
-      ]]></handler>
-
-
-      <handler event="focus" phase="capturing">
-      <![CDATA[
-        if (!this.mIsPopup && this.getAttribute("focused") != "true") {
-          this.setAttribute("focused", "true");
-          document.addEventListener("keydown", this, true);
-          if (this.mSelectedCell)
-            this.hoverCell(this.mSelectedCell);
-        }
-      ]]>
-      </handler>
-
-      <handler event="blur" phase="capturing">
-      <![CDATA[
-        if (!this.mIsPopup && this.getAttribute("focused") == "true") {
-          document.removeEventListener("keydown", this, true);
-          this.removeAttribute("focused");
-          this.resetHover();
-        }
-      ]]>
-      </handler>
-    </handlers>
-  </binding>
-
-  <binding id="colorpicker-button" display="xul:menu"
-           extends="chrome://global/content/bindings/general.xml#basecontrol">
-    <resources>
-      <stylesheet src="chrome://global/skin/colorpicker.css"/>
-    </resources>
-
-    <content>
-      <xul:image class="colorpicker-button-colorbox" anonid="colorbox" flex="1" xbl:inherits="disabled"/>
-
-      <xul:panel class="colorpicker-button-menupopup"
-                 anonid="colorpopup" noautofocus="true" level="top"
-                 onmousedown="event.stopPropagation()"
-                 onpopupshowing="this._colorPicker.onPopupShowing()"
-                 onpopuphiding="this._colorPicker.onPopupHiding()"
-                 onselect="this._colorPicker.pickerChange()">
-        <xul:colorpicker xbl:inherits="palettename,disabled" allowevents="true" anonid="colorpicker"/>
-      </xul:panel>
-    </content>
-
-    <implementation>
-      <property name="open"
-                onget="return this.getAttribute('open') == 'true'"
-                onset="this.showPopup();"/>
-      <property name="color">
-        <getter><![CDATA[
-          return this.getAttribute("color");
-        ]]></getter>
-        <setter><![CDATA[
-          this.mColorBox.setAttribute("src",
-            "data:image/svg+xml,<svg style='background-color: " +
-            encodeURIComponent(val) +
-            "' xmlns='http://www.w3.org/2000/svg' />");
-          this.setAttribute("color", val);
-          return val;
-        ]]></setter>
-      </property>
-
-      <method name="initialize">
-        <body><![CDATA[
-          this.mColorBox = document.getAnonymousElementByAttribute(this, "anonid", "colorbox");
-          this.mColorBox.setAttribute("src",
-            "data:image/svg+xml,<svg style='background-color: " +
-            encodeURIComponent(this.color) +
-            "' xmlns='http://www.w3.org/2000/svg' />");
-
-          var popup = document.getAnonymousElementByAttribute(this, "anonid", "colorpopup");
-          popup._colorPicker = this;
-
-          this.mPicker = document.getAnonymousElementByAttribute(this, "anonid", "colorpicker");
-        ]]></body>
-      </method>
-
-      <method name="_fireEvent">
-        <parameter name="aTarget"/>
-        <parameter name="aEventName"/>
-        <body>
-        <![CDATA[
-          try {
-            var event = document.createEvent("Events");
-            event.initEvent(aEventName, true, true);
-            var cancel = !aTarget.dispatchEvent(event);
-            if (aTarget.hasAttribute("on" + aEventName)) {
-              var fn = new Function("event", aTarget.getAttribute("on" + aEventName));
-              var rv = fn.call(aTarget, event);
-              // eslint-disable-next-line mozilla/no-compare-against-boolean-literals
-              if (rv == false)
-                cancel = true;
-            }
-            return !cancel;
-          } catch (e) {
-            dump(e);
-          }
-          return false;
-        ]]>
-        </body>
-      </method>
-
-      <method name="showPopup">
-        <body><![CDATA[
-          this.mPicker.parentNode.openPopup(this, "after_start", 0, 0, false, false);
-        ]]></body>
-      </method>
-
-      <method name="hidePopup">
-        <body><![CDATA[
-          this.mPicker.parentNode.hidePopup();
-        ]]></body>
-      </method>
-
-      <method name="onPopupShowing">
-        <body><![CDATA[
-          if ("resetHover" in this.mPicker)
-            this.mPicker.resetHover();
-          document.addEventListener("keydown", this.mPicker, true);
-          this.mPicker.mIsPopup = true;
-          // Initialize to current button's color
-          this.mPicker.initColor(this.color);
-        ]]></body>
-      </method>
-
-      <method name="onPopupHiding">
-        <body><![CDATA[
-          // Removes the key listener
-          document.removeEventListener("keydown", this.mPicker, true);
-          this.mPicker.mIsPopup = false;
-        ]]></body>
-      </method>
-
-      <method name="pickerChange">
-        <body><![CDATA[
-          this.color = this.mPicker.color;
-          setTimeout(function(aPopup) { aPopup.hidePopup(); }, 1, this.mPicker.parentNode);
-
-          this._fireEvent(this, "change");
-        ]]></body>
-      </method>
-
-      <constructor><![CDATA[
-        this.initialize();
-      ]]></constructor>
-
-    </implementation>
-
-    <handlers>
-      <handler event="keydown"><![CDATA[
-        // open popup if key is space/up/left/right/down and popup is closed
-        if ( (event.keyCode == 32 || (event.keyCode > 36 && event.keyCode < 41)) && !this.open)
-          this.showPopup();
-        else if ( (event.keyCode == 27) && this.open)
-          this.hidePopup();
-      ]]></handler>
-    </handlers>
-  </binding>
-
-</bindings>
--- a/toolkit/content/xul.css
+++ b/toolkit/content/xul.css
@@ -68,17 +68,16 @@ treechildren, treeitem, treeseparator, t
 xbl|children {
   display: none !important;
 }
 
 /********** focus rules **********/
 
 button,
 checkbox,
-colorpicker[type="button"],
 datepicker[type="grid"],
 menulist,
 radiogroup,
 tree,
 browser,
 editor,
 iframe {
   -moz-user-focus: normal;
@@ -666,26 +665,16 @@ panel[type="autocomplete-richlistbox"] {
    This is a stopgap measure, and it does not address the real bug.  */
 .autocomplete-result-popupset {
   max-width: 0px;
   width: 0 !important;
   min-width: 0%;
   min-height: 0%;
 }
 
-/********** colorpicker **********/
-
-colorpicker {
-  -moz-binding: url("chrome://global/content/bindings/colorpicker.xml#colorpicker");
-}
-
-colorpicker[type="button"] {
-  -moz-binding: url("chrome://global/content/bindings/colorpicker.xml#colorpicker-button");
-}
-
 /********** menulist **********/
 
 menulist {
   -moz-binding: url("chrome://global/content/bindings/menulist.xml#menulist");
 }
 
 menulist[popuponly="true"] {
   -moz-binding: url("chrome://global/content/bindings/menulist.xml#menulist-popuponly");
deleted file mode 100644
--- a/toolkit/themes/linux/global/colorpicker.css
+++ /dev/null
@@ -1,47 +0,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/. */
-
-/* ===== colorpicker.css ================================================
-  == Styles used by the XUL colorpicker element.
-  ======================================================================= */
-
-@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
-
-/* ::::: colorpicker button ::::: */
- 
-/* colorpicker button */
-
-colorpicker[type="button"] {
-  -moz-appearance: button;
-  width: 38px;
-  height: 24px;
-}
-
-.colorpicker-button-colorbox {
-  border: 1px solid #000000;
-}
-
-/* ::::: colorpicker tiles ::::: */
-
-.colorpickertile {
-  width: 20px;
-  height: 20px;
-  margin: 1px;
-  border-left: 1px solid ThreeDShadow;
-  border-top: 1px solid ThreeDShadow;
-  border-right: 1px solid ThreeDHighlight;
-  border-bottom: 1px solid ThreeDHighlight;
-}
-
-.colorpickertile[selected="true"] {
-  border: 2px outset #C0C0C0;
-}
-
-.colorpickertile[hover="true"] {
-  border: 2px dotted #FFFFFF;
-}
-
-.cp-light[hover="true"] {
-  border: 2px dotted #909090;
-}
--- a/toolkit/themes/linux/global/jar.mn
+++ b/toolkit/themes/linux/global/jar.mn
@@ -3,17 +3,16 @@
 # file, You can obtain one at http://mozilla.org/MPL/2.0/.
 
 #include ../../shared/non-mac.jar.inc.mn
 
 toolkit.jar:
    skin/classic/global/autocomplete.css
    skin/classic/global/button.css
    skin/classic/global/checkbox.css
-   skin/classic/global/colorpicker.css
    skin/classic/global/commonDialog.css
    skin/classic/global/dropmarker.css
 *  skin/classic/global/findBar.css
 *  skin/classic/global/global.css
    skin/classic/global/groupbox.css
    skin/classic/global/menu.css
    skin/classic/global/menulist.css
    skin/classic/global/netError.css
deleted file mode 100644
--- a/toolkit/themes/osx/global/colorpicker.css
+++ /dev/null
@@ -1,41 +0,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/. */
-
-@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
-
-/* ::::: colorpicker button ::::: */
-
-colorpicker[type="button"] {
-  width: 38px;
-  height: 24px;
-  border: 1px solid #a7a7a7;
-  background-color: ThreeDFace;
-  padding: 3px;
-  -moz-appearance: button-bevel;
-}
-
-.colorpicker-button-colorbox {
-  border: 1px solid #000000;
-}
-
-/* ::::: colorpicker tiles ::::: */
-
-.colorpickertile {
-  width                 : 20px;
-  height                : 20px;
-  margin                : 1px;
-}
-
-.colorpickertile[selected="true"] {
-  border : 1px outset #C0C0C0;
-
-}
-
-.colorpickertile[hover="true"] {
-  border : 1px dotted #A7A7A7;
-}
-
-.cp-light[hover="true"] {
-  border : 1px dotted #000000;
-}
--- a/toolkit/themes/osx/global/jar.mn
+++ b/toolkit/themes/osx/global/jar.mn
@@ -3,17 +3,16 @@
 # file, You can obtain one at http://mozilla.org/MPL/2.0/.
 
 #include ../../shared/jar.inc.mn
 
 toolkit.jar:
   skin/classic/global/autocomplete.css
   skin/classic/global/button.css
   skin/classic/global/checkbox.css
-  skin/classic/global/colorpicker.css
   skin/classic/global/commonDialog.css
   skin/classic/global/dialog.css
   skin/classic/global/dropmarker.css
 * skin/classic/global/findBar.css
 * skin/classic/global/global.css
   skin/classic/global/groupbox.css
   skin/classic/global/menu.css
   skin/classic/global/menulist.css
deleted file mode 100644
--- a/toolkit/themes/windows/global/colorpicker.css
+++ /dev/null
@@ -1,48 +0,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/. */
-
-/* ===== colorpicker.css ================================================
-  == Styles used by the XUL colorpicker element.
-  ======================================================================= */
-
-@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
-
-/* ::::: colorpicker button ::::: */
- 
-/* colorpicker button */
-
-colorpicker[type="button"] {
-  -moz-appearance: button;
-  width: 38px;
-  height: 24px;
-  padding: 3px;
-}
-
-.colorpicker-button-colorbox {
-  border: 1px solid #000000;
-}
-
-/* ::::: colorpicker tiles ::::: */
-
-.colorpickertile {
-  width: 20px;
-  height: 20px;
-  margin: 1px;
-  border-left: 1px solid ThreeDShadow;
-  border-top: 1px solid ThreeDShadow;
-  border-right: 1px solid ThreeDHighlight;
-  border-bottom: 1px solid ThreeDHighlight;
-}
-
-.colorpickertile[selected="true"] {
-  border: 2px outset #C0C0C0;
-}
-
-.colorpickertile[hover="true"] {
-  border: 2px dotted #FFFFFF;
-}
-
-.cp-light[hover="true"] {
-  border: 2px dotted #909090;
-}
--- a/toolkit/themes/windows/global/jar.mn
+++ b/toolkit/themes/windows/global/jar.mn
@@ -11,17 +11,16 @@ toolkit.jar:
   skin/classic/global/dropmarker.css
   skin/classic/global/groupbox.css
 * skin/classic/global/menu.css
   skin/classic/global/menulist.css
 * skin/classic/global/popup.css
   skin/classic/global/radio.css
   skin/classic/global/tabbox.css
   skin/classic/global/textbox.css
-  skin/classic/global/colorpicker.css
   skin/classic/global/commonDialog.css
 * skin/classic/global/findBar.css
 * skin/classic/global/global.css
   skin/classic/global/netError.css
 * skin/classic/global/notification.css
   skin/classic/global/printPageSetup.css
   skin/classic/global/richlistbox.css
   skin/classic/global/scrollbox.css
--- a/xpcom/ds/StaticAtoms.py
+++ b/xpcom/ds/StaticAtoms.py
@@ -1236,17 +1236,16 @@ STATIC_ATOMS = [
     Atom("clip_rule", "clip-rule"),
     Atom("clipPath", "clipPath"),
     Atom("clipPathUnits", "clipPathUnits"),
     Atom("cm", "cm"),
     Atom("colorBurn", "color-burn"),
     Atom("colorDodge", "color-dodge"),
     Atom("colorInterpolation", "color-interpolation"),
     Atom("colorInterpolationFilters", "color-interpolation-filters"),
-    Atom("colorpicker", "colorpicker"),
     Atom("colorProfile", "color-profile"),
     Atom("cursor", "cursor"),
     Atom("cx", "cx"),
     Atom("cy", "cy"),
     Atom("d", "d"),
     Atom("darken", "darken"),
     Atom("defs", "defs"),
     Atom("deg", "deg"),