// This comment goes missing
value={4}
>
Test
);
```
### Handlebars: Avoid adding unwanted line breaks between text and mustaches ([#6186] by [@gavinjoyce])
Previously, Prettier added line breaks between text and mustaches which resulted in unwanted whitespace in rendered output.
```hbs
// Input
Your username is @{{name}}
Hi {{firstName}} {{lastName}}
// Output (Prettier stable)
Your username is @
{{name}}
Hi
{{firstName}}
{{lastName}}
// Output (Prettier master)
Your username is @{{name}}
Hi {{firstName}} {{lastName}}
```
### Handlebars: Improve comment formatting ([#6206] by [@gavinjoyce])
Previously, Prettier would sometimes ignore whitespace when formatting comments.
```hbs
// Input
{{! Foo }}
{{#if @foo}}
Foo
{{/if}}
{{! Bar }}
{{#if @bar}}
Bar
{{/if}}
// Output (Prettier stable)
{{! Foo }}
{{#if @foo}}
Foo
{{/if}}{{! Bar }}{{#if @bar}}
Bar
{{/if}}
// Output (Prettier master)
{{! Foo }}
{{#if @foo}}
Foo
{{/if}}
{{! Bar }}
{{#if @bar}}
Bar
{{/if}}
```
#### JavaScript: Update ?? precedence to match stage 3 proposal ([#6404] by [@vjeux])
We've updated Prettier's support for the nullish coalescing operator to match a spec update that no longer allows it to immediately contain, or be contained within an `&&` or `||` operation.
```js
// Input
(foo ?? baz) || baz;
// Output (Prettier stable)
foo ?? baz || baz;
// Output (Prettier master)
(foo ?? baz) || baz;
```
Please note, as we update our parsers with versions that support this spec update, code without the parenthesis will throw a parse error.
#### JavaScript: Keep unary expressions parentheses with comments ([#6217] by [@sosukesuzuki])
Previously, Prettier removes parentheses enclose unary expressions. This change modify to keep it when the expression has comments.
```ts
// Input
!(
/* foo */
foo
);
!(
foo // foo
);
// Output (Prettier stable)
!/* foo */
foo;
!foo; // foo
// Output (Prettier master)
!(/* foo */ foo);
!(
foo // foo
);
```
### Handlebars: Improve comment formatting ([#6234] by [@gavinjoyce])
Previously, Prettier would incorrectly decode HTML entiites.
```hbs
// Input
Some escaped characters: < > &
// Output (Prettier stable)
Some escaped characters: < > &
// Output (Prettier master)
Some escaped characters: < > &
```
#### JavaScript: Stop moving comments inside tagged template literals ([#6236] by [@sosukesuzuki])
Previously, Prettier would move comments after the tag inside the template literal. This version fixes this problem.
```js
// Input
foo //comment
`
`;
// Output (Prettier stable)
foo` // comment
`;
// Output (Prettier master)
foo // comment
`
`;
```
#### JavaScript: Fix moving comments in function calls like `useEffect` second argument ([#6270] by [@sosukesuzuki])
This fixes a bug that was affecting function calls that have a arrow function as first argument and an array expression as second argument, such as the common React's `useEffect`. A comment in its own line before the second argument would be moved to the line above.
The bug was only present when using the Flow and TypeScript parsers.
```js
// Input
useEffect(
() => {
console.log("some code", props.foo);
},
// We need to disable the eslint warning here,
// because of some complicated reason.
// eslint-disable line react-hooks/exhaustive-deps
[]
);
// Output (Prettier stable)
useEffect(() => {
console.log("some code", props.foo);
}, // We need to disable the eslint warning here,
// because of some complicated reason.
// eslint-disable line react-hooks/exhaustive-deps
[]);
// Output (Prettier master)
useEffect(
() => {
console.log("some code", props.foo);
},
// We need to disable the eslint warning here,
// because of some complicated reason.
// eslint-disable line react-hooks/exhaustive-deps
[]
);
```
#### TypeScript: Fix crashes when using `//` in JSX texts ([#6289] by [@duailibe])
This version updates the TypeScript parser to correctly handle JSX text with double slashes (`//`). In previous versions, this would cause Prettier to crash.
#### CLI: Add `--only-changed` flag ([#5910] by [@g-harel])
Flag used with `--write` to avoid re-checking files that were not changed since they were last written (with the same formatting configuration).
#### HTML, Vue: Don't break the template element included in a line shorter than print-width([#6284] by [@sosukesuzuki])
Previously, even if the line length is shorter than print-width is Prettier breaks the line with a template element.
```html
// Input
foo
// Output (Prettier stable)
foo
// Output (Prettier master)
foo
```
#### JavaScript: Fix breaks indentation and idempotency when an arrow function that args include object pattern is passed to a function as parameter. ([#6301] by [@sosukesuzuki])
Previously, Prettier collapses strangely, when an arrow function that args include object pattern is passed to a function as parameter. Also, it breaks idempotency. Please see [#6294](https://github.com/prettier/prettier/issues/6294) for detail.
```js
// Input
foo(
({
a,
b
}) => {}
);
// Output (Prettier stable)
foo(({ a,
b }) => {});
// Output (Prettier master)
foo(
({
a,
b
}) => {}
);
```
#### TypeScript: Fix specific union type breaks after opening parenthesis, but not before closing ([#6307] by [@sosukesuzuki])
Previously, union type that put with `as` , `keyof`, `[]`, other union(`|`) and intersection(`&`) breaks after opening parenthesis, but not before closing. Please see [#6303](https://github.com/prettier/prettier/issues/6303) for detail.
```ts
// Input
const foo = [abc, def, ghi, jkl, mno, pqr, stu, vwx, yz] as (
| string
| undefined
)[];
// Prettier (stable)
const foo = [abc, def, ghi, jkl, mno, pqr, stu, vwx, yz] as (
| string
| undefined)[];
// Prettier (master)
const foo = [abc, def, ghi, jkl, mno, pqr, stu, vwx, yz] as (
| string
| undefined
)[];
```
#### HTML: Script tags are now treated as blocks for the purposes of formatting ([#6423] by [@thorn0])
Previously, in the [whitespace-sensitive mode](https://prettier.io/docs/en/options.html#html-whitespace-sensitivity), they were formatted as if they were inline.
```html
```
#### TypeScript: Fixed to break line and add a semicolon in one execution on one line long mapped types ([#6420] by [@sosukesuzuki])
Previously, when Prettier formatted long, one-line mapped types, it would break the line but didn’t add a semicolon – until you ran Prettier again (which broke Prettier’s idempotency rule). Now, Prettier adds the semicolon in the first run, fixing the issue.
```ts
// Input
type FooBar = { [P in keyof T]: T[P] extends Something ? Something : T[P] }
// Prettier (stable)
type FooBar = {
[P in keyof T]: T[P] extends Something ? Something : T[P]
};
// Prettier (master)
type FooBar = {
[P in keyof T]: T[P] extends Something ? Something : T[P];
};
```
#### JavaScript: Fix ugly formatting on object destructuring with parameter decorators ([#6411] by [@sosukesuzuki])
Previously, Prettier formatted decorators for destructured parameters in a weird way. Now, parameter decorators are placed just above the parameter they belong to.
```js
// Input
class Class {
method(
@decorator
{ foo }
) {}
}
// Prettier (stable)
class Class {
method(@decorator
{
foo
}) {}
}
// Prettier (master)
class Class {
method(
@decorator
{ foo }
) {}
}
```
#### JavaScript: Handle empty object patterns with type annotations in function parameters ([#6438] by [@bakkot])
```js
// Input
const f = ({}: MyVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryLongType) => {};
function g({}: Foo) {}
// Output (Prettier stable)
const f = ({
,
}: MyVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryLongType) => {};
function g({ }: Foo) {}
// Output (Prettier master)
const f = ({}: MyVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryLongType) => {};
function g({}: Foo) {}
```
#### JavaScript: Fix ugly formatting parens wrap binary expressions within call expressions ([#6441] by [@sosukesuzuki])
Previously, Prettier formatted parens wrap binary expressions within call expressions in a weird way. There was no line break before and after each parens.
```js
(
aaaaaaaaaaaaaaaaaaaaaaaaa &&
bbbbbbbbbbbbbbbbbbbbbbbbb &&
ccccccccccccccccccccccccc &&
ddddddddddddddddddddddddd &&
eeeeeeeeeeeeeeeeeeeeeeeee
)();
// Prettier (stable)
(aaaaaaaaaaaaaaaaaaaaaaaaa &&
bbbbbbbbbbbbbbbbbbbbbbbbb &&
ccccccccccccccccccccccccc &&
ddddddddddddddddddddddddd &&
eeeeeeeeeeeeeeeeeeeeeeeee)();
// Prettier (master)
(
aaaaaaaaaaaaaaaaaaaaaaaaa &&
bbbbbbbbbbbbbbbbbbbbbbbbb &&
ccccccccccccccccccccccccc &&
ddddddddddddddddddddddddd &&
eeeeeeeeeeeeeeeeeeeeeeeee
)();
```
#### JavaScript: Fix formatting on long named exports ([#6446] by [@sosukesuzuki])
Previously, Prettier formatted long named exports differently than named imports.
```js
// Input
export { fooooooooooooooooooooooooooooooooooooooooooooooooo } from "fooooooooooooooooooooooooooooo";
// Prettier (stable)
export {
fooooooooooooooooooooooooooooooooooooooooooooooooo
} from "fooooooooooooooooooooooooooooo";
// Prettier (master)
export { fooooooooooooooooooooooooooooooooooooooooooooooooo } from "fooooooooooooooooooooooooooooo";
```
[#5910]: https://github.com/prettier/prettier/pull/5910
[#6186]: https://github.com/prettier/prettier/pull/6186
[#6206]: https://github.com/prettier/prettier/pull/6206
[#6209]: https://github.com/prettier/prettier/pull/6209
[#6217]: https://github.com/prettier/prettier/pull/6217
[#6234]: https://github.com/prettier/prettier/pull/6234
[#6236]: https://github.com/prettier/prettier/pull/6236
[#6270]: https://github.com/prettier/prettier/pull/6270
[#6289]: https://github.com/prettier/prettier/pull/6289
[#6332]: https://github.com/prettier/prettier/pull/6332
[#6284]: https://github.com/prettier/prettier/pull/6284
[#6301]: https://github.com/prettier/prettier/pull/6301
[#6307]: https://github.com/prettier/prettier/pull/6307
[#6340]: https://github.com/prettier/prettier/pull/6340
[#6412]: https://github.com/prettier/prettier/pull/6412
[#6423]: https://github.com/prettier/prettier/pull/6423
[#6420]: https://github.com/prettier/prettier/pull/6420
[#6411]: https://github.com/prettier/prettier/pull/6411
[#6438]: https://github.com/prettier/prettier/pull/6411
[#6441]: https://github.com/prettier/prettier/pull/6441
[#6446]: https://github.com/prettier/prettier/pull/6446
[@duailibe]: https://github.com/duailibe
[@gavinjoyce]: https://github.com/gavinjoyce
[@sosukesuzuki]: https://github.com/sosukesuzuki
[@g-harel]: https://github.com/g-harel
[@jounqin]: https://github.com/JounQin
[@bakkot]: https://gibhub.com/bakkot
[@thorn0]: https://github.com/thorn0