Resize dock to fit on double-click of resize handle

spec/dock-spec.js

@@ -1,3 +1,7 @@
+/** @babel */
+
+import {it, fit, ffit, fffit, beforeEach, afterEach} from './async-spec-helpers'
+
 describe('Dock', () => {
   describe('when a pane in a dock is activated', () => {
     it('opens the dock', () => {
@@ -12,4 +16,72 @@ describe('Dock', () => {
       expect(atom.workspace.getLeftDock().isOpen()).toBe(true)
     })
   })
-})
+
+  describe('when the dock resize handle is double-clicked', () => {
+    describe('when the dock is open', () => {
+      it('resizes a vertically-oriented dock to the current item\'s preferred width', async () => {
+        const workspaceElement = atom.views.getView(atom.workspace)
+        jasmine.attachToDOM(workspaceElement)
+
+        const item = {
+          element: document.createElement('div'),
+          getDefaultLocation() { return 'left' },
+          getPreferredWidth() { return 142 },
+          getPreferredHeight() { return 122 }
+        }
+
+        await atom.workspace.open(item)
+        const dock = atom.workspace.getLeftDock()
+        const dockElement = dock.getElement()
+
+        dock.setState({size: 300})
+        expect(dockElement.offsetWidth).toBe(300)
+        dockElement.querySelector('.atom-dock-resize-handle').dispatchEvent(new MouseEvent('mousedown', {detail: 2}))
+
+        expect(dockElement.offsetWidth).toBe(item.getPreferredWidth())
+      })
+
+      it('resizes a horizontally-oriented dock to the current item\'s preferred width', async () => {
+        const workspaceElement = atom.views.getView(atom.workspace)
+        jasmine.attachToDOM(workspaceElement)
+
+        const item = {
+          element: document.createElement('div'),
+          getDefaultLocation() { return 'bottom' },
+          getPreferredWidth() { return 122 },
+          getPreferredHeight() { return 142 }
+        }
+
+        await atom.workspace.open(item)
+        const dock = atom.workspace.getBottomDock()
+        const dockElement = dock.getElement()
+
+        dock.setState({size: 300})
+        expect(dockElement.offsetHeight).toBe(300)
+        dockElement.querySelector('.atom-dock-resize-handle').dispatchEvent(new MouseEvent('mousedown', {detail: 2}))
+
+        expect(dockElement.offsetHeight).toBe(item.getPreferredHeight())
+      })
+    })
+
+    describe('when the dock is closed', () => {
+      it('does nothing', async () => {
+        const workspaceElement = atom.views.getView(atom.workspace)
+        jasmine.attachToDOM(workspaceElement)
+
+        const item = {
+          element: document.createElement('div'),
+          getDefaultLocation() { return 'bottom' },
+          getPreferredWidth() { return 122 },
+          getPreferredHeight() { return 142 }
+        }
+
+        await atom.workspace.open(item, {activatePane: false})
+
+        const dockElement = atom.workspace.getBottomDock().getElement()
+        dockElement.querySelector('.atom-dock-resize-handle').dispatchEvent(new MouseEvent('mousedown', {detail: 2}))
+        expect(dockElement.offsetHeight).toBe(0)
+      })
+    })
+  })
+})

src/dock.js

@@ -20,6 +20,7 @@ const CURSOR_OVERLAY_VISIBLE_CLASS = 'atom-dock-cursor-overlay-visible'
 module.exports = class Dock {
   constructor (params) {
     this.handleResizeHandleDragStart = this.handleResizeHandleDragStart.bind(this)
+    this.handleResizeToFit = this.handleResizeToFit.bind(this)
     this.handleMouseMove = this.handleMouseMove.bind(this)
     this.handleMouseUp = this.handleMouseUp.bind(this)
     this.handleDrag = _.throttle(this.handleDrag.bind(this), 30)
@@ -139,7 +140,8 @@ module.exports = class Dock {
       this.wrapperElement.classList.add('atom-dock-content-wrapper', this.location)
       this.resizeHandle = new DockResizeHandle({
         location: this.location,
-        onResizeStart: this.handleResizeHandleDragStart
+        onResizeStart: this.handleResizeHandleDragStart,
+        onResizeToFit: this.handleResizeToFit
       })
       this.toggleButton = new DockToggleButton({
         onDragEnter: this.handleToggleButtonDragEnter.bind(this),
@@ -211,6 +213,14 @@ module.exports = class Dock {
     this.setState({resizing: true})
   }
 
+  handleResizeToFit () {
+    const item = this.getActivePaneItem()
+    if (item) {
+      const size = getPreferredSize(item, this.getLocation())
+      if (size != null) this.setState({size})
+    }
+  }
+
   handleMouseMove (event) {
     if (event.buttons === 0) { // We missed the mouseup event. For some reason it happens on Windows
       this.handleMouseUp(event)
@@ -634,8 +644,10 @@ class DockResizeHandle {
     this.element.removeEventListener('mousedown', this.handleMouseDown)
   }
 
-  handleMouseDown () {
-    if (this.props.dockIsOpen) {
+  handleMouseDown (event) {
+    if (event.detail === 2) {
+      this.props.onResizeToFit()
+    } else if (this.props.dockIsOpen) {
       this.props.onResizeStart()
     }
   }