question-mark
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.

`useAutocomplete` return values wrong on several `getXProps` functions.

See original GitHub issue

Definition in question here: https://github.com/mui-org/material-ui/blob/e294394af1e5b2769ca22c5a084dc3b49933952a/packages/material-ui-lab/src/useAutocomplete/useAutocomplete.d.ts#L271-L278

I haven’t used all of these functions yet, but I know that the following are incorrect:

  • getInputLabelProps
  • getRootProps
  • getInputProps
  • getListboxProps
  • getOptionProps

In my current project I have them typed as the following:

type StringLikeBoolean = boolean | 'false' | 'true';
interface RootProps {
    'aria-owns': string;
    role: string;
    'aria-expanded': StringLikeBoolean
    onClick: () => void;
    onKeyDown: () => void;
    onMouseDown: () => void;
}

interface InputLabelProps {
    htmlFor: string;
    id: string;
}

interface InputProps {
    id: string;
    'aria-activedescendant': string;
    'aria-autocomplete': 'list';
    'aria-controls': string;
    autoCapitalize: 'none';
    autoComplete: 'off';
    onBlur: (event: React.FocusEvent<HTMLInputElement>) => void;
    onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
    onFocus: (event: React.FocusEvent<HTMLInputElement>) => void;    onMouseDown: () => void;
    ref: React.RefObject<HTMLInputElement>;
    spellCheck: StringLikeBoolean
    value: string;
}

interface OptionProps {
    'aria-disabled': StringLikeBoolean;
    'aria-selected': StringLikeBoolean;
    'data-option-index': number;
    id: string;
    key: number;
    onClick: () => void;
    onMouseOver: () => void;
    onTouchStart: () => void;
    role: 'option';
    tabIndex: number;
}

If these are accurate I would be more than happy to open a pull request.

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:1
  • Comments:12 (7 by maintainers)

github_iconTop GitHub Comments

1reaction
kentaro84207commented, Sep 26, 2020

Could I work on this? 😃

1reaction
tbremercommented, Aug 10, 2020

I think I will have time this week to work on this problem.

I also found something in the onChange handler that should be updated: https://github.com/mui-org/material-ui/blob/e294394af1e5b2769ca22c5a084dc3b49933952a/packages/material-ui-lab/src/useAutocomplete/useAutocomplete.d.ts#L242

I had to handle this as the generic HTMLElement type. Is it consistent what element this should be? For instance, my event fires on an li because of how I build my listbox.

Read more comments on GitHub >

github_iconTop Results From Across the Web

`useAutocomplete` return values wrong on several `getXProps ...
I haven't used all of these functions yet, but I know that the following are incorrect: getInputLabelProps; getRootProps; getInputProps ...
Read more >
material ui - Autocomplete multiple error - Stack Overflow
js. When using multiple in Autocomplete it gives me the error, Uncaught TypeError: (intermediate value)(intermediate value)(intermediate value).
Read more >
Demystifying Errors in MUI Autocomplete — part - Medium
One thing about getOptionLabel is it doesn't change the input value. It only alters the label which we see in the list.
Read more >
Named return values in Go - Exploring Software
It says that the function will return an int and an error; Declares two variables - i of type int and e of...
Read more >
The Python return Statement: Usage and Best Practices
In this tutorial, you'll learn: How to use the Python return statement in your functions; How to return single or multiple values from...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found