IntelliJ/WebStorm IDE props auto-completion broken in 4.0.0 alpha

[ssypi]

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

Expected Behavior 🤔

In IntelliJ/Webstorm IDE, when importing component and using it in JSX, prop auto-completion/suggestions and validating should work as it did in previous version 3.9.x.

Current Behavior 😯

No props are suggested or validated.

Steps to Reproduce 🕹

1. import any component from core/component
2. use it in jsx
3. try to have IDE suggest props

Context 🔦

If I downgrade material-ui/core back to 3.9 version, everything works, but not on 4.0.0-alpha.0.

Your Environment 🌎

Tech	Version
Material-UI	v4.0.0-alpha.0
IDE	IntelliJ IDEA 2019.1 EAP

Solution?/Thoughts`

I noticed that if I add "typings": "./index.d.ts", line to for example core\Button\package.json, it works again just like before.

Another thing is that if I try to navigate to the source of the imported components, IDE navigates to the source in the core/esm/Component folder instead of core/Component even though I imported from core/Component. Possibly because of "module": "../esm/Chip/index.js", in the Component's package.json. But this is also fixed with the above typings addition.

(Possibly related to issue #14392 )

[eps1lon]

Another thing is that if I try to navigate to the source of the imported components, IDE navigates to the source in the core/esm/Component

Does it still do that with the added typings field?

[ssypi]

Another thing is that if I try to navigate to the source of the imported components, IDE navigates to the source in the core/esm/Component

Does it still do that with the added typings field?

No, it will navigate to the core/component/index.d.ts where I think it is supposed to and where it was going in the previous versions.

I noticed you added the typescript label and while they indeed are typescript typing files, note that I'm not using typescript in the project, it's just that the IDE uses them for auto-completion.

[eps1lon]

note that I'm not using typescript in the project, it's just that the IDE uses them for auto-completion.

I think this is the only actionable fix for us though. Autocompletion is working fine in codesandbox (and probably for any vscode version). It's just that webstorm is not up to date.

[eps1lon]

@ssypi This was released with @material-ui/core@4.0.0-alpha.2. Could you please verify if this is working for you?

[ssypi]

Thank you, I will let you know by monday, I’m currently on a vacation trip.

[ssypi]

For some reason, autocompletion for Button and ButtonBase components doesn't seem to work, but everything else I tried works perfectly such as Typography, Icon, IconButton, Step, StepButton, Divider etc. Button and ButtonBase seem to have slightly different d.ts files compared to some others.

declare const ButtonBase: ExtendButtonBase<ButtonBaseTypeMap>;

vs

declare const IconButton: React.ComponentType<IconButtonProps>;

Other than that, this is very good.

[geocolumbus]

4.11.0 still doesn't have autocomplete for <Box/> like it did in 3.9.2. I also tried 5.0.0-alpha.12 and that does not work. Earlier in the thread it was suggested that "Webstorm is just not up to date". What does that mean specifically? It would be really nice if this worked again.

[timvandam]

I am having this issue right now with mui 5. I am on the latest webstorm version. Tried downgrading to the oldest version Jetbrains Toolbox allowed me to (some 2020 version), but unfortunately had the same issue