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

[core] Batch small changes #19016

Merged
merged 10 commits into from
Dec 30, 2019

Conversation

oliviertassinari
Copy link
Member

@oliviertassinari oliviertassinari commented Dec 29, 2019

  • [docs] Fix IE 11 support ba92f4d: Related to IE 11 support :) markedjs/marked#1585. I feel like we have been fighting for months to keep IE 11 support.
  • [docs] Remove polyfills, increase confidence 5b5c585: Remove the polyfills to uncover potential issues and give more confidence when authoring components.
    Developers should expect our demos to provide the same level of quality as the source.
    If we need a polyfill to make the docs run, something is probably off.
  • [Autocomplete] Add missing end dot in prop description 5565b6f
  • [test] Use strict mode as much as possible 4098f91
  • [Snackbar] Improve accessibility edb25bf: Leverage https://medium.com/@sheribyrnehaber/designing-toast-messages-for-accessibility-fb610ac364be. The aria-describedby seems to originate from the initial implementation, a long time ago, after a benchmark, and listening to VoiceOver announcement, I believe we can remove it, and simplify the demos :). If it's needed, then it would be great to explain why in the accessibility subsection of the docs page.
  • [docs] Improve iframe experience 78ad088:
  • [docs] Improve ad display tracking e123868: fix the display in Google index, fix flicker, fix event flooding, increase granularity in the display stats.

Remove the polyfils to uncover potential issues and give more confidence when authoring components.
Developers should expect our demos to provide the same level of quality than the source.
If we need a polyfill to make the docs run, something is probably off.
@oliviertassinari oliviertassinari added the umbrella For grouping multiple issues to provide a holistic view label Dec 29, 2019
@mui-pr-bot
Copy link

mui-pr-bot commented Dec 29, 2019

Details of bundle changes.

Comparing: 83fb7f4...d960cb9

