Skip to content

Latest commit

 

History

History
436 lines (345 loc) · 9.49 KB

CHANGELOG.unreleased.md

File metadata and controls

436 lines (345 loc) · 9.49 KB
Raw

MDX: fix text with whitespace after JSX trim incorrectly (#6340 by @JounQin)

Previous versions format text with whitespace after JSX incorrectly in mdx, this has been fixed in this version.

<!-- Input -->
# Heading
<Hello>
    test   <World />   test
</Hello>       123

<!-- Output (Prettier stable) -->
<Hello>
  test <World /> test
</Hello>123

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

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

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.

// Input
<template>
  <template>foo</template>
</template>

// Output (Prettier stable)
<template>
  <template
    >foo</template
  >
</template>

// Output (Prettier master)
<template>
  <template>foo</template>
</template>

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 for detail.

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

// 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
)[];