@tsrx/prettier-plugin 0.3.93 → 0.3.95

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsrx/prettier-plugin",
-  "version": "0.3.93",
+  "version": "0.3.95",
   "description": "Ripple plugin for Prettier",
   "type": "module",
   "module": "src/index.js",
@@ -27,7 +27,7 @@
     "prettier": "^3.8.4"
   },
   "dependencies": {
-    "@tsrx/core": "0.1.37"
+    "@tsrx/core": "0.1.38"
   },
   "files": [
     "src/"

package/src/index.js

@@ -37,7 +37,7 @@ const {
 	lineSuffix,
 	align,
 } = builders;
-const { replaceEndOfLine, willBreak } = utils;
+const { replaceEndOfLine, stripTrailingHardline, willBreak } = utils;
 
 /** @type {import('prettier').Plugin['languages']} */
 export const languages = [
@@ -121,14 +121,38 @@ export const printers = {
 						// Return the formatted CSS
 						// Note: printElement will wrap this in indent(), so we don't add indent here
 						return body;
-					} catch (error) {
-						// If CSS has syntax errors, return original unformatted content
-						console.error('Error formatting CSS:', error);
+					} catch {
+						// A stylesheet that doesn't parse (e.g. mid-edit code) is an expected
+						// state, not an error: keep it verbatim and stay quiet.
 						return node.source;
 					}
 				};
 			}
 
+			// Raw-text `<script>` bodies: the parser mirrors the element's `content` as
+			// a single JSXText child. Format it with Prettier's TypeScript parser (a
+			// superset of JS, so plain bodies format identically) the same way <style>
+			// bodies are formatted as CSS above.
+			if (node.type === 'JSXText') {
+				const parent = /** @type {AST.TSRXJSXElement | null} */ (path.getParentNode());
+				if (isRawScriptElement(parent)) {
+					return async (textToDoc) => {
+						try {
+							const body = await textToDoc(node.value, {
+								parser: 'typescript',
+							});
+							// Drop the program's trailing hardline; printElement places the
+							// closing tag on its own line already.
+							return stripTrailingHardline(body);
+						} catch {
+							// A body that doesn't parse (e.g. mid-edit code) is an expected
+							// state, not an error: keep it verbatim and stay quiet.
+							return replaceEndOfLine(node.value);
+						}
+					};
+				}
+			}
+
 			return null;
 		},
 		/**
@@ -161,6 +185,23 @@ export const printers = {
 	},
 };
 
+/**
+ * Raw-text `<script>` element: the parser stores the verbatim JS/TS body on
+ * `content` and mirrors it as a single JSXText child. Checking the tag name
+ * alongside `content` matches the other raw-aware consumers (the Ripple
+ * transforms, the compiler's script regions).
+ * @param {AST.TSRXJSXElement | AST.JSXStyleElement | null | undefined} node
+ * @returns {boolean}
+ */
+function isRawScriptElement(node) {
+	return (
+		node?.type === 'JSXElement' &&
+		node.openingElement?.name?.type === 'JSXIdentifier' &&
+		node.openingElement.name.name === 'script' &&
+		typeof node.content === 'string'
+	);
+}
+
 /**
  * Format a string literal according to Prettier options
  * @param {string | number | bigint | boolean | RegExp | null | undefined} value - value to format
@@ -362,6 +403,16 @@ function binaryExpressionNeedsParens(node, parent) {
 		if (nodePrecedence === parentPrecedence && node.operator !== parent.operator) {
 			return true;
 		}
+		if (nodePrecedence === parentPrecedence) {
+			// Same precedence, same operator: dropping the parens regroups a
+			// left-associative chain (`a - (b - c)` !== `a - b - c`; even `+` is
+			// non-associative once strings are involved), so the RIGHT operand
+			// keeps its parens. `**` is right-associative — there it's the LEFT
+			// operand that must keep them.
+			if (parent.operator === '**' ? parent.left === node : parent.right === node) {
+				return true;
+			}
+		}
 	}
 
 	return false;
@@ -5861,6 +5912,24 @@ function printJSXElement(node, path, options, print) {
 		{ shouldBreak: shouldForceBreak },
 	);
 
+	// Raw-text `<script>` element: the body lives on `node.content`, mirrored as a
+	// single JSXText child (see the parser's `#parseScriptElement`). Print that
+	// child — embed() formats it as TypeScript — in a block layout, bypassing the
+	// generic children path so the body is never whitespace-merged as markup text.
+	if (isRawScriptElement(node)) {
+		if (!hasChildren) {
+			return [openingTag, '</', tagName, '>'];
+		}
+		return group([
+			openingTag,
+			indent([hardline, path.call(print, 'children', 0)]),
+			hardline,
+			'</',
+			tagName,
+			'>',
+		]);
+	}
+
 	// Comments before `</tag>` and the comments of a comment-only element.
 	const { closingCommentDocs, innerCommentDocs } = collectElementBodyCommentDocs(
 		/** @type {AST.TSRXJSXElement} */ (node),

