Help prevent arrays with complex elements from being trashed #93

formatter/changelog.md

@@ -1,5 +1,9 @@
 # Changelog
 
+## 2.1.2
+
+- Improves directive array formatting to prevent trashing complex input (#93)
+
 ## 2.1.1
 
 - Corrects an issue preventing `@hasSection` from formatting correctly (#92)

formatter/package.json

@@ -1,6 +1,6 @@
 {
     "name": "prettier-plugin-blade",
-    "version": "2.1.1",
+    "version": "2.1.2",
     "description": "A Prettier plugin to format Laravel Blade templates",
     "repository": {
         "type": "git",

src/document/printers/directivePrinter.ts

@@ -17,6 +17,21 @@ export class DirectivePrinter {
         'if', 'elseif', 'unless', 'while', 'for', 'foreach', 'forelse'
     ];
 
+    private static canUseSimpleParser(value: string): boolean {
+        // Quick work around for now.
+        // Likely remove the prettier workaround logic in the next major version to save headache.
+        if (
+            value.includes('//') || value.includes('/**') ||
+            value.includes('?') || value.includes(':') ||
+            (value.includes('(') && value.includes(')')) ||
+            (value.includes('{') && value.includes('}'))
+        ) {
+            return false;
+        }
+
+        return true;
+    }
+
     private static getReasonableDirectivePhpOptions(directive: DirectiveNode, phpOptions: ParserOptions): ParserOptions {
         // We will override the traillingCommaPHP setting within condition-like
         // directives; if we don't we end up with rather ugly @if(...) blocks
@@ -96,7 +111,10 @@ export class DirectivePrinter {
                         trimShift = true;
 
                     const phpOptions = getPhpOptions();
-                    if (params.startsWith('[') && params.endsWith(']') && directive.startPosition?.line != directive.endPosition?.line) {
+                    if (
+                            params.startsWith('[') && params.endsWith(']') && directive.startPosition?.line != directive.endPosition?.line &&
+                            DirectivePrinter.canUseSimpleParser(params)
+                        ) {
                         let phpInput = '<?php ' + params;
                         const lineWrapWorkaround = preparePrettierWorkaround(phpInput);
 

src/test/formatter_directives.test.ts

@@ -586,4 +586,56 @@ asdf
         assert.strictEqual(out, expected);
         assert.strictEqual(out2, expected);
     });
+
+    test('it does not trash comments inside directive args', async () => {
+        const template = `<img
+@class([
+  // This is valid a comment.
+  $coverUrl ? "object-center" :"object-left-top",
+])
+/>`;
+        const expected = `<img
+    @class([
+        // This is valid a comment.
+        $coverUrl ? "object-center" : "object-left-top",
+    ])
+/>
+`;
+        let result = await formatBladeString(template);
+
+        assert.strictEqual(result, expected);
+
+        for (let i = 0; i < 5; i++) {
+            result = await formatBladeString(result);
+
+            assert.strictEqual(result, expected);
+        }
+    });
+
+    test('it does not remove whitespace complicated directive args', async () => {
+        const template = `<img
+@class([
+  $coverUrl ? "object-center" :"object-left-top",
+])
+/>`;
+        // Unfortunately this will be the result.
+        const expected = `<img @class([$coverUrl ? "object-center" : "object-left-top"]) />
+`;
+        const result = await formatBladeString(template);
+        assert.strictEqual(result, expected);
+    });
+
+    test('the manual prettier array workaround works', async () => {
+        const template = `<img
+@class([
+  $coverUrl ? "object-center" :"object-left-top", //
+])
+/>`;
+        const expected = `<img @class([
+    $coverUrl ? "object-center" : "object-left-top", //
+]) />
+`;
+        const result = await formatBladeString(template);
+        assert.strictEqual(result, expected);
+    });
 });