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

[Autocomplete] Warn when mixing controlled/uncontrolled inputValue states #20403

Merged
merged 6 commits into from
Apr 4, 2020
Merged

[Autocomplete] Warn when mixing controlled/uncontrolled inputValue states #20403

merged 6 commits into from
Apr 4, 2020

Conversation

vileppanen
Copy link
Contributor

@vileppanen vileppanen commented Apr 4, 2020

In freeSolo mode, useAutocomplete hook assumes, that a string value is passed in inputValue property. If an undefined value is passed for whatever reason, the client will crash due to length checks against the undefined value.

Thought that more desirable approach would be to just set the input value as empty string, instead of crashing. In this case, the blame is inherently in the client which is rendering the Autocomplete and misunderstanding the signature of the onChange function. However, it also seems fragile that the useAutocomplete hook assumes the rendering components to pass in "non-null/defined" values.

Steps to reproduce:

  1. Pass freeSolo prop to Autocomplete
  2. Pass inputValue prop to Autocomplete with value handled in parent component
  3. Pass onChange prop to Autocomplete with function that will change the inputValue to be undefined
  4. When rendered, focus the Autocomplete field, and press enter
  5. The app will crash with error "Cannot read property 'length' of undefined"

Here's sandbox for the previous example:
https://codesandbox.io/s/autocompleteselectnpe-5mc47

Also, seems that this issue is loosely related to the same thing: for not being prepared to undefined values?
#20152


Closes #19423

Edit by @oliviertassinari

Ville Leppänen added 2 commits April 4, 2020 11:40
useAutocomplete hook assumes, that string value is passed in inputValue property. If an undefined value is passed for whatever case, the client will crash due to length checks against the undefined value
@mui-pr-bot
Copy link

mui-pr-bot commented Apr 4, 2020

Details of bundle changes.

Comparing: 861498c...7242344

