diff --git a/specs/Modal.events.spec.js b/specs/Modal.events.spec.js
index af9c2fcc..a6e2ca1d 100644
--- a/specs/Modal.events.spec.js
+++ b/specs/Modal.events.spec.js
@@ -44,6 +44,21 @@ export default () => {
document.activeElement.should.be.eql(content);
});
+ it("Traps tab in the modal one shift + tab", () => {
+ const topButton = ;
+ const bottomButton = ;
+ const modalContent = (
+
+ {topButton}
+ {bottomButton}
+
+ );
+ const modal = renderModal({ isOpen: true }, modalContent);
+ const content = mcontent(modal);
+ tabKeyDown(content, { shiftKey: true });
+ document.activeElement.textContent.should.be.eql("bottom");
+ });
+
describe("shouldCloseOnEsc", () => {
context("when true", () => {
it("should close on Esc key event", () => {
diff --git a/src/helpers/scopeTab.js b/src/helpers/scopeTab.js
index cf7c817d..11e0aef6 100644
--- a/src/helpers/scopeTab.js
+++ b/src/helpers/scopeTab.js
@@ -13,9 +13,11 @@ export default function scopeTab(node, event) {
const head = tabbable[0];
const tail = tabbable[tabbable.length - 1];
- // proceed with default browser behavior
+ // proceed with default browser behavior on tab.
+ // Focus on last element on shift + tab.
if (node === document.activeElement) {
- return;
+ if (!shiftKey) return;
+ target = tail;
}
var target;