Workaround optional chaining parser bug in Angular expressions (#8253)

* Workaround optional chaining parser bug in Angular expressions

* add changelog entry

* fix changelog entry

changelog_unreleased/angular/pr-8253.md

@@ -0,0 +1,13 @@
+#### Workaround optional chaining parser bug ([#8253](https://github.com/prettier/prettier/pull/8253) by [@thorn0](https://github.com/thorn0))
+
+<!-- prettier-ignore -->
+```html
+<!-- Input -->
+{{ a?.b[c] }}
+
+<!-- Prettier stable -->
+{{ (a?.b)[c] }}
+
+<!-- Prettier master -->
+{{ a?.b[c] }}
+```

src/language-js/needs-parens.js

@@ -622,7 +622,11 @@ function needsParens(path, options) {
     case "OptionalMemberExpression":
     case "OptionalCallExpression":
       if (
-        (parent.type === "MemberExpression" && name === "object") ||
+        (parent.type === "MemberExpression" &&
+          name === "object" &&
+          // https://github.com/prettier/prettier/issues/8252
+          (!options.parser.startsWith("__ng_") ||
+            (node.extra && node.extra.parenthesized))) ||
         ((parent.type === "CallExpression" ||
           parent.type === "NewExpression") &&
           name === "callee")

tests/angular/interpolation/__snapshots__/jsfmt.spec.js.snap

@@ -21,6 +21,20 @@ trailingComma: "none"
 ================================================================================
 `;
 
+exports[`optional-chaining.ng - {"trailingComma":"none"} format 1`] = `
+====================================options=====================================
+parsers: ["__ng_interpolation"]
+printWidth: 80
+trailingComma: "none"
+                                                                                | printWidth
+=====================================input======================================
+[  a?.b[c], (a?.b)[c]  ]
+
+=====================================output=====================================
+[a?.b[c], (a?.b)[c]]
+================================================================================
+`;
+
 exports[`pipe-expression.ng - {"trailingComma":"none"} format 1`] = `
 ====================================options=====================================
 parsers: ["__ng_interpolation"]

tests/angular/interpolation/optional-chaining.ng

@@ -0,0 +1 @@
+[  a?.b[c], (a?.b)[c]  ]