Details of page changes
bundle Size Change Size Gzip Change Gzip
/components/chips ▲ +100 B (+0.47% ) 21.5 kB -- -1 B
/components/grid ▲ +100 B (+0.30% ) 33.9 kB -- -1 B
/customization/components ▲ +100 B (+0.27% ) 37.5 kB -- -1 B
/components/pagination ▲ +10 B (+0.12% ) 8.08 kB -- -1 B
/components/transfer-list ▲ +10 B (+0.11% ) 9.21 kB -- -1 B
/customization/default-theme ▲ +10 B (+0.12% ) 8.55 kB -- -1 B
/getting-started/templates/sign-in-side ▲ +10 B (+0.11% ) 9.24 kB -- -1 B
/getting-started/templates/sign-in ▲ +10 B (+0.11% ) 9.48 kB -- -1 B
/getting-started/templates/sign-up ▲ +10 B (+0.10% ) 9.59 kB -- -1 B
/_app -- 33.6 kB -- -1 B
/api-docs/alert-title -- 1.14 kB -- -1 B
/api-docs/alert -- 2.15 kB -- -1 B
/api-docs/app-bar -- 1.69 kB -- -1 B
/api-docs/autocomplete -- 4.05 kB -- -1 B
/api-docs/avatar-group -- 1.26 kB -- -1 B
/api-docs/avatar -- 1.61 kB -- -1 B
/api-docs/backdrop -- 1.38 kB -- -1 B
/api-docs/badge -- 1.88 kB -- -1 B
/api-docs/bottom-navigation-action -- 1.55 kB -- -1 B
/api-docs/bottom-navigation -- 1.43 kB -- -1 B
/api-docs/breadcrumbs -- 1.59 kB -- -1 B
/api-docs/button-base -- 2.08 kB -- -1 B
/api-docs/button-group -- 1.95 kB -- -1 B
/api-docs/button -- 2.32 kB -- -1 B
/api-docs/card-action-area -- 1.32 kB -- -1 B
/api-docs/card-actions -- 1.22 kB -- -1 B
/api-docs/card-content -- 1.2 kB -- -1 B
/api-docs/card-header -- 1.53 kB -- -1 B
/api-docs/card-media -- 1.43 kB -- -1 B
/api-docs/card -- 1.25 kB -- -1 B
/api-docs/checkbox -- 2.05 kB -- -1 B
/api-docs/chip -- 2.19 kB -- -1 B
/api-docs/circular-progress -- 1.8 kB -- -1 B
/api-docs/click-away-listener -- 1.13 kB -- -1 B
/api-docs/collapse -- 1.76 kB -- -1 B
/api-docs/container -- 1.62 kB -- -1 B
/api-docs/css-baseline -- 1.14 kB -- -1 B
/api-docs/dialog-actions -- 1.22 kB -- -1 B
/api-docs/dialog-content-text -- 1.23 kB -- -1 B
/api-docs/dialog-content -- 1.2 kB -- -1 B
/api-docs/dialog-title -- 1.25 kB -- -1 B
/api-docs/dialog -- 2.48 kB -- -1 B
/api-docs/divider -- 1.55 kB -- -1 B
/api-docs/drawer -- 1.87 kB -- -1 B
/api-docs/expansion-panel-actions -- 1.23 kB -- -1 B
/api-docs/expansion-panel-details -- 1.16 kB -- -1 B
/api-docs/expansion-panel-summary -- 1.46 kB -- -1 B
/api-docs/expansion-panel -- 1.7 kB -- -1 B
/api-docs/fab -- 1.86 kB -- -1 B
/api-docs/fade -- 1.17 kB -- -1 B
/api-docs/filled-input -- 2.65 kB -- -1 B
/api-docs/form-control-label -- 1.73 kB -- -1 B
/api-docs/form-control -- 2.12 kB -- -1 B
/api-docs/form-group -- 1.3 kB -- -1 B
/api-docs/form-helper-text -- 1.66 kB -- -1 B
/api-docs/form-label -- 1.59 kB -- -1 B
/api-docs/grid-list-tile-bar -- 1.54 kB -- -1 B
/api-docs/grid-list-tile -- 1.46 kB -- -1 B
/api-docs/grid-list -- 1.37 kB -- -1 B
/api-docs/grid -- 2.29 kB -- -1 B
/api-docs/grow -- 1.23 kB -- -1 B
/api-docs/hidden -- 1.32 kB -- -1 B
/api-docs/icon-button -- 1.85 kB -- -1 B
/api-docs/icon -- 1.54 kB -- -1 B
/api-docs/input-adornment -- 1.68 kB -- -1 B
/api-docs/input-base -- 2.74 kB -- -1 B
/api-docs/input-label -- 1.82 kB -- -1 B
/api-docs/input -- 2.61 kB -- -1 B
/api-docs/linear-progress -- 1.78 kB -- -1 B
/api-docs/link -- 1.68 kB -- -1 B
/api-docs/list-item-avatar -- 1.25 kB -- -1 B
/api-docs/list-item-icon -- 1.27 kB -- -1 B
/api-docs/list-item-secondary-action -- 1.22 kB -- -1 B
/api-docs/list-item-text -- 1.54 kB -- -1 B
/api-docs/list-item -- 2 kB -- -1 B
/api-docs/list-subheader -- 1.51 kB -- -1 B
/api-docs/list -- 1.44 kB -- -1 B
/api-docs/menu-item -- 1.48 kB -- -1 B
/api-docs/menu-list -- 1.36 kB -- -1 B
/api-docs/menu -- 2.13 kB -- -1 B
/api-docs/mobile-stepper -- 1.67 kB -- -1 B
/api-docs/modal -- 2.14 kB -- -1 B
/api-docs/native-select -- 1.83 kB -- -1 B
/api-docs/no-ssr -- 1.09 kB -- -1 B
/api-docs/outlined-input -- 2.76 kB -- -1 B
/api-docs/pagination-item -- 1.71 kB -- -1 B
/api-docs/pagination -- 1.98 kB -- -1 B
/api-docs/paper -- 1.61 kB -- -1 B
/api-docs/popover -- 2.5 kB -- -1 B
/api-docs/popper -- 1.76 kB -- -1 B
/api-docs/portal -- 1.12 kB -- -1 B
/api-docs/radio-group -- 1.23 kB -- -1 B
/api-docs/radio -- 1.87 kB -- -1 B
/api-docs/rating -- 2.25 kB -- -1 B
/api-docs/root-ref -- 1.2 kB -- -1 B
/api-docs/scoped-css-baseline -- 1.15 kB -- -1 B
/api-docs/select -- 2.65 kB -- -1 B
/api-docs/skeleton -- 1.52 kB -- -1 B
/api-docs/slide -- 1.31 kB -- -1 B
/api-docs/slider -- 2.85 kB -- -1 B
/api-docs/snackbar-content -- 1.36 kB -- -1 B
/api-docs/snackbar -- 2.46 kB -- -1 B
/api-docs/speed-dial-action -- 1.67 kB -- -1 B
/api-docs/speed-dial-icon -- 1.29 kB -- -1 B
/api-docs/speed-dial -- 2.05 kB -- -1 B
/api-docs/step-button -- 1.38 kB -- -1 B
/api-docs/step-connector -- 1.29 kB -- -1 B
/api-docs/step-content -- 1.47 kB -- -1 B
/api-docs/step-icon -- 1.33 kB -- -1 B
/api-docs/step-label -- 1.64 kB -- -1 B
/api-docs/step -- 1.38 kB -- -1 B
/api-docs/stepper -- 1.6 kB -- -1 B
/api-docs/svg-icon -- 2.01 kB -- -1 B
/api-docs/swipeable-drawer -- 1.78 kB -- -1 B
/api-docs/switch -- 2.22 kB -- -1 B
/api-docs/tab -- 1.74 kB -- -1 B
/api-docs/table-body -- 1.21 kB -- -1 B
/api-docs/table-cell -- 1.87 kB -- -1 B
/api-docs/table-container -- 1.22 kB -- -1 B
/api-docs/table-footer -- 1.22 kB -- -1 B
/api-docs/table-head -- 1.21 kB -- -1 B
/api-docs/table-pagination -- 2.21 kB -- -1 B
/api-docs/table-row -- 1.43 kB -- -1 B
/api-docs/table-sort-label -- 1.57 kB -- -1 B
/api-docs/table -- 1.43 kB -- -1 B
/api-docs/tabs -- 2.28 kB -- -1 B
/api-docs/text-field -- 2.94 kB -- -1 B
/api-docs/textarea-autosize -- 908 B -- -1 B
/api-docs/toggle-button-group -- 1.56 kB -- -1 B
/api-docs/toggle-button -- 1.55 kB -- -1 B
/api-docs/toolbar -- 1.4 kB -- -1 B
/api-docs/tooltip -- 2.3 kB -- -1 B
/api-docs/tree-item -- 1.53 kB -- -1 B
/api-docs/tree-view -- 1.67 kB -- -1 B
/api-docs/typography -- 2.33 kB -- -1 B
/api-docs/zoom -- 1.2 kB -- -1 B
/blog/2019-developer-survey-results -- 5.98 kB -- -1 B
/blog/2019 -- 3.87 kB -- -1 B
/blog/2020-introducing-sketch -- 3.1 kB -- -1 B
/blog/april-2019-update -- 2.76 kB -- -1 B
/blog/august-2019-update -- 1.87 kB -- -1 B
/blog/december-2019-update -- 2.01 kB -- -1 B
/blog/july-2019-update -- 1.77 kB -- -1 B
/blog/june-2019-update -- 1.63 kB -- -1 B
/blog/march-2019-update -- 2.17 kB -- -1 B
/blog/material-ui-v1-is-out -- 6.29 kB -- -1 B
/blog/material-ui-v4-is-out -- 9.32 kB -- -1 B
/blog/may-2019-update -- 1.96 kB -- -1 B
/blog/november-2019-update -- 2.37 kB -- -1 B
/blog/october-2019-update -- 2.12 kB -- -1 B
/blog/september-2019-update -- 2.3 kB -- -1 B
/company/about -- 1.56 kB -- -1 B
/company/contact -- 1.14 kB -- -1 B
/company/jobs -- 1.16 kB -- -1 B
/components/about-the-lab -- 5.55 kB -- -1 B
/components/alert -- 12.4 kB -- -1 B
/components/app-bar -- 30.8 kB -- -1 B
/components/autocomplete -- 104 kB -- -1 B
/components/avatars -- 8.43 kB -- -1 B
/components/backdrop -- 3.19 kB -- -1 B
/components/badges -- 15 kB -- -1 B
/components/bottom-navigation -- 6.21 kB -- -1 B
/components/box -- 7.96 kB -- -1 B
/components/breadcrumbs -- 14.3 kB -- -1 B
/components/button-group -- 6.64 kB -- -1 B
/components/buttons -- 24.3 kB -- -1 B
/components/cards -- 16.8 kB -- -1 B
/components/checkboxes -- 16.5 kB -- -1 B
/components/click-away-listener -- 3.38 kB -- -1 B
/components/container -- 3.83 kB -- -1 B
/components/css-baseline -- 5.96 kB -- -1 B
/components/dialogs -- 42.1 kB -- -1 B
/components/dividers -- 12.2 kB -- -1 B
/components/drawers -- 29.4 kB -- -1 B
/components/expansion-panels -- 20 kB -- -1 B
/components/floating-action-button -- 10.3 kB -- -1 B
/components/grid-list -- 11.8 kB -- -1 B
/components/hidden -- 10.5 kB -- -1 B
/components/icons -- 24.4 kB -- -1 B
/components/links -- 6.82 kB -- -1 B
/components/lists -- 26 kB -- -1 B
/components/material-icons -- 728 kB -- -1 B
/components/menus -- 23.2 kB -- -1 B
/components/modal -- 11.5 kB -- -1 B
/components/no-ssr -- 5.02 kB -- -1 B
/components/paper -- 3.33 kB -- -1 B
/components/pickers -- 38.2 kB -- -1 B
/components/popover -- 16.9 kB -- -1 B
/components/popper -- 22.5 kB -- -1 B
/components/portal -- 3.29 kB -- -1 B
/components/progress -- 21.7 kB -- -1 B
/components/radio-buttons -- 15.2 kB -- -1 B
/components/rating -- 11.1 kB -- -1 B
/components/selects -- 28.9 kB -- -1 B
/components/skeleton -- 10.1 kB -- -1 B
/components/slider -- 14.6 kB -- -1 B
/components/snackbars -- 24.8 kB -- -1 B
/components/speed-dial -- 14.4 kB -- -1 B
/components/steppers -- 36.1 kB -- -1 B
/components/switches -- 16 kB -- -1 B
/components/tables -- 174 kB -- -1 B
/components/tabs -- 19.2 kB -- -1 B
/components/text-fields -- 54.7 kB -- -1 B
/components/textarea-autosize -- 2.81 kB -- -1 B
/components/toggle-button -- 10.5 kB -- -1 B
/components/tooltips -- 17.3 kB -- -1 B
/components/transitions -- 10.8 kB -- -1 B
/components/tree-view -- 11.2 kB -- -1 B
/components/typography -- 9.7 kB -- -1 B
/components/use-media-query -- 13.1 kB -- -1 B
/customization/breakpoints -- 15.7 kB -- -1 B
/customization/color -- 21.5 kB -- -1 B
/customization/density -- 9.13 kB -- -1 B
/customization/globals -- 4.65 kB -- -1 B
/customization/palette -- 11.9 kB -- -1 B
/customization/spacing -- 2.49 kB -- -1 B
/customization/theming -- 17 kB -- -1 B
/customization/typography -- 11.6 kB -- -1 B
/customization/z-index -- 3.05 kB -- -1 B
/discover-more/backers -- 2.88 kB -- -1 B
/discover-more/changelog -- 1.37 kB -- -1 B
/discover-more/languages -- 3.32 kB -- -1 B
/discover-more/related-projects -- 7.06 kB -- -1 B
/discover-more/roadmap -- 3.67 kB -- -1 B
/discover-more/showcase -- 13.5 kB -- -1 B
/discover-more/team -- 6.51 kB -- -1 B
/discover-more/vision -- 7.03 kB -- -1 B
/getting-started/example-projects -- 6.12 kB -- -1 B
/getting-started/faq -- 31.8 kB -- -1 B
/getting-started/installation -- 7.6 kB -- -1 B
/getting-started/learn -- 8.39 kB -- -1 B
/getting-started/support -- 7.85 kB -- -1 B
/getting-started/supported-components -- 6.19 kB -- -1 B
/getting-started/supported-platforms -- 5.69 kB -- -1 B
/getting-started/templates -- 8.35 kB -- -1 B
/getting-started/templates/album -- 5.57 kB -- -1 B
/getting-started/templates/blog -- 7.43 kB -- -1 B
/getting-started/templates/checkout -- 11.2 kB -- -1 B
/getting-started/templates/dashboard -- 8.47 kB -- -1 B
/getting-started/templates/pricing -- 7.79 kB -- -1 B
/getting-started/templates/sticky-footer -- 1.54 kB -- -1 B
/getting-started/usage -- 9.37 kB -- -1 B
/guides/api -- 17.4 kB -- -1 B
/guides/composition -- 14 kB -- -1 B
/guides/flow -- 2.21 kB -- -1 B
/guides/interoperability -- 14.9 kB -- -1 B
/guides/localization -- 19.8 kB -- -1 B
/guides/migration-v0x -- 7.25 kB -- -1 B
/guides/migration-v3 -- 22.3 kB -- -1 B
/guides/minimizing-bundle-size -- 6.73 kB -- -1 B
/guides/responsive-ui -- 4.18 kB -- -1 B
/guides/right-to-left -- 6.69 kB -- -1 B
/guides/server-rendering -- 8.38 kB -- -1 B
/guides/testing -- 8.33 kB -- -1 B
/guides/typescript -- 13.4 kB -- -1 B
/performance/table-component -- 1.44 kB -- -1 B
/performance/table-emotion -- 2.96 kB -- -1 B
/performance/table-hook -- 2.23 kB -- -1 B
/performance/table-mui -- 4.42 kB -- -1 B
/performance/table-raw -- 613 B -- -1 B
/performance/table-styled-components -- 2.61 kB -- -1 B
/premium-themes/onepirate -- 7.11 kB -- -1 B
/premium-themes/onepirate/forgot-password -- 1.01 kB -- -1 B
/premium-themes/onepirate/privacy -- 4.43 kB -- -1 B
/premium-themes/onepirate/sign-in -- 1.07 kB -- -1 B
/premium-themes/onepirate/sign-up -- 1.12 kB -- -1 B
/premium-themes/onepirate/terms -- 11.8 kB -- -1 B
/premium-themes/paperbase -- 8.71 kB -- -1 B
/styles/advanced -- 30.3 kB -- -1 B
/styles/api -- 16 kB -- -1 B
/styles/basics -- 17.6 kB -- -1 B
/system/api -- 5.85 kB -- -1 B
/system/basics -- 25.1 kB -- -1 B
/system/borders -- 4.04 kB -- -1 B
/system/display -- 6.51 kB -- -1 B
/system/flexbox -- 5.72 kB -- -1 B
/system/palette -- 4.28 kB -- -1 B
/system/positions -- 2.46 kB -- -1 B
/system/shadows -- 3.44 kB -- -1 B
/system/sizing -- 3.44 kB -- -1 B
/system/spacing -- 5.97 kB -- -1 B
/system/typography -- 4.22 kB -- -1 B
/versions -- 23.1 kB -- -1 B
docs:chunk:shared -- 68.1 kB -- -1 B
docs:shared:chunk/commons -- 5.99 kB -- -1 B
docs:shared:chunk/framework -- 42.3 kB -- -1 B
docs:shared:runtime/main -- 6.78 kB -- -1 B
docs:shared:runtime/webpack -- 1.24 kB -- -1 B
bundle Size Change Size Gzip Change Gzip
@material-ui/lab ▲ +99 B (+0.05% ) 203 kB ▲ +32 B (+0.05% ) 60.5 kB
@material-ui/core[umd] ▲ +54 B (+0.02% ) 321 kB ▲ +27 B (+0.03% ) 93.1 kB
@material-ui/core ▲ +54 B (+0.01% ) 364 kB ▲ +21 B (+0.02% ) 100 kB
TreeView ▲ +42 B (+0.06% ) 73 kB ▲ +17 B (+0.07% ) 23 kB
Autocomplete ▲ +39 B (+0.03% ) 136 kB ▲ +22 B (+0.05% ) 42.9 kB
useAutocomplete ▲ +39 B (+0.25% ) 16 kB ▲ +10 B (+0.18% ) 5.71 kB
ExpansionPanel ▲ +25 B (+0.03% ) 76.2 kB ▲ +11 B (+0.05% ) 24.1 kB
Radio ▲ +24 B (+0.03% ) 87.8 kB ▲ +16 B (+0.06% ) 27.8 kB
Switch ▲ +24 B (+0.03% ) 85.9 kB ▲ +13 B (+0.05% ) 27.1 kB
Checkbox ▲ +24 B (+0.03% ) 86.7 kB ▲ +11 B (+0.04% ) 27.5 kB
SpeedDialAction ▲ +21 B (+0.02% ) 122 kB ▲ +11 B (+0.03% ) 39 kB
Tooltip ▲ +21 B (+0.02% ) 106 kB ▲ +10 B (+0.03% ) 33.6 kB
Pagination ▲ +21 B (+0.02% ) 89 kB ▲ +5 B (+0.02% ) 27.5 kB
Slider ▲ +8 B (+0.01% ) 80.5 kB ▲ +4 B (+0.02% ) 25.7 kB
TablePagination ▲ +8 B (+0.01% ) 147 kB ▼ -3 B (-0.01% ) 43.3 kB
TextField ▲ +8 B (+0.01% ) 129 kB ▼ -3 B (-0.01% ) 37.9 kB
RadioGroup ▲ +8 B (+0.01% ) 68.4 kB ▲ +2 B (+0.01% ) 21.3 kB
Select ▲ +8 B (+0.01% ) 120 kB ▲ +1 B (0.00% ) 35.9 kB
ButtonBase -- 78.6 kB ▼ -3 B (-0.01% ) 24.7 kB
FormHelperText -- 68 kB ▲ +3 B (+0.01% ) 21.2 kB
FormLabel -- 68.1 kB ▲ +3 B (+0.01% ) 21.2 kB
InputLabel -- 69.9 kB ▲ +3 B (+0.01% ) 21.6 kB
Button -- 84.3 kB ▲ +1 B (0.00% ) 25.9 kB
CardActionArea -- 79.7 kB ▲ +1 B (0.00% ) 25.3 kB
Chip -- 87.2 kB ▲ +1 B (0.00% ) 26.8 kB
ExpansionPanelSummary -- 82.7 kB ▲ +1 B (0.00% ) 26.3 kB
Fab -- 81.4 kB ▲ +1 B (0.00% ) 25.4 kB
FormControlLabel -- 70.1 kB ▼ -1 B (-0.00% ) 22.1 kB
IconButton -- 80.7 kB ▼ -1 B (-0.00% ) 25.2 kB
MenuItem -- 82.7 kB ▲ +1 B (0.00% ) 25.9 kB
NativeSelect -- 81.5 kB ▼ -1 B (-0.00% ) 25.9 kB
PaginationItem -- 85.4 kB ▼ -1 B (-0.00% ) 26.4 kB
SpeedDial -- 90.8 kB ▲ +1 B (0.00% ) 28.8 kB
StepButton -- 86.9 kB ▼ -1 B (-0.00% ) 27.5 kB
Tab -- 80.9 kB ▲ +1 B (0.00% ) 25.8 kB
@material-ui/styles -- 52 kB -- 15.6 kB
@material-ui/system -- 17.2 kB -- 4.52 kB
Alert -- 87.9 kB -- 27.9 kB
AlertTitle -- 68.8 kB -- 21.7 kB
AppBar -- 68.7 kB -- 21.6 kB
Avatar -- 69.8 kB -- 21.9 kB
AvatarGroup -- 70.8 kB -- 22.5 kB
Backdrop -- 72.5 kB -- 22.4 kB
Badge -- 70 kB -- 21.8 kB
BottomNavigation -- 67.1 kB -- 21.1 kB
BottomNavigationAction -- 80.1 kB -- 25.4 kB
Box -- 73.6 kB -- 22.4 kB
Breadcrumbs -- 85 kB -- 27 kB
ButtonGroup -- 87.8 kB -- 27.2 kB
Card -- 67.5 kB -- 21.2 kB
CardActions -- 66.7 kB -- 20.9 kB
CardContent -- 66.6 kB -- 20.9 kB
CardHeader -- 69.7 kB -- 22 kB
CardMedia -- 67 kB -- 21.1 kB
CircularProgress -- 68.8 kB -- 21.7 kB
ClickAwayListener -- 3.84 kB -- 1.54 kB
Collapse -- 72.7 kB -- 22.5 kB
colorManipulator -- 3.88 kB -- 1.52 kB
Container -- 67.8 kB -- 21.2 kB
CssBaseline -- 66.6 kB -- 21 kB
Dialog -- 87.5 kB -- 27.4 kB
DialogActions -- 66.8 kB -- 20.9 kB
DialogContent -- 66.9 kB -- 21 kB
DialogContentText -- 68.7 kB -- 21.6 kB
DialogTitle -- 68.9 kB -- 21.7 kB
Divider -- 67.3 kB -- 21.2 kB
docs:/ -- 10.7 kB -- -1 B
docs:/_app -- 33.6 kB -- -1 B
Drawer -- 89.2 kB -- 27.2 kB
ExpansionPanelActions -- 66.7 kB -- 20.9 kB
ExpansionPanelDetails -- 66.6 kB -- 20.9 kB
Fade -- 28.4 kB -- 9.47 kB
FilledInput -- 78.2 kB -- 24.4 kB
FormControl -- 69 kB -- 21.5 kB
FormGroup -- 66.7 kB -- 20.8 kB
Grid -- 69.8 kB -- 21.9 kB
GridList -- 67.1 kB -- 21.1 kB
GridListTile -- 68.4 kB -- 21.5 kB
GridListTileBar -- 67.9 kB -- 21.3 kB
Grow -- 29 kB -- 9.68 kB
Hidden -- 70.6 kB -- 22.3 kB
Icon -- 67.5 kB -- 21.2 kB
Input -- 77.2 kB -- 24.2 kB
InputAdornment -- 69.7 kB -- 22 kB
InputBase -- 75.3 kB -- 23.7 kB
LinearProgress -- 70 kB -- 21.7 kB
Link -- 71.2 kB -- 22.6 kB
List -- 67 kB -- 20.9 kB
ListItem -- 81.6 kB -- 25.6 kB
ListItemAvatar -- 66.8 kB -- 20.9 kB
ListItemIcon -- 66.8 kB -- 21 kB
ListItemSecondaryAction -- 66.7 kB -- 20.9 kB
ListItemText -- 69.6 kB -- 22 kB
ListSubheader -- 67.4 kB -- 21.2 kB
Menu -- 93.2 kB -- 28.8 kB
MenuList -- 70.7 kB -- 22.1 kB
MobileStepper -- 72.5 kB -- 22.8 kB
Modal -- 14.9 kB -- 5.22 kB
NoSsr -- 2.18 kB -- 1.03 kB
OutlinedInput -- 79.2 kB -- 24.7 kB
Paper -- 67 kB -- 20.9 kB
Popover -- 87.6 kB -- 27.2 kB
Popper -- 28.8 kB -- 10.3 kB
Portal -- 2.87 kB -- 1.29 kB
Rating -- 75.1 kB -- 24.2 kB
RootRef -- 4.62 kB -- 1.76 kB
ScopedCssBaseline -- 67.5 kB -- 21.2 kB
Skeleton -- 67.7 kB -- 21.4 kB
Slide -- 30.4 kB -- 10.1 kB
Snackbar -- 79.9 kB -- 25.1 kB
SnackbarContent -- 68.2 kB -- 21.3 kB
SpeedDialIcon -- 69.2 kB -- 21.8 kB
Step -- 67.3 kB -- 21.2 kB
StepConnector -- 67.4 kB -- 21.3 kB
StepContent -- 73.8 kB -- 23.1 kB
StepIcon -- 69.2 kB -- 21.6 kB
StepLabel -- 73.2 kB -- 22.7 kB
Stepper -- 69.5 kB -- 22 kB
styles/createMuiTheme -- 22.2 kB -- 7.69 kB
SvgIcon -- 67.7 kB -- 21.2 kB
SwipeableDrawer -- 96.6 kB -- 30.4 kB
Table -- 67.2 kB -- 21.1 kB
TableBody -- 66.8 kB -- 20.9 kB
TableCell -- 68.7 kB -- 21.7 kB
TableContainer -- 66.6 kB -- 20.9 kB
TableFooter -- 66.8 kB -- 20.9 kB
TableHead -- 66.8 kB -- 20.9 kB
TableRow -- 67.1 kB -- 21.1 kB
TableSortLabel -- 82 kB -- 26 kB
Tabs -- 89.9 kB -- 28.8 kB
TextareaAutosize -- 5.19 kB -- 2.17 kB
ToggleButton -- 80.7 kB -- 25.7 kB
ToggleButtonGroup -- 67.9 kB -- 21.4 kB
Toolbar -- 67 kB -- 21.1 kB
TreeItem -- 79.8 kB -- 25.4 kB
Typography -- 68.3 kB -- 21.4 kB
useMediaQuery -- 2.56 kB -- 1.06 kB
Zoom -- 28.4 kB -- 9.59 kB

