From 711e8b6ac7ced26d08831fc4b8a2d3b92b1ef6af Mon Sep 17 00:00:00 2001 From: Tony Brix Date: Wed, 28 Nov 2018 11:37:23 -0600 Subject: [PATCH 1/4] allow autoFocus to be used as initialFocus --- src/panel-container-element.js | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/src/panel-container-element.js b/src/panel-container-element.js index 5334b61b4..f46a173c8 100644 --- a/src/panel-container-element.js +++ b/src/panel-container-element.js @@ -54,8 +54,8 @@ class PanelContainerElement extends HTMLElement { if (visible) { this.hideAllPanelsExcept(panel) } })) - if (panel.autoFocus) { - const modalFocusTrap = focusTrap(panelElement, { + if (panel.autoFocus !== false) { + const focusOptions = { // focus-trap will attempt to give focus to the first tabbable element // on activation. If there aren't any tabbable elements, // give focus to the panel element itself @@ -63,7 +63,12 @@ class PanelContainerElement extends HTMLElement { // closing is handled by core Atom commands and this already deactivates // on visibility changes escapeDeactivates: false - }) + } + + if (panel.autoFocus !== true) { + focusOptions.initialFocus = panel.autoFocus + } + const modalFocusTrap = focusTrap(panelElement, focusOptions) this.subscriptions.add(panel.onDidChangeVisible(visible => { if (visible) { From 619979909c7102ac33c689e379764377294428aa Mon Sep 17 00:00:00 2001 From: Tony Brix Date: Tue, 15 Jan 2019 22:01:43 -0600 Subject: [PATCH 2/4] update documentation --- src/workspace.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/workspace.js b/src/workspace.js index a3f85ddeb..e887acf49 100644 --- a/src/workspace.js +++ b/src/workspace.js @@ -1785,8 +1785,8 @@ module.exports = class Workspace extends Model { // (default: true) // * `priority` (optional) {Number} Determines stacking order. Lower priority items are // forced closer to the edges of the window. (default: 100) - // * `autoFocus` (optional) {Boolean} true if you want modal focus managed for you by Atom. - // Atom will automatically focus your modal panel's first tabbable element when the modal + // * `autoFocus` (optional) {Boolean|Element} true if you want modal focus managed for you by Atom. + // Atom will automatically focus on this element or your modal panel's first tabbable element when the modal // opens and will restore the previously selected element when the modal closes. Atom will // also automatically restrict user tab focus within your modal while it is open. // (default: false) From 4ba47b59d6c86f5aff2c9118e68f0e98afa2e4d8 Mon Sep 17 00:00:00 2001 From: Tony Brix Date: Tue, 15 Jan 2019 22:18:19 -0600 Subject: [PATCH 3/4] add test --- spec/panel-container-element-spec.js | 18 ++++++++++++++++-- 1 file changed, 16 insertions(+), 2 deletions(-) diff --git a/spec/panel-container-element-spec.js b/spec/panel-container-element-spec.js index 5634883df..b85a8b73d 100644 --- a/spec/panel-container-element-spec.js +++ b/spec/panel-container-element-spec.js @@ -162,11 +162,11 @@ describe('PanelContainerElement', () => { }) describe("autoFocus", () => { - function createPanel() { + function createPanel(autoFocus = true) { const panel = new Panel( { item: new TestPanelContainerItem(), - autoFocus: true, + autoFocus: autoFocus, visible: false }, atom.views @@ -188,6 +188,20 @@ describe('PanelContainerElement', () => { expect(document.activeElement).toBe(inputEl) }) + it("focuses the autoFocus element if available", () => { + const inputEl1 = document.createElement('input') + const inputEl2 = document.createElement('input') + const panel = createPanel(inputEl2) + const panelEl = panel.getElement() + + panelEl.appendChild(inputEl1) + panelEl.appendChild(inputEl2) + expect(document.activeElement).not.toBe(inputEl2) + + panel.show() + expect(document.activeElement).toBe(inputEl2) + }) + it("focuses the entire panel item when no tabbable item is available and the panel is focusable", () => { const panel = createPanel() const panelEl = panel.getElement() From 04234bd95a18f1ea1dbda0d5b9e26249ce369dfb Mon Sep 17 00:00:00 2001 From: Tony Brix Date: Wed, 16 Jan 2019 14:08:29 -0600 Subject: [PATCH 4/4] handle null or undefined --- src/panel-container-element.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/panel-container-element.js b/src/panel-container-element.js index f46a173c8..a3dc9f62b 100644 --- a/src/panel-container-element.js +++ b/src/panel-container-element.js @@ -54,7 +54,7 @@ class PanelContainerElement extends HTMLElement { if (visible) { this.hideAllPanelsExcept(panel) } })) - if (panel.autoFocus !== false) { + if (panel.autoFocus) { const focusOptions = { // focus-trap will attempt to give focus to the first tabbable element // on activation. If there aren't any tabbable elements,