Code completion broken in WebStorm

Bug report

Describe the bug

Code completion is broken in WebStorm.

To reproduce

1. Create a minimal component:

import { Link as ChakraLink } from '@chakra-ui/core';
import React from 'react';

export interface LinkProps {
  isActive: boolean;
  to: string;
  children: string;
}

export function Link(props: LinkProps) {
  const { isActive, to, children } = props;

  return <ChakraLink>{children}</ChakraLink>;
}

1. Position cursor after ChakraLink but before >
2. Hit ctrl-space to trigger autocomplete
3. Result:

Minimal reproduction

Minimal repro: https://codesandbox.io/s/peaceful-euler-s3p8n?file=/src/Link.tsx

Expected behavior

IDE offers completion, like VSCode does:

System information

• OS: Win 10
• Browser (if applies): Firefox
• Version of @chakra-ui/core: 1.0.0-rc.5
• Version of Node.js: 12.18.1
• WebStorm: 2020.2.3
• TypeScript: 3.9.7

[Lulololu]

Hola,

The exact same thing happens to me with Webstorm. So far, I’ve tried :

• Deleting Node Modules and package-lock.json - Invalidate Cache and Restart ;
• Installing Webstorm EAP 2020.3.

Neither solution worked for me.

So, I’ve opened an Issue on Webstorm Youtrack :

https://youtrack.jetbrains.com/issue/WEB-48085

Thank You,

[RIP21]

@frysztak @dohomi @JohannesKlauss and others. In the latest release for WebStorm and other JetBrains IDEs, it’s finally fixed! 2021.1 and onwards 😃