Add new option pugPreserveWhitespace (#567)

Author: alexis-aquanty

docs/guide/pug-specific-options.md

@@ -543,6 +543,54 @@ Output:
 
 ---
 
+## Preserve whitespace
+
+`pugPreserveWhitespace`
+
+### Description
+
+Define if additional whitespace should be preserved in text.
+
+### Options
+
+**Type:** `boolean`  
+**Default:** `true`
+
+#### `false`
+
+Input:
+
+```pug
+p
+  |  whitespace gets removed
+```
+
+Output:
+
+```pug
+p
+  | whitespace gets removed
+```
+
+#### `true`
+
+Input:
+
+```pug
+p
+  |  whitespace does not get removed
+```
+
+Output:
+
+```pug
+p
+  |
+  | whitespace does not get removed
+```
+
+---
+
 ## Indent Closing Bracket in Multiline Elements
 
 `pugClosingBracketIndentDepth`

src/options/converge.ts

@@ -51,6 +51,7 @@ export function convergeOptions(
     pugFramework: options.pugFramework,
     pugExplicitDiv: options.pugExplicitDiv,
     pugPreserveAttributeBrackets: options.pugPreserveAttributeBrackets,
+    pugPreserveWhitespace: options.pugPreserveWhitespace,
     pugClosingBracketIndentDepth: options.pugClosingBracketIndentDepth ?? 0,
   };
 }

src/options/index.ts

@@ -27,6 +27,7 @@ import { PUG_EXPLICIT_DIV } from './pug-explicit-div';
 import { PUG_FRAMEWORK } from './pug-framework';
 import { PUG_ID_NOTATION } from './pug-id-notation';
 import { PUG_PRESERVE_ATTRIBUTE_BRACKETS } from './pug-preserve-attribute-brackets';
+import { PUG_PRESERVE_WHITESPACE } from './pug-preserve-whitespace';
 import { PUG_SINGLE_FILE_COMPONENT_INDENTATION } from './pug-single-file-component-indentation';
 import {
   PUG_WRAP_ATTRIBUTES_PATTERN,
@@ -62,6 +63,7 @@ export const options: SupportOptions = {
   pugSingleFileComponentIndentation: PUG_SINGLE_FILE_COMPONENT_INDENTATION,
   pugFramework: PUG_FRAMEWORK,
   pugPreserveAttributeBrackets: PUG_PRESERVE_ATTRIBUTE_BRACKETS,
+  pugPreserveWhitespace: PUG_PRESERVE_WHITESPACE,
 };
 
 export { CATEGORY_PUG } from './constants';

src/options/pug-preserve-whitespace.ts

@@ -0,0 +1,12 @@
+import type { BooleanSupportOption } from 'prettier';
+import { CATEGORY_PUG } from './constants';
+
+/** Pug preserve whitespace. */
+export const PUG_PRESERVE_WHITESPACE: BooleanSupportOption = {
+  // since: '3.3.0',
+  category: CATEGORY_PUG,
+  type: 'boolean',
+  // TODO @alexis-aquanty 2025-03-31: considering defaulting to false in v4
+  default: true,
+  description: 'Preserve additional whitespace in text.',
+};

src/options/types.ts

@@ -64,4 +64,6 @@ export interface PugParserOptions
   pugFramework: PugFramework;
 
   pugPreserveAttributeBrackets: boolean;
+
+  pugPreserveWhitespace: boolean;
 }

src/prettier.d.ts

@@ -148,5 +148,11 @@ declare module 'prettier' {
      * @default false
      */
     pugPreserveAttributeBrackets?: PugParserOptions['pugPreserveAttributeBrackets'];
+    /**
+     * Preserve additional whitespace in text.
+     *
+     * @default true
+     */
+    pugPreserveWhitespace?: PugParserOptions['pugPreserveWhitespace'];
   }
 }

src/printer.ts

@@ -127,7 +127,6 @@ export interface PugPrinterOptions {
   readonly pugSemi: boolean;
   readonly bracketSameLine: boolean;
   readonly pugBracketSameLine: boolean;
-
   readonly pugAttributeSeparator: PugAttributeSeparator;
   readonly pugCommentPreserveSpaces: PugCommentPreserveSpaces;
   readonly pugSortAttributes: PugSortAttributes;
@@ -144,6 +143,7 @@ export interface PugPrinterOptions {
   readonly pugFramework: PugFramework;
   readonly pugExplicitDiv: boolean;
   readonly pugPreserveAttributeBrackets: boolean;
+  readonly pugPreserveWhitespace: boolean;
   readonly pugClosingBracketIndentDepth: PugClosingBracketIndentDepth;
 }
 
@@ -1680,7 +1680,7 @@ export class PugPrinter {
       switch (this.previousToken?.type) {
         case 'newline': {
           result += this.indentString.repeat(this.indentLevel);
-          if (/^ .+$/.test(val)) {
+          if (this.options.pugPreserveWhitespace && /^ .+$/.test(val)) {
             result += '|\n';
             result += this.indentString.repeat(this.indentLevel);
           }
@@ -1699,13 +1699,16 @@ export class PugPrinter {
         case 'indent':
         case 'outdent': {
           result += this.computedIndent;
-          if (/^ .+$/.test(val)) {
+          if (this.options.pugPreserveWhitespace && /^ .+$/.test(val)) {
             result += '|\n';
             result += this.indentString.repeat(this.indentLevel);
           }
 
           result += '|';
-          if (/.*\S.*/.test(token.val)) {
+          if (
+            /.*\S.*/.test(token.val) ||
+            this.nextToken?.type === 'start-pug-interpolation'
+          ) {
             result += ' ';
           }
 
@@ -2046,6 +2049,7 @@ export class PugPrinter {
   ): string {
     let result: string = '';
     if (
+      this.pipelessText &&
       this.tokens[this.currentIndex - 2]?.type === 'newline' &&
       this.previousToken?.type === 'text' &&
       this.previousToken.val.trim().length === 0

tests/issues/issue-486/formatted.pug

@@ -0,0 +1,3 @@
+div
+  | #[b foo]
+  | #[b bar]

tests/issues/issue-486/issue-486.test.ts

@@ -0,0 +1,9 @@
+import { compareFiles } from 'tests/common';
+import { describe, expect, it } from 'vitest';
+
+describe('Issues', () => {
+  it('should output correct whitespace for interpolation within piped text', async () => {
+    const { expected, actual } = await compareFiles(import.meta.url);
+    expect(actual).toBe(expected);
+  });
+});

tests/issues/issue-486/unformatted.pug

@@ -0,0 +1,3 @@
+div
+  |#[b foo]
+  |     #[b bar]