Don't fetch schema multiple times (#52)

Author: phortx

dist/vuex-orm-graphql.esm.js

@@ -27964,32 +27964,39 @@ var Context = /** @class */ (function () {
     };
     Context.prototype.loadSchema = function () {
         return __awaiter$1(this, void 0, void 0, function () {
-            var context, result;
+            var _this = this;
             return __generator$1(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        if (!!this.schema) return [3 /*break*/, 2];
-                        this.logger.log('Fetching GraphQL Schema initially ...');
-                        if (this.options.connectionQueryMode) {
-                            this.connectionQueryMode = this.options.connectionQueryMode;
-                        }
-                        else {
-                            this.connectionQueryMode = 'auto';
-                        }
-                        context = {
-                            headers: { 'X-GraphQL-Introspection-Query': 'true' }
-                        };
-                        return [4 /*yield*/, this.apollo.simpleQuery(introspectionQuery, {}, true, context)];
-                    case 1:
-                        result = _a.sent();
-                        this.schema = new Schema(result.data.__schema);
-                        this.logger.log('GraphQL Schema successful fetched', result);
-                        this.logger.log('Starting to process the schema ...');
-                        this.processSchema();
-                        this.logger.log('Schema procession done!');
-                        _a.label = 2;
-                    case 2: return [2 /*return*/, this.schema];
+                if (!this.schemaWillBeLoaded) {
+                    this.schemaWillBeLoaded = new Promise(function (resolve, reject) { return __awaiter$1(_this, void 0, void 0, function () {
+                        var context, result;
+                        return __generator$1(this, function (_a) {
+                            switch (_a.label) {
+                                case 0:
+                                    this.logger.log('Fetching GraphQL Schema initially ...');
+                                    if (this.options.connectionQueryMode) {
+                                        this.connectionQueryMode = this.options.connectionQueryMode;
+                                    }
+                                    else {
+                                        this.connectionQueryMode = 'auto';
+                                    }
+                                    context = {
+                                        headers: { 'X-GraphQL-Introspection-Query': 'true' }
+                                    };
+                                    return [4 /*yield*/, this.apollo.simpleQuery(introspectionQuery, {}, true, context)];
+                                case 1:
+                                    result = _a.sent();
+                                    this.schema = new Schema(result.data.__schema);
+                                    this.logger.log('GraphQL Schema successful fetched', result);
+                                    this.logger.log('Starting to process the schema ...');
+                                    this.processSchema();
+                                    this.logger.log('Schema procession done!');
+                                    resolve(this.schema);
+                                    return [2 /*return*/];
+                            }
+                        });
+                    }); });
                 }
+                return [2 /*return*/, this.schemaWillBeLoaded];
             });
         });
     };

src/common/context.ts

@@ -141,14 +141,22 @@ export default class Context {
 
   /**
    * Instance of Apollo which cares about the communication with the graphql endpoint.
+   * @type {Apollo}
    */
   public apollo!: Apollo;
 
   /**
    * The graphql schema. Is null until the first request.
+   * @type {Schema}
    */
   public schema: Schema | undefined;
 
+  /**
+   * Tells if the schema is already loaded or the loading is currently processed.
+   * @type {boolean}
+   */
+  private schemaWillBeLoaded: Promise<Schema> | undefined;
+
   /**
    * Defines how to query connections. 'auto' | 'nodes' | 'edges' | 'plain'
    */
@@ -205,31 +213,35 @@ export default class Context {
   }
 
   public async loadSchema (): Promise<Schema> {
-    if (!this.schema) {
-      this.logger.log('Fetching GraphQL Schema initially ...');
+    if (!this.schemaWillBeLoaded) {
+      this.schemaWillBeLoaded = new Promise(async (resolve, reject) => {
+        this.logger.log('Fetching GraphQL Schema initially ...');
+
+        if (this.options.connectionQueryMode) {
+          this.connectionQueryMode = this.options.connectionQueryMode;
+        } else {
+          this.connectionQueryMode = 'auto';
+        }
 
-      if (this.options.connectionQueryMode) {
-        this.connectionQueryMode = this.options.connectionQueryMode;
-      } else {
-        this.connectionQueryMode = 'auto';
-      }
+        // We send a custom header along with the request. This is required for our test suite to mock the schema request.
+        const context = {
+          headers: { 'X-GraphQL-Introspection-Query': 'true' }
+        };
 
-      // We send a custom header along with the request. This is required for our test suite to mock the schema request.
-      const context = {
-        headers: { 'X-GraphQL-Introspection-Query': 'true' }
-      };
+        const result = await this.apollo.simpleQuery(introspectionQuery, {}, true, context);
+        this.schema = new Schema(result.data.__schema);
 
-      const result = await this.apollo.simpleQuery(introspectionQuery, {}, true, context);
-      this.schema = new Schema(result.data.__schema);
+        this.logger.log('GraphQL Schema successful fetched', result);
 
-      this.logger.log('GraphQL Schema successful fetched', result);
+        this.logger.log('Starting to process the schema ...');
+        this.processSchema();
+        this.logger.log('Schema procession done!');
 
-      this.logger.log('Starting to process the schema ...');
-      this.processSchema();
-      this.logger.log('Schema procession done!');
+        resolve(this.schema);
+      });
     }
 
-    return this.schema;
+    return this.schemaWillBeLoaded;
   }
 
   public processSchema () {