--- a/devtools/client/framework/components/toolbox-tab.js
+++ b/devtools/client/framework/components/toolbox-tab.js
@@ -56,17 +56,17 @@ class ToolboxTab extends Component {
         className,
         id: `toolbox-tab-${id}`,
         "data-id": id,
         title: tooltip,
         type: "button",
         "aria-pressed": currentToolId === id ? "true" : "false",
         tabIndex: focusedButton === id ? "0" : "-1",
         onFocus: () => focusButton(id),
-        onMouseDown: () => selectTool(id),
+        onClick: () => selectTool(id),
         onKeyDown: (evt) => {
           if (evt.key === "Enter" || evt.key === " ") {
             selectTool(id);
           }
         },
       },
       span(
         {

--- a/devtools/client/framework/toolbox-tabs-order-manager.js
+++ b/devtools/client/framework/toolbox-tabs-order-manager.js
@@ -73,27 +73,29 @@ class ToolboxTabsOrderManager {
 
     let distance = e.pageX - this.dragStartX;
 
     if ((this.dragTarget.style.order == this.minOrder && distance < 0) ||
         (this.dragTarget.style.order == this.maxOrder && distance > 0)) {
       distance = 0;
     }
 
+    this.dragTarget.classList.add("drag-target");
     this.dragTarget.style.left = `${ distance }px`;
   }
 
   onMouseOut(e) {
     if (e.pageX <= 0 || this.tabsElement.ownerDocument.width <= e.pageX ||
         e.pageY <= 0 || this.tabsElement.ownerDocument.height <= e.pageY) {
       this.onMouseUp();
     }
   }
 
   onMouseUp() {
+    this.dragTarget.classList.remove("drag-target");
     this.dragTarget.style.left = "unset";
     this.dragTarget = null;
 
     this.tabsElement.ownerDocument.removeEventListener("mousemove", this.onMouseMove);
     this.tabsElement.ownerDocument.removeEventListener("mouseout", this.onMouseOut);
     this.tabsElement.ownerDocument.removeEventListener("mouseup", this.onMouseUp);
   }
 }

--- a/devtools/client/themes/toolbox.css
+++ b/devtools/client/themes/toolbox.css
@@ -152,16 +152,21 @@
 .devtools-tab.selected > img {
   fill: var(--theme-toolbar-selected-color);
 }
 
 .devtools-tab.highlighted > img {
   fill: var(--theme-toolbar-highlighted-color);
 }
 
+.devtools-tab.drag-target {
+  /* To avoid selecting this tool if it was dragged */
+  pointer-events: none;
+}
+
 /* Toolbox controls */
 
 #toolbox-controls {
   margin-right: 3px;
 }
 
 #toolbox-buttons-end > .devtools-separator {
   margin-inline-start: 5px;