bundle Size Change Size Gzip Change Gzip
docs.main ▲ +689 B (+0.11% ) 614 kB ▼ -221 B (-0.11% ) 196 kB
useAutocomplete ▲ +52 B (+0.41% ) 12.7 kB ▲ +4 B (+0.09% ) 4.71 kB
@material-ui/lab ▲ +49 B (+0.03% ) 177 kB ▲ +8 B (+0.01% ) 53.4 kB
Autocomplete ▲ +49 B (+0.04% ) 129 kB ▲ +3 B (+0.01% ) 40.4 kB
Avatar ▼ -3 B (-0.00% ) 64.9 kB ▼ -1 B (-0.00% ) 20.5 kB
Radio ▼ -3 B (-0.00% ) 82.7 kB ▲ +1 B (0.00% ) 26.2 kB
SpeedDialIcon ▼ -3 B (-0.00% ) 64.3 kB ▼ -1 B (-0.00% ) 20.2 kB
StepButton ▼ -3 B (-0.00% ) 82 kB ▼ -1 B (-0.00% ) 26 kB
StepIcon ▼ -3 B (-0.00% ) 64.3 kB ▼ -1 B (-0.00% ) 20.1 kB
TablePagination ▼ -3 B (-0.00% ) 141 kB ▼ -1 B (-0.00% ) 41.3 kB
TableSortLabel ▼ -3 B (-0.00% ) 77 kB ▼ -1 B (-0.00% ) 24.3 kB
TextField ▼ -3 B (-0.00% ) 123 kB ▼ -1 B (-0.00% ) 36.1 kB
@material-ui/core ▼ -3 B (-0.00% ) 358 kB -- 97.7 kB
@material-ui/core[umd] ▼ -3 B (-0.00% ) 314 kB -- 90.6 kB
Breadcrumbs ▼ -3 B (-0.00% ) 67.7 kB -- 21.3 kB
Checkbox ▼ -3 B (-0.00% ) 81.6 kB -- 25.9 kB
Chip ▼ -3 B (-0.00% ) 82.2 kB -- 25.2 kB
NativeSelect ▼ -3 B (-0.00% ) 76.5 kB -- 24.2 kB
Rating ▼ -3 B (-0.00% ) 70 kB -- 22.6 kB
Select ▼ -3 B (-0.00% ) 114 kB -- 34 kB
StepLabel ▼ -3 B (-0.00% ) 68.3 kB -- 21.2 kB
SvgIcon ▼ -3 B (-0.00% ) 62.7 kB -- 19.6 kB
Tabs ▼ -3 B (-0.00% ) 85.1 kB -- 27.1 kB
@material-ui/styles -- 50.8 kB -- 15.3 kB
@material-ui/system -- 14.5 kB -- 4.04 kB
AppBar -- 63.6 kB -- 20 kB
AvatarGroup -- 62 kB -- 19.5 kB
Backdrop -- 67.4 kB -- 20.9 kB
Badge -- 65 kB -- 20.3 kB
BottomNavigation -- 62.1 kB -- 19.5 kB
BottomNavigationAction -- 75.2 kB -- 23.8 kB
Box -- 70.4 kB -- 21.5 kB
Button -- 79.4 kB -- 24.4 kB
ButtonBase -- 73.6 kB -- 23.2 kB
ButtonGroup -- 82.8 kB -- 25.5 kB
Card -- 62.5 kB -- 19.6 kB
CardActionArea -- 74.7 kB -- 23.6 kB
CardActions -- 61.7 kB -- 19.4 kB
CardContent -- 61.7 kB -- 19.4 kB
CardHeader -- 64.8 kB -- 20.4 kB
CardMedia -- 62 kB -- 19.6 kB
CircularProgress -- 63.8 kB -- 20.2 kB
ClickAwayListener -- 3.85 kB -- 1.55 kB
Collapse -- 67.6 kB -- 21 kB
colorManipulator -- 3.85 kB -- 1.52 kB
Container -- 62.9 kB -- 19.7 kB
CssBaseline -- 57.3 kB -- 18 kB
Dialog -- 82.4 kB -- 25.8 kB
DialogActions -- 61.8 kB -- 19.4 kB
DialogContent -- 61.9 kB -- 19.5 kB
DialogContentText -- 63.7 kB -- 20.1 kB
DialogTitle -- 64 kB -- 20.1 kB
Divider -- 62.3 kB -- 19.6 kB
docs.landing -- 50.7 kB -- 13.4 kB
Drawer -- 84.2 kB -- 25.7 kB
ExpansionPanel -- 71.1 kB -- 22.3 kB
ExpansionPanelActions -- 61.8 kB -- 19.4 kB
ExpansionPanelDetails -- 61.6 kB -- 19.4 kB
ExpansionPanelSummary -- 77.8 kB -- 24.6 kB
Fab -- 76.5 kB -- 23.9 kB
Fade -- 23.2 kB -- 7.98 kB
FilledInput -- 73.2 kB -- 22.8 kB
FormControl -- 64.1 kB -- 20 kB
FormControlLabel -- 65.2 kB -- 20.5 kB
FormGroup -- 61.7 kB -- 19.4 kB
FormHelperText -- 63 kB -- 19.8 kB
FormLabel -- 63.2 kB -- 19.6 kB
Grid -- 64.8 kB -- 20.4 kB
GridList -- 62.2 kB -- 19.6 kB
GridListTile -- 63.4 kB -- 19.9 kB
GridListTileBar -- 62.9 kB -- 19.8 kB
Grow -- 23.8 kB -- 8.19 kB
Hidden -- 65.6 kB -- 20.7 kB
Icon -- 62.5 kB -- 19.6 kB
IconButton -- 75.8 kB -- 23.7 kB
Input -- 72.2 kB -- 22.6 kB
InputAdornment -- 64.8 kB -- 20.4 kB
InputBase -- 70.3 kB -- 22.1 kB
InputLabel -- 65 kB -- 20.1 kB
LinearProgress -- 65 kB -- 20.4 kB
Link -- 66.3 kB -- 21 kB
List -- 62 kB -- 19.4 kB
ListItem -- 76.8 kB -- 24.1 kB
ListItemAvatar -- 61.8 kB -- 19.4 kB
ListItemIcon -- 61.9 kB -- 19.4 kB
ListItemSecondaryAction -- 61.7 kB -- 19.4 kB
ListItemText -- 64.6 kB -- 20.4 kB
ListSubheader -- 62.4 kB -- 19.7 kB
Menu -- 88.1 kB -- 27.2 kB
MenuItem -- 77.8 kB -- 24.4 kB
MenuList -- 65.7 kB -- 20.6 kB
MobileStepper -- 67.5 kB -- 21.2 kB
Modal -- 14.3 kB -- 5.01 kB
NoSsr -- 2.19 kB -- 1.04 kB
OutlinedInput -- 73.7 kB -- 23 kB
Paper -- 62 kB -- 19.4 kB
Popover -- 82.5 kB -- 25.6 kB
Popper -- 28.7 kB -- 10.3 kB
Portal -- 2.9 kB -- 1.3 kB
RadioGroup -- 63.1 kB -- 19.8 kB
RootRef -- 4.21 kB -- 1.64 kB
Skeleton -- 62.6 kB -- 19.9 kB
Slide -- 25.3 kB -- 8.71 kB
Slider -- 75.2 kB -- 23.9 kB
Snackbar -- 74.8 kB -- 23.4 kB
SnackbarContent -- 63.2 kB -- 20 kB
SpeedDial -- 85.7 kB -- 27.1 kB
SpeedDialAction -- 117 kB -- 37 kB
Step -- 62.3 kB -- 19.6 kB
StepConnector -- 62.4 kB -- 19.7 kB
StepContent -- 68.7 kB -- 21.6 kB
Stepper -- 64.6 kB -- 20.4 kB
styles/createMuiTheme -- 16.4 kB -- 5.83 kB
SwipeableDrawer -- 91.6 kB -- 28.7 kB
Switch -- 80.8 kB -- 25.5 kB
Tab -- 76 kB -- 24.1 kB
Table -- 62.2 kB -- 19.6 kB
TableBody -- 61.8 kB -- 19.4 kB
TableCell -- 63.7 kB -- 20.1 kB
TableContainer -- 61.7 kB -- 19.4 kB
TableFooter -- 61.8 kB -- 19.4 kB
TableHead -- 61.8 kB -- 19.4 kB
TableRow -- 62.2 kB -- 19.6 kB
TextareaAutosize -- 5.09 kB -- 2.14 kB
ToggleButton -- 75.8 kB -- 24.1 kB
ToggleButtonGroup -- 62.9 kB -- 19.8 kB
Toolbar -- 62 kB -- 19.6 kB
Tooltip -- 101 kB -- 31.9 kB
TreeItem -- 73.4 kB -- 23.3 kB
TreeView -- 66.1 kB -- 20.8 kB
Typography -- 63.3 kB -- 19.9 kB
useMediaQuery -- 2.5 kB -- 1.06 kB
Zoom -- 23.3 kB -- 8.1 kB

