From 6f602d1126eff381fb8a7f61b60d5bdb1018a196 Mon Sep 17 00:00:00 2001 From: Sosuke Suzuki Date: Mon, 25 Oct 2021 21:23:42 +0900 Subject: [PATCH] Fix formatting for tagged template decorators (#11717) * Fix formatting for tagged template decorators * Add changelog --- changelog_unreleased/typescript/11717.md | 22 +++++++++++++++++++ src/language-js/needs-parens.js | 4 ++++ .../babel-ts/__snapshots__/jsfmt.spec.js.snap | 10 +++++++++ ...arenthesized-decorators-tagged-template.ts | 4 ++++ .../__snapshots__/jsfmt.spec.js.snap | 20 +++++++++++++++++ ...arenthesized-decorators-tagged-template.ts | 4 ++++ .../__snapshots__/jsfmt.spec.js.snap | 20 +++++++++++++++++ ...arenthesized-decorators-tagged-template.ts | 4 ++++ 8 files changed, 88 insertions(+) create mode 100644 changelog_unreleased/typescript/11717.md create mode 100644 tests/format/misc/errors/babel-ts/parenthesized-decorators-tagged-template.ts create mode 100644 tests/format/misc/typescript-babel-only/parenthesized-decorators-tagged-template.ts create mode 100644 tests/format/misc/typescript-only/parenthesized-decorators-tagged-template.ts diff --git a/changelog_unreleased/typescript/11717.md b/changelog_unreleased/typescript/11717.md new file mode 100644 index 000000000..0a35341c1 --- /dev/null +++ b/changelog_unreleased/typescript/11717.md @@ -0,0 +1,22 @@ +#### Fix formatting for tagged template decorators (#11717 by @sosukesuzuki) + + +```tsx +// Input +class Test { + @foo`bar` + test: string = "test" +} + +// Prettier stable +class Test { + @(foo`bar`) + test: string = "test" +} + +// Prettier main +class Test { + @foo`bar` + test: string = "test" +} +``` diff --git a/src/language-js/needs-parens.js b/src/language-js/needs-parens.js index b8daece9c..220f40f24 100644 --- a/src/language-js/needs-parens.js +++ b/src/language-js/needs-parens.js @@ -140,6 +140,10 @@ function needsParens(path, options) { break; case "Identifier": return false; + case "TaggedTemplateExpression": + // babel-parser cannot parse + // @foo`bar` + return options.parser !== "typescript"; default: return true; } diff --git a/tests/format/misc/errors/babel-ts/__snapshots__/jsfmt.spec.js.snap b/tests/format/misc/errors/babel-ts/__snapshots__/jsfmt.spec.js.snap index ac122bb47..efda7f5ab 100644 --- a/tests/format/misc/errors/babel-ts/__snapshots__/jsfmt.spec.js.snap +++ b/tests/format/misc/errors/babel-ts/__snapshots__/jsfmt.spec.js.snap @@ -41,6 +41,16 @@ exports[`multiline-declaration-type.ts [babel-ts] format 1`] = ` 3 |" `; +exports[`parenthesized-decorators-tagged-template.ts [babel-ts] format 1`] = ` +"Unexpected token (2:7) + 1 | class Test { +> 2 | @foo\`bar\` + | ^ + 3 | text: string = \\"text\\" + 4 | } + 5 |" +`; + exports[`type-annotation-expr-statement.ts [babel-ts] format 1`] = ` "Did not expect a type annotation here. (1:3) > 1 | (a: T); diff --git a/tests/format/misc/errors/babel-ts/parenthesized-decorators-tagged-template.ts b/tests/format/misc/errors/babel-ts/parenthesized-decorators-tagged-template.ts new file mode 100644 index 000000000..ff4bca6b4 --- /dev/null +++ b/tests/format/misc/errors/babel-ts/parenthesized-decorators-tagged-template.ts @@ -0,0 +1,4 @@ +class Test { + @foo`bar` + text: string = "text" +} diff --git a/tests/format/misc/typescript-babel-only/__snapshots__/jsfmt.spec.js.snap b/tests/format/misc/typescript-babel-only/__snapshots__/jsfmt.spec.js.snap index faf67d5fe..4f08e7695 100644 --- a/tests/format/misc/typescript-babel-only/__snapshots__/jsfmt.spec.js.snap +++ b/tests/format/misc/typescript-babel-only/__snapshots__/jsfmt.spec.js.snap @@ -60,6 +60,26 @@ class Bar { ================================================================================ `; +exports[`parenthesized-decorators-tagged-template.ts format 1`] = ` +====================================options===================================== +parsers: ["babel-ts"] +printWidth: 80 + | printWidth +=====================================input====================================== +class Test { + @(foo\`bar\`) + text: string = "text" +} + +=====================================output===================================== +class Test { + @(foo\`bar\`) + text: string = "text"; +} + +================================================================================ +`; + exports[`prettier-ignore-nested-unions.ts format 1`] = ` ====================================options===================================== parsers: ["babel-ts"] diff --git a/tests/format/misc/typescript-babel-only/parenthesized-decorators-tagged-template.ts b/tests/format/misc/typescript-babel-only/parenthesized-decorators-tagged-template.ts new file mode 100644 index 000000000..e12dd2e2c --- /dev/null +++ b/tests/format/misc/typescript-babel-only/parenthesized-decorators-tagged-template.ts @@ -0,0 +1,4 @@ +class Test { + @(foo`bar`) + text: string = "text" +} diff --git a/tests/format/misc/typescript-only/__snapshots__/jsfmt.spec.js.snap b/tests/format/misc/typescript-only/__snapshots__/jsfmt.spec.js.snap index d2b929a84..244e6d831 100644 --- a/tests/format/misc/typescript-only/__snapshots__/jsfmt.spec.js.snap +++ b/tests/format/misc/typescript-only/__snapshots__/jsfmt.spec.js.snap @@ -93,6 +93,26 @@ class Bar { ================================================================================ `; +exports[`parenthesized-decorators-tagged-template.ts format 1`] = ` +====================================options===================================== +parsers: ["typescript"] +printWidth: 80 + | printWidth +=====================================input====================================== +class Test { + @foo\`bar\` + text: string = "text" +} + +=====================================output===================================== +class Test { + @foo\`bar\` + text: string = "text"; +} + +================================================================================ +`; + exports[`prettier-ignore-parenthesized-type.ts format 1`] = ` ====================================options===================================== parsers: ["typescript"] diff --git a/tests/format/misc/typescript-only/parenthesized-decorators-tagged-template.ts b/tests/format/misc/typescript-only/parenthesized-decorators-tagged-template.ts new file mode 100644 index 000000000..ff4bca6b4 --- /dev/null +++ b/tests/format/misc/typescript-only/parenthesized-decorators-tagged-template.ts @@ -0,0 +1,4 @@ +class Test { + @foo`bar` + text: string = "text" +}