1) Added the following support: Converts a JavaScript object into a valid query, including single directives with args, so long as any variables used are enclosed in a string with '$' included.

2) Updated linting rules, and minor refactor following.

Author: joeflack4

src/__tests__/jsonToGraphQLQuery.tests.ts

@@ -146,25 +146,23 @@ describe('jsonToGraphQL()', () => {
 }`);
     });
 
-    it('Converts a JavaScript object into a valid Apollo query, including single directives with no arguments.', () => {
+    it('Converts a JavaScript object into a valid query, including a single directive w/ no arguments.', () => {
         interface ILooseObject { [key: string]: any; }
         let input: ILooseObject = {
             __typename: 'everyday-health-focuses',
             diet: {
                 __typename: 'diet',
                 id: 'diet',
                 options: {
-                    // tslint:disable-next-line:object-literal-key-quotes
                     __typename: 'diet-options',
-                    'calorie-count': {
+                    calorieCount: {
                         __typename: 'calorie-count',
                         category: 'Diet',
                         icon: 'fa fa-question-circle',
                         id: 'calorie-count',
                         selected: false,
                         text: 'Calorie Count'
                     },
-                    // tslint:disable-next-line:object-literal-key-quotes
                     mood: {
                         __typename: 'mood',
                         category: 'Diet',
@@ -173,7 +171,6 @@ describe('jsonToGraphQL()', () => {
                         selected: false,
                         text: 'Mood'
                     },
-                    // tslint:disable-next-line:object-literal-key-quotes
                     weight: {
                         __typename: 'weight',
                         category: 'Diet',
@@ -197,14 +194,42 @@ describe('jsonToGraphQL()', () => {
             input[key]['__directives'] = { client: true, };
         });
         input = {query: input};
-        // Do I want to add some keysToStrip functionality separately?
-        // - const input = jsonToGraphqlQuery(preInput, { keysToStrip: ['__typename'] });
-        const expected = 'query { diet @client { id options { calorie-count { category ' +
+        const expected = 'query { diet @client { id options { calorieCount { category ' +
         'icon id text } mood { category icon id text } weight { category icon id text } } ' +
         'title } someOtherAbritraryKey @client { arb1 arb2 } }';
         expect(jsonToGraphQLQuery(input)).to.equal(expected);
     });
 
+    it('Converts a JavaScript object into a valid query, including single directives ' +
+    'with args, so long as any variables used are enclosed in a string with "$" included.', () => {
+        interface ILooseObject { [key: string]: any; }
+        let input: ILooseObject = {
+            someOtherAbritraryKey: {
+                __typename: 'someArbitraryObjType',
+                arb1: 'arbitrary value',
+                arb2: 'some other arbitrary value'
+            }
+        };
+        Object.keys(input)
+        .filter(filterNonConfigFields)
+        .forEach((key) => {
+            input[key]['__directives'] = { include: {if: '$isAwesome'}, };
+        });
+        input = {query: input};
+        const expected = 'query { someOtherAbritraryKey @include(if: $isAwesome) { arb1 arb2 } }';
+        expect(jsonToGraphQLQuery(input)).to.equal(expected);
+    });
+
+    // TODO
+    // it('Converts a JavaScript object into a valid query, including *multiple* directives ' +
+    // 'with args, so long as any variables used are enclosed in a string with "$" included.', () => {
+    // });
+
+    // TODO
+    // it('Creates a query, stripping/ignoring certain, specified keys.', () => {
+    // // Example usage: jsonToGraphqlQuery(preInput, { keysToStrip: ['__typename'] });
+    // });
+
     it('converts a query with nested objects', () => {
         const query = {
             query: {

src/jsonToGraphQLQuery.ts

@@ -46,16 +46,23 @@ function buildVariables(varsObj: any): string {
 }
 
 function buildDirectives(dirsObj: any): string {
-    const numDirectives = Object.keys(dirsObj).length;
-    if (numDirectives > 1) {
-        throw new Error(numDirectives.toString());
+    const directiveName = Object.keys(dirsObj)[0];
+    const directiveValue = dirsObj[directiveName];
+    if (typeof directiveValue === 'boolean') {
+        return directiveName;
+    }
+    else if (typeof directiveValue === 'object') {
+        const args = [];
+        for (const argName in directiveValue) {
+            const argVal = stringify(directiveValue[argName]).replace(/"/g, '');
+            args.push(`${argName}: ${argVal}`);
+        }
+        return `${directiveName}(${args.join(', ')})`;
+    }
+    else {
+        throw new Error(`Unsupported type for directive: ${typeof directiveValue}. Types allowed: object, boolean.\n` +
+        `Offending object: ${JSON.stringify(dirsObj)}`);
     }
-    // const args = [];
-    // for (const varName in dirsObj) {
-    //     args.push(`@${varName}: ${dirsObj[varName]}`);
-    // }
-    // return args.join(', ');
-    return '@' + Object.keys(dirsObj)[0];
 }
 
 function getIndent(level: number): string {
@@ -83,15 +90,14 @@ function convertQuery(node: any, level: number, output: Array<[ string, number ]
                 token = `${key} (${buildVariables(node[key].__variables)})`;
             }
             else if (typeof node[key].__directives === 'object') {
-                // TODO: Add support for multiple directives on one node, if that's a thing.
-                try {
-                    token = `${key} ${buildDirectives(node[key].__directives)}`;
-                } catch (e) {
-                    e = e.toString().replace(/Error: /, '');
+                // TODO: Add support for multiple directives on one node.
+                const numDirectives = Object.keys(node[key].__directives).length;
+                if (numDirectives > 1) {
                     throw new Error(`Too many directives. The object/key ` +
-                    `'${Object.keys(node[key])[0]}' had ${e} directives, ` +
+                    `'${Object.keys(node[key])[0]}' had ${numDirectives} directives, ` +
                     `but only 1 directive per object/key is supported at this time.`);
                 }
+                token = `${key} @${buildDirectives(node[key].__directives)}`;
             }
             else {
                 token = `${key}`;

tslint.json

@@ -4,7 +4,8 @@
     ],
     "rules": {
        "trailing-comma": [false],
-       "object-literal-sort-keys": [true, "as-needed"],
+       "object-literal-sort-keys": false,
+       "object-literal-key-qhotes": [true, "as-needed"],
        "ordered-imports": false,
        "no-console": [false],
        "no-unused-new": false,