Snackbar - TypeError: Cannot read property 'scrollTop' of undefined

[sathishk2030]

@material-ui/core: 4.1.2

Re-produce: use react material live site & CodeSandbox demo.

[joshwooding]

Confirmed reproduction: https://codesandbox.io/embed/y6lzd

Opened success snackbar and got the type error.

[klein-h]

Confirmed on the material-ui website too.

[oliviertassinari]

Should we uniquely fix the demo? Do we have a better alternative in the core?

[klein-h]

When the demo will be fix, i think the component will be usable.

[oliviertassinari]

@klein-h The demo fix is simple, it's about adding React.forwardRef.

[eps1lon]

Should we uniquely fix the demo?

I'm fixing the demo and add a prop-type warning. The child of Snackbar needs to be able to hold a ref since we switched to @material-ui/react-transition-group. We didn't have a test for custom children which is why this breakage slipped through.

[eps1lon]

#16283 was a breaking for Snackbars. We need to revert.

[oliviertassinari]

Would a fallback logic on findDOMNode work? Is it possible to detect if the provided element doesn't accept a ref?

[eps1lon]

Can we detect if the provided element doesn't accept a ref?

Unfortunately not. We can only look at the direct element and in cases of React.memo we don't know if a ref can be held because it could wrap a function component.

Would a fallback logic on findDOMNode work?

We could convert Snackbar to a class component and then fallback to findDOMNode(this). But it would still create warnings that we attached a ref to function components. This is a pretty big drawback because that particular warning is an actual error for every other material-ui component. If we communicate that it can be ignored for Snackbars it might be ignored in other cases.

[klein-h]

Still have the error on the demo page btw.

[eps1lon]

@klein-h We don't automatically release merged PRs.

[AnuragTiwari1]

for now use v4.0.0 that is working for me

[eps1lon]

for now use v4.0.0 that is working for me

4.1.1 should be good too.

[sathishk2030]

for now use v4.0.0 that is working for me

4.1.1 should be good too.

Downgrading to 4.1.1 not fixing the problem....
even tried 4.0.2

"@material-ui/core": "^4.1.1",
"@material-ui/icons": "^4.2.1",
"@material-ui/lab": "^4.0.0-alpha.17",
"@material-ui/styles": "^4.1.2",
"@mdi/font": "^3.7.95",
"@mdi/js": "^3.7.95",
"@mdi/react": "^1.1.1",

[nvtin]

I got the same error with version 4.1.1
It works well on my development but not in production.

[nvtin]

I had tried v4.1.2 and v4.1.1 and It was not working. It is working well for me on v4.1.0

[eps1lon]

If it's not working on 4.1.1 or before please open a new issue and follow the template. The reproduction from #16347 (comment) does not crash with 4.1.1

[sathishk2030]

Issue fixed, working in 4.1.3