feat(graphql): add graphql schema autoloading support

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-oop",
-  "version": "0.6.8",
+  "version": "0.7.0-beta",
   "description": "A library based on Model-Repository patterns for Vue components. Usable for GraphQL and REST APIs.",
   "keywords": [
     "collections",
@@ -44,6 +44,7 @@
   },
   "dependencies": {
     "collect.js": "^4.25.0",
+    "get-graphql-schema": "^2.1.2",
     "graphql": "^15.0.0",
     "graphql-tag": "^2.10.3",
     "lodash.camelcase": "^4.3.0",
@@ -108,5 +109,6 @@
       "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
     }
   },
-  "snyk": true
+  "snyk": true,
+  "sideEffects": false
 }

src/index.ts

@@ -1,22 +1,31 @@
 /*!
- * VueOOP.js v0.2.1
- * (c) 2017-2019 Serhii Matrunchyk
+ * VueOOP
+ * (c) 2017-2020 Serhii Matrunchyk
  * Released under the MIT License.
  */
 import _Vue from 'vue';
 import Model from './models/Model';
 import Repository from './repositories/Repository';
 import Registry from './Registry';
 import * as Utils from './utils';
-import { DocumentNode } from "graphql";
+import { DocumentNode, buildClientSchema } from "graphql";
+import { fetchIntrospectionSchema } from './utils';
 
 const registry = Registry.getInstance();
 
 registry.set('Model', Model);
 registry.set('Repository', Repository);
 
+export interface IVueOOPOptions {
+  rest?: boolean;
+  graphql?: boolean;
+  schema?: DocumentNode;
+  schemaUrl?: string;
+  debug?: boolean;
+}
+
 // istanbul ignore next
-export class VueOOPOptions {
+export class VueOOPOptions implements IVueOOPOptions {
   /**
    * Use REST plugin.
    *
@@ -38,6 +47,13 @@ export class VueOOPOptions {
    */
   schema: DocumentNode = null;
 
+  /**
+   * URL to fetch introspection GraphQL Schema from.
+   *
+   * @type {null|string}
+   */
+  schemaUrl: string = null;
+
   /**
    * Debug mode
    *
@@ -46,14 +62,21 @@ export class VueOOPOptions {
   debug = false;
 }
 
-function VueOOP<VueOOPOptions>(Vue: typeof _Vue, options?: VueOOPOptions): void {
+async function VueOOP<VueOOPOptions>(Vue: typeof _Vue, options?: VueOOPOptions): Promise<void> {
   const config = {
     rest: true,
     graphql: false,
     schema: null,
+    schemaUrl: null,
     debug: false,
     ...options,
-  };
+  } as IVueOOPOptions;
+
+  if (config.schemaUrl && config.debug) {
+    const test = await fetchIntrospectionSchema(config.schemaUrl).then(buildClientSchema.bind(null));
+    console.log(test);
+    console.log(config.schema);
+  }
 
   registry.set('Config', config);
 

src/utils.ts

@@ -1,6 +1,7 @@
-import { ObjectTypeDefinitionNode, DocumentNode } from 'graphql';
+import { ObjectTypeDefinitionNode, DocumentNode, IntrospectionQuery } from 'graphql';
 import { Config, KeyValueUnknown, ResolvingRESTOptions } from './typings';
 import { Vue } from 'vue/types/vue';
+import { getIntrospectionQuery } from 'graphql';
 import Registry from './Registry';
 import UnexpectedException from './models/Exceptions/UnexpectedException';
 
@@ -207,3 +208,13 @@ export async function getUrl(_opts: ResolvingRESTOptions) {
 export function stripObject(obj) {
   return JSON.parse(JSON.stringify(obj, (k, v) => (k === 'loading' ? undefined : v)));
 }
+
+export function fetchIntrospectionSchema(url: string): Promise<IntrospectionQuery> {
+  return fetch(url, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ query: getIntrospectionQuery })
+  })
+    .then(res => res.json())
+    .then(res => res.data);
+}