Make print() break long List and Object Values over multiple line

Author: dylanowen

src/language/__tests__/printer-test.ts

@@ -110,6 +110,64 @@ describe('Printer: Query document', () => {
     `);
   });
 
+  it('puts large object values on multiple lines if line is long (> 80 chars)', () => {
+    const printed = print(
+      parse(
+        '{trip(obj:{wheelchair:false,smallObj:{a: 1},largeObj:{wheelchair:false,smallObj:{a: 1},arriveBy:false,includePlannedCancellations:true,transitDistanceReluctance:2000,anotherLongFieldName:"Lots and lots and lots and lots of text"},arriveBy:false,includePlannedCancellations:true,transitDistanceReluctance:2000,anotherLongFieldName:"Lots and lots and lots and lots of text"}){dateTime}}',
+      ),
+    );
+
+    expect(printed).to.equal(dedent`
+      {
+        trip(
+          obj: {
+            wheelchair: false,
+            smallObj: { a: 1 },
+            largeObj: {
+              wheelchair: false,
+              smallObj: { a: 1 },
+              arriveBy: false,
+              includePlannedCancellations: true,
+              transitDistanceReluctance: 2000,
+              anotherLongFieldName: "Lots and lots and lots and lots of text"
+            },
+            arriveBy: false,
+            includePlannedCancellations: true,
+            transitDistanceReluctance: 2000,
+            anotherLongFieldName: "Lots and lots and lots and lots of text"
+          }
+        ) {
+          dateTime
+        }
+      }
+    `);
+  });
+
+  it('puts large list values on multiple lines if line is long (> 80 chars)', () => {
+    const printed = print(
+      parse(
+        '{trip(list:[["small array", "small", "small"], ["Lots and lots and lots and lots of text", "Lots and lots and lots and lots of text", "Lots and lots and lots and lots of text"]]){dateTime}}',
+      ),
+    );
+
+    expect(printed).to.equal(dedent`
+      {
+        trip(
+          list: [
+            ["small array", "small", "small"],
+            [
+              "Lots and lots and lots and lots of text",
+              "Lots and lots and lots and lots of text",
+              "Lots and lots and lots and lots of text"
+            ]
+          ]
+        ) {
+          dateTime
+        }
+      }
+    `);
+  });
+
   it('Legacy: prints fragment with variable directives', () => {
     const queryASTWithVariableDirective = parse(
       'fragment Foo($foo: TestType @test) on TestType @testDirective { id }',

src/language/printer.ts

@@ -148,8 +148,22 @@ const printDocASTReducer: ASTReducer<string> = {
   BooleanValue: { leave: ({ value }) => (value ? 'true' : 'false') },
   NullValue: { leave: () => 'null' },
   EnumValue: { leave: ({ value }) => value },
-  ListValue: { leave: ({ values }) => '[' + join(values, ', ') + ']' },
-  ObjectValue: { leave: ({ fields }) => '{ ' + join(fields, ', ') + ' }' },
+  ListValue: {
+    leave: ({ values }) => {
+      if (values.reduce((t, v) => t + v.length + 2, 0) > MAX_LINE_LENGTH) {
+        return '[\n' + indent(join(values, ',\n')) + '\n]';
+      }
+      return '[' + join(values, ', ') + ']';
+    },
+  },
+  ObjectValue: {
+    leave: ({ fields }) => {
+      if (fields.reduce((t, f) => t + f.length + 2, 0) > MAX_LINE_LENGTH) {
+        return '{\n' + indent(join(fields, ',\n')) + '\n}';
+      }
+      return '{ ' + join(fields, ', ') + ' }';
+    },
+  },
   ObjectField: { leave: ({ name, value }) => name + ': ' + value },
 
   // Directive