Unexpected body scrolls when using Menu with modal: true

[tkhquang]

🐛 Bug report

Current behavior

Possibly related: #803, #819

While triggering the menu dialog, layout unexpectedly scrolls to other position. This only happens with modal: true in the useMenuState hook. Same result if I manually wrap Menu inside a reakit Portal

Steps to reproduce the bug

1. Open the sandbox: https://codesandbox.io/s/cool-tree-ny0li?file=/src/App.js
2. Scroll down the page by some margin
3. Click on the menu trigger
4. Repeat the step 2-3 about 3 or 4 times if not yet happen

Expected behavior

The layout should stay in place (not be scrolled) when triggering the menu.

Environment

 System:
    OS: macOS 10.15.7
    CPU: (8) x64 Intel(R) Core(TM) i7-3840QM CPU @ 2.80GHz
    Memory: 107.96 MB / 16.00 GB
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 14.15.3 - ~/.asdf/installs/nodejs/14.15.3/bin/node
    Yarn: 1.22.10 - /usr/local/bin/yarn
    npm: 6.14.9 - ~/.asdf/installs/nodejs/14.15.3/bin/npm
  Browsers:
    Chrome: 89.0.4389.114
    Firefox Developer Edition: 88.0
    Safari: 14.0
  npmPackages:
    react: ^17.0.1 => 17.0.1
    react-dom: ^17.0.1 => 17.0.1
    react-is: ^17.0.1 => 17.0.1
    reakit: ^1.1.1 => 1.3.7

[open-collective-bot]

Hey @tkhquang 👋,

Thank you for opening an issue. We'll get back to you as soon as we can.
Please, consider supporting us on Open Collective. We give a special attention to issues opened by backers.

If you use Reakit at work, you can also ask your company to sponsor us ❤️.

[diegohaz]

Closing as this has been fixed in v2: https://codesandbox.io/s/affectionate-buck-zn8h0n?file=/src/App.js