[fixed] Tab focus escapes modal on shift + tab after opening

Author: jasonblanchard

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 = <button>top</button>;
+    const bottomButton = <button>bottom</button>;
+    const modalContent = (
+      <div>
+        {topButton}
+        {bottomButton}
+      </div>
+    );
+    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", () => {

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;