From bdf41a9e7ca568d6386614dc30ede6a40871c786 Mon Sep 17 00:00:00 2001
From: Leonardo Nascimento <leo386386@gmail.com>
Date: Tue, 20 Feb 2018 00:30:32 -0300
Subject: [PATCH] Changed aria-modal like false when's is webkit

---
 src/components/ModalPortal.js |  6 +++++-
 src/helpers/checkBrowser.js   | 16 ++++++++++++++++
 src/helpers/scopeTab.js       | 18 +-----------------
 3 files changed, 22 insertions(+), 18 deletions(-)
 create mode 100644 src/helpers/checkBrowser.js

diff --git a/src/components/ModalPortal.js b/src/components/ModalPortal.js
index 5ded7a16..7c4b1aea 100644
--- a/src/components/ModalPortal.js
+++ b/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}
diff --git a/src/helpers/checkBrowser.js b/src/helpers/checkBrowser.js
new file mode 100644
index 00000000..05286d43
--- /dev/null
+++ b/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;
diff --git a/src/helpers/scopeTab.js b/src/helpers/scopeTab.js
index 11e0aef6..5003fa14 100644
--- a/src/helpers/scopeTab.js
+++ b/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;