Toast on top is hidden when virtual keyboard on safari mobile browser is open

**Do you want to request a *feature* or report a *bug*?**

*bug*

**What is the current behavior?**

The virtual keyboard on safari (in a input box) mobile browser pushes the screen elements outside the screen (to top). If we display an error on top, the toast is hidden.

**If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React. Paste the link to your CodeSandbox (https://codesandbox.io/s/new) example below:**

1. create a form with input box
2. open it on mobile safari browser on iphone
3. add a button, clicking which displays a toast on top
4. the toast is displayed above the visible area of the screen

**What is the expected behavior?**

The toast should be visible at top.

**Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?**

Iphone, safari mobile browser

The issue names no file or test. Reproduce the form and top toast on an iPhone using Safari with the virtual keyboard open, then trace the toast-positioning entry point; done means the toast remains visible at the top of the viewport while the keyboard is open.

Written by the indexing model from the issue text.