prettier/CHANGELOG.unreleased.md

7.0 KiB

MDX: Adjacent JSX elements should be allowed in mdx (#6332 by @JounQin)

Previous versions would not format adjacent JSX elements in mdx, this has been fixed in this version.

// Input
<Hello>
    test   <World />   test
</Hello>123

// Output (Prettier stable)
SyntaxError: Unexpected token (3:9)
  1 | <Hello>
  2 |     test   <World />   test
> 3 | </Hello>123
    |         ^

// Output (Prettier master)
<Hello>
  test <World /> test
</Hello>123      ^


// Input
<Hello>
    test   <World />   test
</Hello>
<Hello>
    test   <World />   test
</Hello>123

// Output (Prettier stable)
SyntaxError: Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX fragment <>...</>? (4:1)
  2 |     test   <World />   test
  3 | </Hello>
> 4 | <Hello>
    | ^
  5 |     test   <World />   test
  6 | </Hello>123

// Output (Prettier master)
<Hello>
  test <World /> test
</Hello>
<Hello>
  test <World /> test
</Hello>123

TypeScript: Print comment following a JSX element with generic (#6209 by @duailibe)

Previous versions would not print this comment, this has been fixed in this version.

// Input
const comp = (
  <Foo<number>
    // This comment goes missing
    value={4}
  >
    Test
  </Foo>
);

// Output (Prettier stable)
const comp = <Foo<number> value={4}>Test</Foo>;

// Output (Prettier master)
const comp = (
  <Foo<number>
    // This comment goes missing
    value={4}
  >
    Test
  </Foo>
);

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.

// Input
<p>Your username is @{{name}}</p>
<p>Hi {{firstName}} {{lastName}}</p>

// Output (Prettier stable)
<p>
  Your username is @
  {{name}}
</p>
<p>
  Hi
  {{firstName}}
  {{lastName}}
</p>

// Output (Prettier master)
<p>
  Your username is @{{name}}
</p>
<p>
  Hi {{firstName}} {{lastName}}
</p>

Handlebars: Improve comment formatting (#6206 by @gavinjoyce)

Previously, Prettier would sometimes ignore whitespace when formatting comments.

// Input
<div>
  {{! Foo }}
  {{#if @foo}}
    Foo
  {{/if}}

  {{! Bar }}
  {{#if @bar}}
    Bar
  {{/if}}
</div>

// Output (Prettier stable)
<div>
  {{! Foo }}
  {{#if @foo}}
    Foo
  {{/if}}{{! Bar }}{{#if @bar}}
    Bar
  {{/if}}
</div>

// Output (Prettier master)
<div>
  {{! Foo }}
  {{#if @foo}}
    Foo
  {{/if}}
  {{! Bar }}
  {{#if @bar}}
    Bar
  {{/if}}
</div>

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.

// 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.

// Input
<p>
  Some escaped characters: &lt; &gt; &amp;
</p>

// Output (Prettier stable)
<p>
  Some escaped characters: < > &
</p>

// Output (Prettier master)
<p>
  Some escaped characters: &lt; &gt; &amp;
</p>

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.

// 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.

// 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).