Prettier-vscode: Typescript 3.8.3 - Conditional chaining break formatting

[Flowrome]

Summary

I've reinstalled vsCode delete all my settings and installed just Prettier (3.20.0), using TSX with latest version of Typescript the format breaks whenever i use conditional chaining.
I know that there are other issue, but they are all closed due to inactivity or other reasons, i've tried all the solutions that have been proposed without success.

Expected result

The format should succeed even if i us conditional chaining (typescript 3.7.0+)

Actual result

Formatting a file that doesn't contain conditional chaining work fine, it breaks only when a file with .tsx extension contains conditional chaining

Additional information

VS Code Version:

Prettier Extension Version:
3.20.0

OS and version:
MacOSx 10.14.6

Prettier Log Output

{
  "ignored": false,
  "inferredParser": "typescript"
}
["INFO" - 12:08:08 PM] Detected local configuration (i.e. .prettierrc or .editorconfig), VS Code configuration will not be used
["INFO" - 12:08:08 PM] Prettier Options:
{
  "filepath": "/Users/romeo.nupieri/Documents/Projects/Personal/Stencil/fl-ui-project/fl-ui/src/components/molecules/exported/fl-input-file.molecule/fl-input-file.molecule.tsx",
  "parser": "typescript",
  "useTabs": false,
  "tabWidth": 2,
  "endOfLine": "lf",
  "printWidth": 120,
  "singleQuote": true
}
["ERROR" - 12:08:08 PM] Error formatting document.
["ERROR" - 12:08:08 PM] Expression expected. (190:45)
  188 |       event.preventDefault();
  189 |     }
> 190 |     const files: File[] = Array.from(target?.files);
      |                                             ^
  191 |     this.readMultipleFiles(files)
  192 |       .then((fileArray: EmittedFile[]) => {
  193 |         const value: EmittedFile[] = this.multiple
SyntaxError: Expression expected. (190:45)
  188 |       event.preventDefault();
  189 |     }
> 190 |     const files: File[] = Array.from(target?.files);
      |                                             ^
  191 |     this.readMultipleFiles(files)
  192 |       .then((fileArray: EmittedFile[]) => {
  193 |         const value: EmittedFile[] = this.multiple
    at e (/Users/romeo.nupieri/Documents/Projects/Personal/Stencil/fl-ui-project/fl-ui/node_modules/prettier/parser-typescript.js:1:329)
    at Object.parse (/Users/romeo.nupieri/Documents/Projects/Personal/Stencil/fl-ui-project/fl-ui/node_modules/prettier/parser-typescript.js:1:2261773)
    at Object.parse$2 [as parse] (/Users/romeo.nupieri/Documents/Projects/Personal/Stencil/fl-ui-project/fl-ui/node_modules/prettier/index.js:10629:19)
    at coreFormat (/Users/romeo.nupieri/Documents/Projects/Personal/Stencil/fl-ui-project/fl-ui/node_modules/prettier/index.js:13888:23)
    at format (/Users/romeo.nupieri/Documents/Projects/Personal/Stencil/fl-ui-project/fl-ui/node_modules/prettier/index.js:14146:73)
    at formatWithCursor (/Users/romeo.nupieri/Documents/Projects/Personal/Stencil/fl-ui-project/fl-ui/node_modules/prettier/index.js:14162:12)
    at /Users/romeo.nupieri/Documents/Projects/Personal/Stencil/fl-ui-project/fl-ui/node_modules/prettier/index.js:42756:15
    at Object.format (/Users/romeo.nupieri/Documents/Projects/Personal/Stencil/fl-ui-project/fl-ui/node_modules/prettier/index.js:42775:12)
    at /Users/romeo.nupieri/.vscode/extensions/esbenp.prettier-vscode-3.20.0/dist/extension.js:1:350954
    at t.default.safeExecution (/Users/romeo.nupieri/.vscode/extensions/esbenp.prettier-vscode-3.20.0/dist/extension.js:1:351254)
    at t.default.<anonymous> (/Users/romeo.nupieri/.vscode/extensions/esbenp.prettier-vscode-3.20.0/dist/extension.js:1:350934)
    at Generator.next (<anonymous>)
    at s (/Users/romeo.nupieri/.vscode/extensions/esbenp.prettier-vscode-3.20.0/dist/extension.js:1:345019)
["INFO" - 12:08:08 PM] Formatting completed in 46.130914ms.

[altano]

This is broken because this extension is still on the older version of Prettier that doesn't have Typescript 3.8 support.

This extension needs to update to Prettier 2.X

[Flowrome]

This is broken because this extension is still on the older version of Prettier that doesn't have Typescript 3.8 support.

This extension needs to update to Prettier 2.X

but on normal ts file it is working fine

[altano]

Oh I'm sorry I was mistaken. Prettier 1.19 supports Typescript 3.7 which is when optional chaining was added (what you're referring to as conditional chaining).

This should work with version 3.20 of the extension. Ignore my comment.

[Flowrome]

Oh I'm sorry I was mistaken. Prettier 1.19 supports Typescript 3.7 which is when optional chaining was added (what you're referring to as conditional chaining).

This _should_ work with version 3.20 of the extension. Ignore my comment.

I think that it's a problem for the tsx files, that contains virtual dom functionality, and prettier tries to format them with Jsx instead of tsx

[David-Else]

This extension needs to update to Prettier 2.X

Prettier 2.0 is out!

[ntotten]

Can somebody provide a github repo that I can use to reproduce this issue?

[no-response[bot]]

This issue has been automatically closed because there has been no response to our request for more information from the original author. Currently, there is not enough information provided for us to take action. Please reply and reopen this issue if you need additional assistance.

[Flowrome]

Start any stencilJS project, and use conditional chaining in a tsx file, inside the jsx render part, it won't work.

[ntotten]

Please provide a sample repo. I created a StencilJS project and could not reproduce the issue.

[Flowrome]

Please provide a sample repo. I created a StencilJS project and could not reproduce the issue.

Hi Nethan, thank you for following the issue, i've sent you the invitation to the project, here the file where you can reproduce it.
i've tried also from a new project and it seems to work, so it may depends on the configuration?

[ntotten]

Your project is using prettier 1.18.2, you need at least 1.19 to use conditional chaining. Run npm add [email protected] -D

The prettier extension uses your local version of prettier when it is available. The version bundled with the extension is only a fallback if no local or global version is found.

[abury]

Thanks @ntotten! I've been stuck on this for weeks and didn't realize this. Guess I should have RTFM :(

[github-actions[bot]]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.