Fixing issue with tabbing when a radio is the last element of the modal

specs/Modal.events.spec.js

@@ -128,6 +128,26 @@ export default () => {
     });
   });
 
+  it("traps tab in the modal on tab with radio button as last element", () => {
+    const topButton = <button>top</button>;
+    const radio1 = <input id="radio-a" name="radios" type="radio" />;
+    const radio2 = <input id="radio-b" name="radios" type="radio" />;
+    const modalContent = (
+      <div>
+        {topButton}
+        {radio1}
+        {radio2}
+      </div>
+    );
+    const props = { isOpen: true };
+    withModal(props, modalContent, modal => {
+      const content = mcontent(modal);
+      tabKeyDown(content);
+      tabKeyDown(content);
+      document.activeElement.textContent.should.be.eql("top");
+    });
+  });
+
   describe("shouldCloseOnEsc", () => {
     context("when true", () => {
       it("should close on Esc key event", () => {

src/helpers/scopeTab.js

@@ -6,6 +6,10 @@ function getActiveElement(el = document) {
     : el.activeElement;
 }
 
+function areFromSameRadioGroup(a, b) {
+  return a.type === "radio" && b.type === "radio" && a.name === b.name;
+}
+
 export default function scopeTab(node, event) {
   const tabbable = findTabbable(node);
 
@@ -29,7 +33,10 @@ export default function scopeTab(node, event) {
     target = tail;
   }
 
-  if (tail === activeElement && !shiftKey) {
+  if (
+    (tail === activeElement || areFromSameRadioGroup(activeElement, tail)) &&
+    !shiftKey
+  ) {
     target = head;
   }