jsxAttributeCompletionStyle doesn't work as expected

[svipas]

Does this issue occur when all extensions are disabled?: Yes/No

• VS Code Version: 1.71.2
• OS Version: macOS 12.6
• TS Version: 4.8.2

Steps to Reproduce:

Make sure jsxAttributeCompletionStyle is enabled for TS/JS.

As you can see from screenshot above that it doesn't insert flex, but flex={} even though ={} already exists. And it does the same thing for everything, in this case braces shouldn't be added because they already exist.

You can try yourself with code below (JavaScript React):

function Button() {
  return (
    <div className="">
    </div>
  )
}

Delete className and try to write it again you will see it tries to insert className='' instead of className, even though ='' already exists.

➡️ Tested and same happens in latest Insiders clean build without any extensions with default config. ⬅️

[mjbvz]

Confirmed that the insert text returned in this case is:

 "insertText": "className=\"$1\"",

[svipas]

@RyanCavanaugh I see @a-tarasyuk created a PR with fix: https://github.com/microsoft/TypeScript/pull/51093