Add actualOnClick to ToolbarButtonComponent props.

packages/apputils/src/toolbar.tsx

@@ -457,6 +457,12 @@ export namespace ToolbarButtonComponent {
     tooltip?: string;
     onClick?: () => void;
     enabled?: boolean;
+
+    /**
+     * Trigger the button on the actual onClick event rather than onMouseDown. See note below as to why the
+     * default is to trigger on onMouseDown.
+     */
+    actualOnClick?: boolean;
   }
 }
 
@@ -485,6 +491,12 @@ export function ToolbarButtonComponent(props: ToolbarButtonComponent.IProps) {
     }
   };
 
+  const handleClick = (event: React.MouseEvent) => {
+    if (event.button === 0) {
+      props.onClick?.();
+    }
+  };
+
   return (
     <Button
       className={
@@ -493,7 +505,10 @@ export function ToolbarButtonComponent(props: ToolbarButtonComponent.IProps) {
           : 'jp-ToolbarButtonComponent'
       }
       disabled={props.enabled === false}
-      onMouseDown={handleMouseDown}
+      onClick={props.actualOnClick ?? false ? handleClick : undefined}
+      onMouseDown={
+        !(props.actualOnClick ?? false) ? handleMouseDown : undefined
+      }
       onKeyDown={handleKeyDown}
       title={props.tooltip || props.iconLabel}
       minimal

packages/filebrowser-extension/src/index.ts

@@ -275,7 +275,8 @@ async function activateFactory(
           window.open(newUrl, '_blank');
         }
       },
-      tooltip: 'New Launcher'
+      tooltip: 'New Launcher',
+      actualOnClick: true
     });
     widget.toolbar.insertItem(0, 'launch', launcher);