Generated by 🚫 dangerJS against 7242344

@hexetia
Copy link
Contributor

hexetia commented Apr 4, 2020

maybe is better to not crash and throw a big warning?

@vileppanen
Copy link
Contributor Author

Added a warning to be logged when inputValue is defaulted to empty string, would that do?

@oliviertassinari oliviertassinari added the component: autocomplete This is the name of the generic UI component, not the React module! label Apr 4, 2020
@oliviertassinari oliviertassinari changed the title [Autocomplete] fallback to empty string if input value undefined [Autocomplete] Warn when mixing controlled/uncontrolled inputValue states Apr 4, 2020
@oliviertassinari oliviertassinari added the new feature New feature or request label Apr 4, 2020
@oliviertassinari
Copy link
Member

@vileppanen Thanks for starting an effort in this direction. Do you have a reproduction of the issue you are facing?

In the meantime, I have pushed the pull request in the direction proposed in #19423. We have seen a non-neglieable number of developers that mix the purpose of the value and input value state (your pull request issue description seems to fall into the same trap, but not sure hence why I have asked for a live reproduction).

@vileppanen
Copy link
Contributor Author

vileppanen commented Apr 4, 2020

@vileppanen Thanks for starting an effort in this direction. Do you have a reproduction of the issue you are facing?

