Correct fit() for fill() (#16899)

seiyab · web-flow · commit e13614ffd806 · 2024-12-01T19:00:35.000+09:00
* add test for #16897 this test fails at this commit. snapshots are taken at e3b8a16 * Fix #16897 * add changelog * omit redundant test case
diff --git a/changelog_unreleased/javascript/16899.md b/changelog_unreleased/javascript/16899.md
@@ -0,0 +1,35 @@
+#### Fix non-idempotent formatting (#16899 by @seiyab)
+
+This bug fix is not language-specific. You may see similar change in any languages. This fixes regression in 3.4.0 so change caused by it should yield same formatting as 3.3.3.
+
+<!-- prettier-ignore -->
+```jsx
+// Input
+<div>
+  foo
+  <span>longlonglonglonglonglonglonglonglonglonglonglonglonglonglongl foo</span>
+  , abc
+</div>;
+
+// Prettier stable (first)
+<div>
+  foo
+  <span>
+    longlonglonglonglonglonglonglonglonglonglonglonglonglonglongl foo
+  </span>, abc
+</div>;
+
+// Prettier stable (second)
+<div>
+  foo
+  <span>longlonglonglonglonglonglonglonglonglonglonglonglonglonglongl foo</span>
+  , abc
+</div>;
+
+// Prettier main
+<div>
+  foo
+  <span>longlonglonglonglonglonglonglonglonglonglonglonglonglonglongl foo</span>
+  , abc
+</div>;
+```
diff --git a/src/document/printer.js b/src/document/printer.js
@@ -234,7 +234,8 @@ function fits(
       case DOC_TYPE_ARRAY:
       case DOC_TYPE_FILL: {
         const parts = docType === DOC_TYPE_ARRAY ? doc : doc.parts;
-        for (let i = parts.length - 1; i >= 0; i--) {
+        const end = doc[DOC_FILL_PRINTED_LENGTH] ?? 0;
+        for (let i = parts.length - 1; i >= end; i--) {
           cmds.push({ mode, doc: parts[i] });
         }
         break;
diff --git a/tests/format/jsx/text-wrap/__snapshots__/format.test.js.snap b/tests/format/jsx/text-wrap/__snapshots__/format.test.js.snap
@@ -1,5 +1,44 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`issue-16897.js format 1`] = `
+====================================options=====================================
+parsers: ["flow", "typescript"]
+printWidth: 80
+                                                                                | printWidth
+=====================================input======================================
+function HelloWorld(   ) {
+  return (
+    <div>
+      <div>
+        foo
+        <br />
+        bar{' '}
+        <span className="font-semibold">
+          foobar foobar foobar foobar 12345
+        </span>, foobar foobar foobar
+      </div>
+    </div>
+  )
+}
+
+=====================================output=====================================
+function HelloWorld() {
+  return (
+    <div>
+      <div>
+        foo
+        <br />
+        bar{" "}
+        <span className="font-semibold">foobar foobar foobar foobar 12345</span>
+        , foobar foobar foobar
+      </div>
+    </div>
+  );
+}
+
+================================================================================
+`;
+
 exports[`test.js format 1`] = `
 ====================================options=====================================
 parsers: ["flow", "typescript"]
diff --git a/tests/format/jsx/text-wrap/issue-16897.js b/tests/format/jsx/text-wrap/issue-16897.js
@@ -0,0 +1,14 @@
+function HelloWorld(   ) {
+  return (
+    <div>
+      <div>
+        foo
+        <br />
+        bar{' '}
+        <span className="font-semibold">
+          foobar foobar foobar foobar 12345
+        </span>, foobar foobar foobar
+      </div>
+    </div>
+  )
+}
