fix: Preserve significant leading whitespace in jsx text nodes.

Author: amanda-mitchell

transforms/__tests__/suppress-eslint-errors.js

@@ -357,7 +357,7 @@ test('handles trailing text on the previous line', () => {
 }`);
 });
 
-test('preserves significant whitespace in jsx text nodes', () => {
+test('preserves significant trailing whitespace in jsx text nodes', () => {
 	const program = `export function Component({ a, b }) {
   return (
     <div>
@@ -379,6 +379,28 @@ test('preserves significant whitespace in jsx text nodes', () => {
 }`);
 });
 
+test('preserves significant leading whitespace in jsx text nodes', () => {
+	const program = `export function Component({ a, b }) {
+  return (
+    <div>
+      <span>A span</span> next to some text
+      <span onClick={() => a == b}>hi</span>.
+    </div>
+  );
+}`;
+
+	expect(modifySource(program)).toBe(`export function Component({ a, b }) {
+  return (
+    (<div>
+      <span>A span</span> next to some text
+      {/* TODO: Fix this the next time the file is edited. */}
+      {/* eslint-disable-next-line eqeqeq */}
+      <span onClick={() => a == b}>hi</span>.
+    </div>)
+  );
+}`);
+});
+
 const defaultPath = path.resolve(__dirname, 'examples', 'index.js');
 function modifySource(source, options) {
 	const transformOptions = { ...options };

transforms/suppress-eslint-errors.js

@@ -120,20 +120,43 @@ function addDisableComment(filePath, api, commentText, targetLine, ruleId, path)
 				continue;
 			}
 
-			const segments = sibling.value.split('\n').flatMap((line) => {
+			const lines = sibling.value.split('\n');
+			const segments = lines.flatMap((line, lineIndex) => {
+				const result = [];
+
 				const trimmedLine = line.trimEnd();
-				if (trimmedLine.length === 0) {
-					return ['\n'];
+				if (trimmedLine.length !== 0) {
+					if (lineIndex === 0) {
+						const startTrimmedLine = trimmedLine.trimStart();
+						if (startTrimmedLine.length === line.length) {
+							result.push(line);
+						} else {
+							if (startTrimmedLine.length < trimmedLine.length) {
+								result.push(trimmedLine.substr(0, trimmedLine.length - startTrimmedLine.length));
+							}
+
+							result.push(startTrimmedLine);
+
+							if (trimmedLine.length < line.length) {
+								result.push(line.substr(trimmedLine.length));
+							}
+						}
+					} else {
+						if (trimmedLine.length === line.length) {
+							result.push(line);
+						} else {
+							result.push(trimmedLine, line.substr(trimmedLine.length));
+						}
+					}
 				}
-				if (trimmedLine.length === line.length) {
-					return [line, '\n'];
+
+				if (lineIndex != lines.length - 1) {
+					result.push('\n');
 				}
 
-				return [trimmedLine, line.substr(trimmedLine.length), '\n'];
+				return result;
 			});
 
-			segments.pop();
-
 			children.splice(siblingIndex, 1, ...segments.map((segment) => api.j.jsxText(segment)));
 		}