fix: ensure bind get/set is broken up correctly when too long (#480)

fixes #479

Author: dummdidumm

CHANGELOG.md

@@ -1,5 +1,9 @@
 # prettier-plugin-svelte changelog
 
+## 3.3.3 (unreleased)
+
+-   (fix) Svelte 5: ensure bind get/set is broken up correctly when too long
+
 ## 3.3.2
 
 -   (fix) Svelte 5: handle type annotations on Svelte control flow blocks

src/embed.ts

@@ -128,9 +128,11 @@ export function embed(path: FastPath, _options: Options) {
             printJS(parent, 'expression', {});
             break;
         case 'ConstTag':
-        case 'Binding':
             printJS(parent, 'expression', { removeParentheses: true });
             break;
+        case 'Binding':
+            printJS(parent, 'expression', { removeParentheses: true, surroundWithSoftline: true });
+            break;
         case 'RenderTag':
             if (node === parent.expression) {
                 // TODO: remove this if block at some point, snippet API changed in .next-..
@@ -196,6 +198,9 @@ export function embed(path: FastPath, _options: Options) {
                         throw new Error('Prettier AST changed, asFunction logic needs to change');
                     }
                 }
+                if (node.surroundWithSoftline) {
+                    docs = group(indent([softline, group(docs), dedent(softline)]));
+                }
                 return docs;
             } catch (e) {
                 return getText(node, options, true);
@@ -409,6 +414,7 @@ function printJS(
         forceSingleQuote?: boolean;
         forceSingleLine?: boolean;
         removeParentheses?: boolean;
+        surroundWithSoftline?: boolean;
     },
 ) {
     const part = node[name] as BaseNode | undefined;
@@ -419,4 +425,5 @@ function printJS(
     part.forceSingleQuote = options.forceSingleQuote;
     part.forceSingleLine = options.forceSingleLine;
     part.removeParentheses = options.removeParentheses;
+    part.surroundWithSoftline = options.surroundWithSoftline;
 }

src/print/nodes.ts

@@ -11,6 +11,8 @@ export interface BaseNode {
     forceSingleLine?: boolean;
     /** Whether or not to remove outer `()` when printing as JS */
     removeParentheses?: boolean;
+    /** Whether or not to surround the result with a group and softline so that an exceeding print with keeps the output on the same line, if possible */
+    surroundWithSoftline?: boolean;
 }
 
 export interface FragmentNode extends BaseNode {

test/printer/samples/binding-get-set.html.skip

@@ -1,3 +1,20 @@
 <input bind:value={() => value, (v) => (value = v)} />
 
 <input bind:value={get, set} />
+
+<input
+    bind:value={binding_on_a_separate_line123, binding_on_a_separate_line123}
+/>
+
+<input
+    bind:value={
+        binding_value_on_a_separate_line123, binding_value_on_a_separate_line123
+    }
+/>
+
+<input
+    bind:value={
+        () => getter_setter_each_need_own_line,
+        (v) => (getter_setter_each_need_own_line = v)
+    }
+/>