Generated by 🚫 dangerJS against d960cb9

Copy link
Member

@eps1lon eps1lon left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please move everything affecting published (to npm) code to a separate PR for a proper entry in version control (revertability, changelog etc). Particularly the Snackbar change.

@oliviertassinari
Copy link
Member Author

oliviertassinari commented Dec 29, 2019

@eps1lon I have updated the Snackbar accessibility visibility guidelines to be more accurate. Thanks for the feedback

I'm sorry, I'm not sure to follow. The changes are aimed to be low impact/risk. Revertability and changelog should be "dimensions" we can ignore. Do you see any significant changes that we should worry about? What's the concern with the snackbar?

@@ -86,27 +86,20 @@ It also enables you to **stack** them on top of one another (although this is di

(WAI-ARIA: https://www.w3.org/TR/wai-aria-1.1/#alert)

- Since alerts are not required to receive focus, content authors should not require users to close a Snackbar if the role is set to `alert` through the SnackbarContent `role` prop. This is the default role.
- If a Snackbar requires focus to close it, then content authors should use the `role` of `alertdialog`.
- By default, the toast won't auto-hide. However, if you decide to use the `autoHideDuration` prop, it's recommended giving users [enough time](https://www.w3.org/TR/UNDERSTANDING-WCAG20/time-limits.html).
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
- By default, the toast won't auto-hide. However, if you decide to use the `autoHideDuration` prop, it's recommended giving users [enough time](https://www.w3.org/TR/UNDERSTANDING-WCAG20/time-limits.html).
- By default, the Snackbar won't auto-hide. However, if you decide to use the `autoHideDuration` prop, it's recommended giving users [enough time](https://www.w3.org/TR/UNDERSTANDING-WCAG20/time-limits.html).

(A toast is an Android system notification)

Copy link
Member Author

@oliviertassinari oliviertassinari Dec 30, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I believe a toast is the generic name for the snackbar (ignoring Material Design language). You can verify this proposition by benchmarking the other design systems.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

http://programmerguru.com/android-tutorial/snackbar-vs-toast/
https://stackoverflow.com/questions/34432339/android-snackbar-vs-toast-usage-and-difference

For your SEO kick, you could add sometimes (mistakenly 😉) referred to as a "toast" to the description. But best not to cause confusing by using a different name in the body text.

@oliviertassinari
Copy link
Member Author

oliviertassinari commented Dec 30, 2019

I have reverted the snackbar's changes and I'm moving them to a dedicated pull request because they seem to raise an ongoing flow of concerns.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
umbrella For grouping multiple issues to provide a holistic view
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants