Material-ui: [Drawer] Container of Drawer jumps

[merkelAlbert]

• [x] This is not a v0.x issue.
• [x] I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior 🤔

If i initialize drawer in container with SlideProps={{ direction: 'left' }} (or SlideProps={{ direction: 'up' }} too) container should stay immovable

Current Behavior 😯

Container jumps

Steps to Reproduce 🕹

Link: https://codesandbox.io/s/serene-bouman-wvvf6

1. initialize Drawer inside a container
2. set anchor="right"
3. set SlideProps={{ direction: 'left' }} or SlideProps={{ direction: 'up' }}
4. look how container is jumping

Context 🔦

I want to create drawer that is located in a container and appears from right side of the window.

For example, if i set SlideProps to other values(right or down), my container stays still. Here are some examples of this issue:

1. anchor="left" SlideProps={{ direction: 'left' }} Incorrect behavior
   

2. anchor="left" SlideProps={{ direction: 'right' }} Correct behavior
   

3. anchor="right" SlideProps={{ direction: 'left' }} (_my case_) Incorrect behavior
   

4. anchor="right" SlideProps={{ direction: 'right' }} Correct behavior
   

BUT!
i explored sources of Drawer and have noticed that this issue appears exactly in Slide component particularly from line 43 to line 57
if in this fragment: translateX(${window.innerWidth}px) translateX(-${rect.left - offsetX}px) i change first translate to translateX(${window.innerWidth - 32}px) (exactly 32>, i dont know why, 31<= not working) it will work fine

Your Environment 🌎

| Tech | Version |
|--------------|---------|
| Material-UI | v4.1.3 |
| React | v16.8.6 |
| Browser | Chrome v75 |

[oliviertassinari]

@merkelAlbert Interesting. I have no clue what could be wrong in this case. Did you or your team found a solution?

It looks like a browser bug but it behaves in different wrong ways on Safari, Chrome and Firefox.

[merkelAlbert]

@oliviertassinari, yes, we found two doubtful solutions. First is disablePortal: true in ModalProps.Second is variant="persistent". We can adapt these solutions to our requirements. But the fact is that we cant use this native drawer api out of the box like with working cases, that i described in the issue