[fixed] Don't set aria-modal attribute when running on apple's Webkit.

src/components/ModalPortal.js

@@ -3,6 +3,7 @@ import PropTypes from "prop-types";
 import * as focusManager from "../helpers/focusManager";
 import scopeTab from "../helpers/scopeTab";
 import * as ariaAppHider from "../helpers/ariaAppHider";
+import { isSafariDesktop } from "../helpers/ariaAppHider";
 import * as bodyClassList from "../helpers/bodyClassList";
 import SafeHTMLElement from "../helpers/safeHTMLElement";
 
@@ -17,6 +18,9 @@ const ESC_KEY = 27;
 
 let ariaHiddenInstances = 0;
 
+const ariaModal = navigator.userAgent.match(/(iPhone|iPad|Mac)/i)
+  || isSafariDesktop ? {} : { modal: true };
+
 export default class ModalPortal extends Component {
   static defaultProps = {
     style: {
@@ -318,7 +322,7 @@ export default class ModalPortal extends Component {
         onClick={this.handleOverlayOnClick}
         onMouseDown={this.handleOverlayOnMouseDown}
         onMouseUp={this.handleOverlayOnMouseUp}
-        aria-modal="true"
+        {...this.ariaAttributes(ariaModal)}
       >
         <div
           ref={this.setContentRef}

src/helpers/checkBrowser.js

@@ -0,0 +1,16 @@
+// Safari radio issue.
+//
+// Safari does not move the focus to the radio button,
+// so we need to force it to really walk through all elements.
+//
+// This is very error prune, since we are trying to guess
+// if it is a safari browser from the first occurence between
+// chrome or safari.
+//
+// The chrome user agent contains the first ocurrence
+// as the 'chrome/version' and later the 'safari/version'.
+const checkSafari = /(\bChrome\b|\bSafari\b)\//.exec(navigator.userAgent);
+export const isSafariDesktop =
+  checkSafari != null &&
+  checkSafari[1] != "Chrome" &&
+  /\biPod\b|\biPad\b/g.exec(navigator.userAgent) == null;

src/helpers/scopeTab.js

@@ -1,4 +1,5 @@
 import findTabbable from "./tabbable";
+import { isSafariDesktop } from "./checkBrowser";
 
 export default function scopeTab(node, event) {
   const tabbable = findTabbable(node);
@@ -35,23 +36,6 @@ export default function scopeTab(node, event) {
     return;
   }
 
-  // Safari radio issue.
-  //
-  // Safari does not move the focus to the radio button,
-  // so we need to force it to really walk through all elements.
-  //
-  // This is very error prune, since we are trying to guess
-  // if it is a safari browser from the first occurence between
-  // chrome or safari.
-  //
-  // The chrome user agent contains the first ocurrence
-  // as the 'chrome/version' and later the 'safari/version'.
-  const checkSafari = /(\bChrome\b|\bSafari\b)\//.exec(navigator.userAgent);
-  const isSafariDesktop =
-    checkSafari != null &&
-    checkSafari[1] != "Chrome" &&
-    /\biPod\b|\biPad\b/g.exec(navigator.userAgent) == null;
-
   // If we are not in safari desktop, let the browser control
   // the focus
   if (!isSafariDesktop) return;