Skip to content

JSX prop autocompletion missing props once certain ones are assigned #34957

Closed
@wnayes

Description

@wnayes

TypeScript Version: 3.7.x-dev.201xxxxx

Search Terms: jsx intellisense autocomplete

Code

import React from "react";

interface KlassComponentProps {
    one?: string;
    two?: number;
    problematic?: any;
}

/**
 * A component that can be used directly, or subclassed.
 * Any derived components can have additional props, but must at least have
 * the props from `KlassComponentProps`.
 * */
class KlassComponent<TProps extends KlassComponentProps = KlassComponentProps>
    extends React.Component<TProps>
{
}

function TestComponent() {
    // Problem: autocomplete options (ctrl+space) do not include `one` or `two`
    // once the `problematic` prop is assigned
    const badcase = <KlassComponent problematic="test"></KlassComponent>;

    // Without `problematic`, prop autocomplete shows `one` and `two`.
    const okcase = <KlassComponent></KlassComponent>;
}

Expected behavior:
With both usages of KlassComponent, bringing up editor autocomplete should include the one and two props in the list of remaining props.

Actual behavior:
The one and two prop are not shown once the problematic prop is assigned.

Playground Link: Link

Related Issues: #29017

Metadata

Metadata

Assignees

Labels

BugA bug in TypeScriptFix AvailableA PR has been opened for this issue

Type

No type

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions