Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[SwipeableDrawer] Discovery and hysteresis broken in React v18

See original GitHub issue

Duplicates

I have searched the existing issues

Latest version

I have tested the latest version

Current behavior 😯

Discovery opens drawer completely
Partially opened drawer (> hysteresis) is not opened completely

Expected behavior 🤔

No response

Steps to reproduce 🕹

https://codesandbox.io/s/unruffled-poincare-2v4pk

Context 🔦

No response

Your environment 🌎

"@emotion/react": "^11.7.1",
"@emotion/styled": "^11.6.0",
"@mui/material": "^5.2.5",
"react": "18.0.0-rc.0",
"react-dom": "18.0.0-rc.0"

Issue Analytics

State:
Created 2 years ago
Reactions:3
Comments:8 (6 by maintainers)

Top GitHub Comments

11reactions

mnajdovacommented, Sep 28, 2022

I’ve created https://github.com/mui/material-ui/pull/34505 which is fixing the two issues mentioned here. I am not 100% happy with the fix, as it requires using keepMounted on the Modal, but let’s see if other maintainers will have some suggestions around this.

Here is a sandbox with the fix: https://codesandbox.io/s/7qkr9k?file=/demo.tsx

5reactions

tech-meppemcommented, Aug 30, 2022

I can confirm this is happening still.

My best guess at what I believe what’s happening is that when rendering the drawer / paper component, it deletes/replaces the existing styles, instead of just overriding the ones that have changed. This means that the transform style is deleted, and as such, the discovery doesn’t work. Although, that’s only a guess based on logging output of styles that I’ve been debugging.

I’ve been working on my PR’s unit tests, trying to figure out why they are broken for a long time now, and I now believe this to be the reason.

Top Results From Across the Web

React v18.0 – React Blog

In this post, we'll give an overview of what's new in React 18, and what it means for the future. Our latest major...

Concurrent UI Patterns (Experimental) - React

When we click “Next”, nothing happens and it feels like the app is broken. Our useTransition() call returns two values: startTransition and isPending...

Suspense for Data Fetching (Experimental) - React

For details about concurrent APIs in React 18, refer to: ... The rest of this page includes content that's stale, broken, or incorrect....

React MUI SwipeableDrawer API - GeeksforGeeks

In this article, we will discuss the React MUI SwipeableDrawer API. ... in the drawer for the accidental discovery of the swipe gesture....

Reproducibility of edge probing tasks - Nyu-Mll/Jiant - IssueHint

[SwipeableDrawer] Discovery and hysteresis broken in React v18, 5, 2021-12-27, 2022-07-25. Revert "New JSX transform" + version bump, 0, 2021-01-26 ...