Merged PR 108503: Avoid sending another /load to the FE if one was already sent

Shahak Yosef · Shahak Yosef · commit 6754d961602d · 2020-08-31T11:36:18.000Z
A client has been reporting "content is not available" issues for some time.
We notice in their logs that several load requests are sent to the front end with only 66 millisecond between them.
We believe that this is causing a timing issue in the front end and so we add a throttle on the load requests.

## Notes for reviewers:
I am not sure if there can be any valid use case for multiple load requests in short intervals.
Can it negatively affect valid uses cases of bootstrap -&gt; embed -&gt; potentially reload flows?
diff --git a/dist/powerbi-client.d.ts b/dist/powerbi-client.d.ts
@@ -1,4 +1,4 @@
-/*! powerbi-client v2.14.0 | (c) 2016 Microsoft Corporation MIT */
+/*! powerbi-client v2.14.1 | (c) 2016 Microsoft Corporation MIT */
 declare module "util" {
     import { HttpPostMessage } from 'http-post-message';
     /**
@@ -93,6 +93,14 @@ declare module "util" {
      * Returns random number
      */
     export function getRandomValue(): number;
+    /**
+     * Returns the time interval between two dates in milliseconds
+     * @export
+     * @param {Date} start
+     * @param {Date} end
+     * @returns {number}
+     */
+    export function getTimeDiffInMilliseconds(start: Date, end: Date): number;
 }
 declare module "config" {
     /** @ignore */ /** */
@@ -301,6 +309,11 @@ declare module "embed" {
          * @hidden
          */
         frontLoadHandler: () => any;
+        /**
+         * The time the last /load request was sent
+         * @hidden
+         */
+        lastLoadRequest: Date;
         /**
          * Creates an instance of Embed.
          *
@@ -1208,13 +1221,6 @@ declare module "report" {
         private isMobileSettings(settings);
     }
 }
-declare module "defaults" {
-    import * as models from 'powerbi-models';
-    /** @hidden */
-    export abstract class Defaults {
-        static defaultQnaSettings: models.IQnaSettings;
-    }
-}
 declare module "create" {
     import * as service from "service";
     import * as models from 'powerbi-models';
diff --git a/dist/powerbi.js b/dist/powerbi.js
diff --git a/dist/powerbi.min.js b/dist/powerbi.min.js
diff --git a/gulpfile.js b/gulpfile.js
@@ -3,10 +3,8 @@ var ghPages = require('gulp-gh-pages'),
   header = require('gulp-header'),
   help = require('gulp-help-four'),
   rename = require('gulp-rename'),
-  concat = require('gulp-concat'),
   uglify = require('gulp-uglify'),
   replace = require('gulp-replace'),
-  sourcemaps = require('gulp-sourcemaps'),
   tslint = require("gulp-tslint"),
   ts = require('gulp-typescript'),
   flatten = require('gulp-flatten'),
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "powerbi-client",
-  "version": "2.14.0",
+  "version": "2.14.1",
   "description": "JavaScript library for embedding Power BI into your apps. Provides service which makes it easy to embed different types of components and an object model which allows easy interaction with these components such as changing pages, applying filters, and responding to data selection.",
   "main": "dist/powerbi.js",
   "typings": "dist/powerbi-client.d.ts",
@@ -34,14 +34,12 @@
     "del": "^2.2.2",
     "es6-promise": "^3.2.1",
     "gulp": "^4.0.2",
-    "gulp-concat": "^2.6.0",
     "gulp-flatten": "^0.2.0",
     "gulp-gh-pages": "^0.5.4",
     "gulp-header": "^1.8.7",
     "gulp-help-four": "^0.2.3",
     "gulp-rename": "^1.2.2",
     "gulp-replace": "^0.5.4",
-    "gulp-sourcemaps": "^1.6.0",
     "gulp-tslint": "^4.3.4",
     "gulp-typedoc": "^2.0.0",
     "gulp-typescript": "^2.12.1",
diff --git a/src/bookmarksManager.ts b/src/bookmarksManager.ts
@@ -1,13 +1,8 @@
 import * as service from './service';
 import * as embed from './embed';
 import * as models from 'powerbi-models';
-import * as wpmp from 'window-post-message-proxy';
-import * as hpm from 'http-post-message';
 import * as utils from './util';
 import * as errors from './errors';
-import { IPageNode, Page } from './page';
-import { Defaults } from './defaults';
-import { IReportLoadConfiguration } from 'powerbi-models';
 
 /**
  * APIs for managing the report bookmarks.
diff --git a/src/config.ts b/src/config.ts
@@ -1,6 +1,6 @@
 /** @ignore *//** */
 const config = {
-  version: '2.14.0',
+  version: '2.14.1',
   type: 'js'
 };
 
diff --git a/src/create.ts b/src/create.ts
@@ -2,7 +2,6 @@ import * as service from './service';
 import * as models from 'powerbi-models';
 import * as embed from './embed';
 import * as utils from './util';
-import { Defaults } from './defaults';
 
 /**
  * A Power BI Report creator component
diff --git a/src/dashboard.ts b/src/dashboard.ts
@@ -1,10 +1,6 @@
 import * as service from './service';
 import * as embed from './embed';
 import * as models from 'powerbi-models';
-import * as wpmp from 'window-post-message-proxy';
-import * as hpm from 'http-post-message';
-import * as utils from './util';
-import { Defaults } from './defaults';
 
 /**
  * A Dashboard node within a dashboard hierarchy
diff --git a/src/defaults.ts b/src/defaults.ts
diff --git a/src/embed.ts b/src/embed.ts
@@ -132,13 +132,13 @@ export abstract class Embed {
   static typeAttribute = 'powerbi-type';
   /** @hidden */
   static defaultEmbedHostName = "https://app.powerbi.com";
-  
+
   /** @hidden */
   static type: string;
-  
+
   /** @hidden */
   static maxFrontLoadTimes: number = 2;
- 
+
   /** @hidden */
   allowedEvents = [];
 
@@ -232,6 +232,12 @@ export abstract class Embed {
    */
   frontLoadHandler: () => any;
 
+  /**
+   * The time the last /load request was sent
+   * @hidden
+   */
+  lastLoadRequest: Date;
+
   /**
    * Creates an instance of Embed.
    *
@@ -338,9 +344,9 @@ export abstract class Embed {
   getCorrelationId(): Promise<string> {
     return this.service.hpm.get<string>(`/getCorrelationId`, { uid: this.config.uniqueId }, this.iframe.contentWindow)
       .then(response => response.body,
-      response => {
-        throw response.body;
-      });
+        response => {
+          throw response.body;
+        });
   }
 
   /**
@@ -387,13 +393,21 @@ export abstract class Embed {
       sdkVersion: sdkConfig.default.version
     };
 
+    const timeNow: Date = new Date();
+    if (this.lastLoadRequest && utils.getTimeDiffInMilliseconds(this.lastLoadRequest, timeNow) < 100) {
+      console.debug("Power BI SDK sent more than two /report/load requests in the last 100ms interval.");
+      return;
+    }
+
+    this.lastLoadRequest = timeNow;
+
     return this.service.hpm.post<void>(path, this.config, headers, this.iframe.contentWindow)
       .then(response => {
         return response.body;
       },
-      response => {
-        throw response.body;
-      });
+        response => {
+          throw response.body;
+        });
   }
 
   /**
@@ -827,9 +841,9 @@ export abstract class Embed {
     if (this.iframe.contentWindow == null)
       return;
 
-      return this.service.hpm.post<void>("/frontload/config", config, { uid: this.config.uniqueId }, this.iframe.contentWindow).then(response => {
-        return response.body;
-      },
+    return this.service.hpm.post<void>("/frontload/config", config, { uid: this.config.uniqueId }, this.iframe.contentWindow).then(response => {
+      return response.body;
+    },
       response => {
         throw response.body;
       });
diff --git a/src/qna.ts b/src/qna.ts
@@ -1,7 +1,6 @@
 import * as service from './service';
 import * as models from 'powerbi-models';
 import * as embed from './embed';
-import * as utils from './util';
 
 /**
  * The Power BI Q&A embed component
diff --git a/src/tile.ts b/src/tile.ts
@@ -1,8 +1,6 @@
 import * as service from './service';
 import * as models from 'powerbi-models';
 import * as embed from './embed';
-import * as utils from './util';
-import { Defaults } from './defaults';
 
 /**
  * The Power BI tile embed component
diff --git a/src/util.ts b/src/util.ts
@@ -120,7 +120,7 @@ export function generateUUID(): string {
   if (typeof performance !== 'undefined' && typeof performance.now === 'function') {
     d += performance.now();
   }
-  return 'xxxxxxxxxxxxxxxxxxxx'.replace(/[xy]/g, function (c) {    
+  return 'xxxxxxxxxxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
     // Generate a random number, scaled from 0 to 15.
     const r = (getRandomValue() % 16);
 
@@ -157,9 +157,9 @@ export function addParamToUrl(url: string, paramName: string, value: string): st
 export function isSavedInternal(hpm: HttpPostMessage, uid: string, contentWindow: Window): Promise<boolean> {
   return hpm.get<boolean>('/report/hasUnsavedChanges', { uid }, contentWindow)
     .then(response => !response.body,
-    response => {
-      throw response.body;
-    });
+      response => {
+        throw response.body;
+      });
 }
 
 /**
@@ -195,4 +195,15 @@ export function getRandomValue() {
   cryptoObj.getRandomValues(randomValueArray);
 
   return randomValueArray[0];
+}
+
+/**
+ * Returns the time interval between two dates in milliseconds
+ * @export
+ * @param {Date} start
+ * @param {Date} end
+ * @returns {number}
+ */
+export function getTimeDiffInMilliseconds(start: Date, end: Date): number {
+  return Math.abs(start.getTime() - end.getTime());
 }
diff --git a/src/visualDescriptor.ts b/src/visualDescriptor.ts
@@ -1,6 +1,6 @@
 import * as models from 'powerbi-models';
 import { IFilterable } from './ifilterable';
-import { IPageNode, Page } from './page';
+import { IPageNode } from './page';
 
 /**
  * A Visual node within a report hierarchy
diff --git a/test/test.spec.ts b/test/test.spec.ts
@@ -2795,7 +2795,7 @@ describe('SDK-to-HPM', function () {
     powerbi.wpmp.stop();
   });
 
-  beforeEach(function() {
+  beforeEach(function () {
     reportConfigurationBck = report.config;
     createConfigurationBck = create.config;
     dashboardEmbedConfigurationBck = dashboard.config;
@@ -2822,6 +2822,10 @@ describe('SDK-to-HPM', function () {
   });
 
   describe('report', function () {
+    beforeEach(() => {
+      report.lastLoadRequest = new Date(2018, 1, 1);
+    });
+
     describe('load', function () {
       it('report.load() sends POST /report/load with configuration in body', function () {
         // Arrange
@@ -3230,7 +3234,7 @@ describe('SDK-to-HPM', function () {
         // Act
         report.deletePage(name);
 
-        expect(spyHpm.delete).toHaveBeenCalledWith(`/report/pages/${name}`, { }, expectedHeaders, iframe.contentWindow);
+        expect(spyHpm.delete).toHaveBeenCalledWith(`/report/pages/${name}`, {}, expectedHeaders, iframe.contentWindow);
       });
     });
 
@@ -3571,6 +3575,7 @@ describe('SDK-to-HPM', function () {
         report.load()
           .then(() => {
             spyHpm.post.calls.reset();
+            report.lastLoadRequest = new Date(2018, 1, 1);
 
             // Act
             report.reload();
@@ -3766,6 +3771,7 @@ describe('SDK-to-HPM', function () {
         // Act
         let expectedConfiguration = utils.assign({}, dashboard.config, testData.loadConfiguration);
         dashboard.config = expectedConfiguration;
+        dashboard.lastLoadRequest = new Date(2018, 1, 1);
         dashboard.load();
 
         const expectedHeaders = {
@@ -4522,6 +4528,7 @@ describe('SDK-to-MockApp', function () {
             // Act
             let expectedConfiguration = utils.assign({}, report.config, testData.loadConfig);
             report.config = expectedConfiguration;
+            report.lastLoadRequest = new Date(2018, 1, 1);
             report.load()
               .catch(errors => {
                 // Assert
@@ -4549,6 +4556,7 @@ describe('SDK-to-MockApp', function () {
             // Act
             let expectedConfiguration = utils.assign({}, report.config, testData.loadConfig);
             report.config = expectedConfiguration;
+            report.lastLoadRequest = new Date(2018, 1, 1);
             report.load()
               .then(response => {
                 // Assert
