Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Snackbar] resumeHideDuration short-circuits on 0 milliseconds #11946

Closed
1 task done
benz2012 opened this issue Jun 22, 2018 · 1 comment
Closed
1 task done

[Snackbar] resumeHideDuration short-circuits on 0 milliseconds #11946

benz2012 opened this issue Jun 22, 2018 · 1 comment
Labels
bug 🐛 Something doesn't work component: snackbar This is the name of the generic UI component, not the React module! good first issue Great for first contributions. Enable to learn the contribution process.

Comments

@benz2012
Copy link

  • I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

When passing a value of 0 into the resumeHideDuration prop of the Snackbar component, the Snackbar will immediately fire onClose following a user interaction.

Current Behavior

When passing a value of 0 into the resumeHideDuration prop of the Snackbar component, the component uses the autoHideDuration prop instead, because the value of 0 evaluates to false in short-circuit evaluation

I can confirm this by looking at the source code of the Snackbar component. On Line 182 the component attempts to set a timer using the resumeHideDuration prop

https://github.com/mui-org/material-ui/blob/dce7801ffc1187137301d84bc367e7b8880e522e/packages/material-ui/src/Snackbar/Snackbar.js#L182

Then on Line 146, any value that evaluates to false will be skipped, with the next option being to use this.props.autoHideDuration.

https://github.com/mui-org/material-ui/blob/dce7801ffc1187137301d84bc367e7b8880e522e/packages/material-ui/src/Snackbar/Snackbar.js#L133-L147

Steps to Reproduce

  1. Create <Snackbar /> component providing proper state handling of the open & onClose props, also supplying an action prop, allowing for user interaction. Then supply an autoHideDuration prop of any number larger than 0, and a resumeHideDuration prop with the value of 0.

  2. Activate the snackbar

  3. Interact with the snackbar (ie. click the Undo button)

CodeSandbox: https://codesandbox.io/s/04nz3r87qn

Your Environment

Tech Version
Material-UI 1.2.3
React 16.3.2
Browser Safari 11.0.3 (11604.5.6.1.1)
@oliviertassinari oliviertassinari added bug 🐛 Something doesn't work good first issue Great for first contributions. Enable to learn the contribution process. component: snackbar This is the name of the generic UI component, not the React module! labels Jun 22, 2018
@oliviertassinari
Copy link
Member

@benz2012 You are right, we need to fix this line: https://github.com/mui-org/material-ui/blob/dce7801ffc1187137301d84bc367e7b8880e522e/packages/material-ui/src/Snackbar/Snackbar.js#L146
Something like this should do it:

-}, autoHideDuration || this.props.autoHideDuration || 0); 
+}, autoHideDuration !== null ? autoHideDuration : this.props.autoHideDuration); 

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug 🐛 Something doesn't work component: snackbar This is the name of the generic UI component, not the React module! good first issue Great for first contributions. Enable to learn the contribution process.
Projects
None yet
Development

No branches or pull requests

2 participants