package/src/index.test.js

@@ -2285,6 +2285,42 @@ const program =
 			expect(result).toBeWithNewline(expected);
 		});
 
+		it('should keep parens around the right operand of a same-operator subtraction', async () => {
+			const expected = `const d = a - (b - c);`;
+
+			const result = await format(expected, { singleQuote: true, printWidth: 100 });
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('should keep parens around the right operand of a same-operator division', async () => {
+			const expected = `const d = a / (b / c);`;
+
+			const result = await format(expected, { singleQuote: true, printWidth: 100 });
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('should keep parens around a right-side addition under string concatenation', async () => {
+			const expected = `const s = 'x' + (n + 1);`;
+
+			const result = await format(expected, { singleQuote: true, printWidth: 100 });
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('should drop redundant parens around the left operand of a same-operator addition', async () => {
+			const input = `const s = (a + b) + c;`;
+			const expected = `const s = a + b + c;`;
+
+			const result = await format(input, { singleQuote: true, printWidth: 100 });
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('should keep parens around the left operand of exponentiation', async () => {
+			const expected = `const p = (a ** b) ** c;`;
+
+			const result = await format(expected, { singleQuote: true, printWidth: 100 });
+			expect(result).toBeWithNewline(expected);
+		});
+
 		it('should have parents around low-precedence logical expression', async () => {
 			const input = `files = [...files ?? [], ...dt.files];
 files = [...(files ?? []), ...dt.files];`;
@@ -5583,13 +5619,49 @@ render(App);`;
 			expect(result).toBeWithNewline(expected);
 		});
 
-		it('should preserve <script> tags', async () => {
-			const expected = `<script>const i = 2;</script>`;
+		it('should format <script> bodies as JS in a block layout', async () => {
+			const expected = `<script>
+  const i = 2;
+</script>`;
 
-			const result = await format(expected, { singleQuote: true, printWidth: 100 });
+			const result = await format(`<script>const i = 2;</script>`, {
+				singleQuote: true,
+				printWidth: 100,
+			});
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('should format a TypeScript <script> body with prettier options applied', async () => {
+			const expected = `<script type="text/typescript">
+  const n: number = 1 < 2 ? 3 : 4;
+  if (n < 2) {
+    go('now');
+  }
+</script>`;
+
+			const source = `<script type="text/typescript">const n:number=1<2?3:4;
+if(n<2){go("now")}</script>`;
+
+			const result = await format(source, { singleQuote: true, printWidth: 100 });
 			expect(result).toBeWithNewline(expected);
 		});
 
+		it('should be idempotent when reformatting a formatted <script> body', async () => {
+			const once = await format(`<script>const i = 2;</script>`, {
+				singleQuote: true,
+				printWidth: 100,
+			});
+			const twice = await format(once, { singleQuote: true, printWidth: 100 });
+			expect(twice).toBe(once);
+		});
+
+		it('should keep an unparseable <script> body verbatim', async () => {
+			const expected = `<script>const broken = ;</script>`;
+
+			const result = await format(expected, { singleQuote: true, printWidth: 100 });
+			expect(result).toContain('const broken = ;');
+		});
+
 		it('should preserve the blank line between a function and text literal sibling inside element', async () => {
 			const expected = `function Something({ children }) {
   const test = 'yo';