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

Jsx Attribute Completion not always works correct when tag is like <Form.Item> #47280

Closed
heroboy opened this issue Dec 31, 2021 · 7 comments · Fixed by #47412
Closed

Jsx Attribute Completion not always works correct when tag is like <Form.Item> #47280

heroboy opened this issue Dec 31, 2021 · 7 comments · Fixed by #47412
Assignees
Labels
Bug A bug in TypeScript Fix Available A PR has been opened for this issue

Comments

@heroboy
Copy link

heroboy commented Dec 31, 2021

Bug Report

🔎 Search Terms

Jsx Attribute Completion

🕗 Version & Regression Information

  • This is a not crash
  • This changed between versions 4.5.4 and 4.5.4
  • This is the behavior in every version I tried, and I reviewed the FAQ for entries about _________
  • I was unable to test this on prior versions because _______

⏯ Playground Link

No playground.
Please paste the code to https://github.dev/. (create a a.tsx file first)
Or use the current version vscode(1.63.2)

💻 Code

interface FormInterface {
    Item: (props: {}) => any;
    (props: {}): any;
}

declare const Form: FormInterface;

function Form2() { return <div></div> }
Form2.Item = function () { return <div></div> }

function main() {
    return <Form>
        <Form.Item></Form.Item>
        <Form.Item></Form.Item>
        <Form.Item></Form.Item>
        
    </Form>
}

🙁 Actual behavior

Type code <Form.It , select the Item in completion list, press TAB to complete.
The code become <Form.Item={}.

Even set Jsx Attribute Completion Style to none, not stop the wrong completion.

🙂 Expected behavior

When you type <Form.It press tab, and complete the code to <Form.Item
The <Form2.Item> completion is correct.

@fatcerberus
Copy link

Possibly related to #47090

@RyanCavanaugh RyanCavanaugh added the Bug A bug in TypeScript label Jan 3, 2022
@RyanCavanaugh RyanCavanaugh added this to the TypeScript 4.7.0 milestone Jan 3, 2022
@RyanCavanaugh
Copy link
Member

@jakebailey might or might not be fixed by the PR you have up

@jakebailey
Copy link
Member

@fatcerberus There are distinct settings for JSX and TSX; you need to set it to "none" in both to fully disable it across both file types. Look for typescript.preferences.jsxAttributeCompletionStyle.

However, this should have been fixed in 4.5.4 (even though I didn't consider dotted names when I wrote the fix).

When I go to github.dev, I can see that they are using TS 4.5.0, which definitely predates the fix. My desktop install of VS Code 1.63.2 includes 4.5.4, and doesn't break.

image

@fatcerberus Can you open the command palette and choose "Select TypeScript Version" to see what you are running? Are you using github.dev, or is this a normal install?

@fatcerberus
Copy link

@jakebailey I’m not the OP; I just pointed out the related issue. 😅

@jakebailey
Copy link
Member

jakebailey commented Jan 3, 2022

@fatcerberus apologies, I clearly didn't scroll up enough.

I looked more closely at vscode.dev/github.dev; although the menu says 4.5.0 (vscode.dev doesn't even let me see it), the tsserver file is actually 4.5.4, so there must be some UI bug.

That of course unfortunately means my fix is not complete. Sigh.

@heroboy
Copy link
Author

heroboy commented Jan 4, 2022

hello @jakebailey , I tried set "typescript.preferences.jsxAttributeCompletionStyle" to "none", and it works.
Sorry I didn't notice there are two Jsx Attribute Completion Style settings.

@jakebailey
Copy link
Member

I've updated #47096 to also handle these types of tag names.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug A bug in TypeScript Fix Available A PR has been opened for this issue
Projects
None yet
6 participants