In the meantime, I have pushed the pull request in the direction proposed in #19423. We have seen a non-neglieable number of developers that mix the purpose of the value and input value state (your pull request issue description seems to fall into the same trap, but not sure hence why I have asked for a live reproduction).

I was almost sure, I had the reproduction ready here
https://codesandbox.io/s/autocompleteselectnpe-ex5pf :D...but it seems to be broken. I'll setup a working one

@oliviertassinari
Copy link
Member

oliviertassinari commented Apr 4, 2020

@vileppanen I meant a reproduction where the error originates from within the Autocomplete component.

@vileppanen
Copy link
Contributor Author

vileppanen commented Apr 4, 2020

@vileppanen I meant a reproduction where the error originates with-in the Autocomplete.

Ah yes, it seems to crash in this line https://github.com/mui-org/material-ui/blob/861498c05fc27d794b10803928b8164709772409/packages/material-ui-lab/src/useAutocomplete/useAutocomplete.js#L864 (although I'm not sure if that's the only place for causing troubles, as the inputValue is been referred to in other places too)

@oliviertassinari
Copy link
Member

@vileppanen Ok, thanks, it helps a bit. So, the component is originally controlled, then the prop switches to undefined. So it crashes as expected. The pull request introduces a warning to help developers understand the resolution.

@jagadeesh93
Copy link

I have the same issue I am using "@material-ui/lab": "^4.0.0-alpha.56", Is this issue resolved in this version @vileppanen

@vileppanen
Copy link
Contributor Author

I have the same issue I am using "@material-ui/lab": "^4.0.0-alpha.56", Is this issue resolved in this version @vileppanen

Don't recall much of this case, but as I remember, there wasn't an actual "resolution" per se involved, other than enhancing the documentation on how value / onChange and inputValue / onInputChange should be coupled.

Do you have some repro of your case to look at?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: autocomplete This is the name of the generic UI component, not the React module! new feature New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Autocomplete immediately changes initial inputValue state
5 participants