diff --git a/changelog_unreleased/flow/14458.md b/changelog_unreleased/flow/14458.md new file mode 100644 index 000000000000..baa2c52abd8b --- /dev/null +++ b/changelog_unreleased/flow/14458.md @@ -0,0 +1,13 @@ +#### Add parentheses for `TypeofTypeAnnotation` to improve readability (#14458 by @fisker) + + +```tsx +// Input +type A = (typeof node.children)[]; + +// Prettier stable +type A = typeof node.children[]; + +// Prettier main +type A = (typeof node.children)[]; +``` diff --git a/src/language-js/needs-parens.js b/src/language-js/needs-parens.js index d5dc05a0b293..b6bd09491b7c 100644 --- a/src/language-js/needs-parens.js +++ b/src/language-js/needs-parens.js @@ -529,6 +529,14 @@ function needsParens(path, options) { (name === "objectType" && parent.type === "TSIndexedAccessType") || (name === "elementType" && parent.type === "TSArrayType") ); + // Same as `TSTypeQuery`, but for Flow syntax + case "TypeofTypeAnnotation": + return ( + (name === "objectType" && + (parent.type === "IndexedAccessType" || + parent.type === "OptionalIndexedAccessType")) || + (name === "elementType" && parent.type === "ArrayTypeAnnotation") + ); case "ArrayTypeAnnotation": return parent.type === "NullableTypeAnnotation"; @@ -583,13 +591,6 @@ function needsParens(path, options) { case "OptionalIndexedAccessType": return name === "objectType" && parent.type === "IndexedAccessType"; - case "TypeofTypeAnnotation": - return ( - name === "objectType" && - (parent.type === "IndexedAccessType" || - parent.type === "OptionalIndexedAccessType") - ); - case "StringLiteral": case "NumericLiteral": case "Literal": diff --git a/tests/format/typescript/typeof/__snapshots__/jsfmt.spec.js.snap b/tests/format/typescript/typeof/__snapshots__/jsfmt.spec.js.snap index 5f6e5fb92c96..a2bfeba7ea64 100644 --- a/tests/format/typescript/typeof/__snapshots__/jsfmt.spec.js.snap +++ b/tests/format/typescript/typeof/__snapshots__/jsfmt.spec.js.snap @@ -2,20 +2,20 @@ exports[`typeof.ts format 1`] = ` ====================================options===================================== -parsers: ["typescript"] +parsers: ["typescript", "flow"] printWidth: 80 | printWidth =====================================input====================================== -a as (typeof node.children)[number] -a as (typeof node.children)[] -a as ((typeof node.children)[number])[] -a as number[(typeof node.children)] +type A = (typeof node.children)[number]; +type B = (typeof node.children)[]; +type C = ((typeof node.children)[number])[]; +type D = number[(typeof node.children)]; =====================================output===================================== -a as (typeof node.children)[number]; -a as (typeof node.children)[]; -a as (typeof node.children)[number][]; -a as number[typeof node.children]; +type A = (typeof node.children)[number]; +type B = (typeof node.children)[]; +type C = (typeof node.children)[number][]; +type D = number[typeof node.children]; ================================================================================ `; diff --git a/tests/format/typescript/typeof/jsfmt.spec.js b/tests/format/typescript/typeof/jsfmt.spec.js index 2ea3bb6eb2e4..f7bac65988e0 100644 --- a/tests/format/typescript/typeof/jsfmt.spec.js +++ b/tests/format/typescript/typeof/jsfmt.spec.js @@ -1 +1 @@ -run_spec(__dirname, ["typescript"]); +run_spec(__dirname, ["typescript", "flow"]); diff --git a/tests/format/typescript/typeof/typeof.ts b/tests/format/typescript/typeof/typeof.ts index accada3df35a..70e36cda8b10 100644 --- a/tests/format/typescript/typeof/typeof.ts +++ b/tests/format/typescript/typeof/typeof.ts @@ -1,4 +1,4 @@ -a as (typeof node.children)[number] -a as (typeof node.children)[] -a as ((typeof node.children)[number])[] -a as number[(typeof node.children)] +type A = (typeof node.children)[number]; +type B = (typeof node.children)[]; +type C = ((typeof node.children)[number])[]; +type D = number[(typeof node.children)];