Merged PR 101002: Fixing bootstrap bug.

Fixing a bug where /report/embed message is sent before bootstrap is complete.

**Repo:**
1) Call bootstrap.
2) Call report.embed immediately.

**Timing:**
1) Bootstrap starts.
2) iframe is not loaded yet ('load') event is not fired to the SDK.
3) powerbi.embed starts
4) powerbi.embed calls embedExisting because iframe already exists - it's fine.
5) embedExisting calls embed::load method which sends /report/load message to the SDK
6) iframe is loaded (bootstrap is done).
7) ('load') event handler calls embed::load method which sends /report/load message to the SDK - AGAIN

**Expected:**
/report/load is called one time only.

**Acutal**
/report/load is called twice - first time before iframe is ready is a BUG.

**Fix**
Adding a flag which saves the state of the iframe (loaded/not loaded).
If iframe is not loaded, avoid sending the postMessage.
We need the load method to send the right config when it's called from 'load' event. For that, we save the last config per component, and post the load message with that config.

Author: ali-hamud

dist/powerbi-client.d.ts

@@ -1,4 +1,4 @@
-/*! powerbi-client v2.13.2 | (c) 2016 Microsoft Corporation MIT */
+/*! powerbi-client v2.13.3 | (c) 2016 Microsoft Corporation MIT */
 declare module "util" {
     import { HttpPostMessage } from 'http-post-message';
     /**
@@ -259,6 +259,15 @@ declare module "embed" {
          * @hidden
          */
         iframe: HTMLIFrameElement;
+        /**
+         * Saves the iframe state. Each iframe should be loaded only once.
+         * After first load, .embed will go into embedExisting path which will send
+         * a postMessage of /report/load instead of creating a new iframe.
+         *
+         * @type {boolean}
+         * @hidden
+         */
+        iframeLoaded: boolean;
         /**
          * Gets or sets the configuration settings for the Power BI embed component.
          *
@@ -376,7 +385,7 @@ declare module "embed" {
          * @param {boolean} phasedRender
          * @returns {Promise<void>}
          */
-        load(config: IEmbedConfigurationBase, phasedRender?: boolean): Promise<void>;
+        load(phasedRender?: boolean): Promise<void>;
         /**
          * Removes one or more event handlers from the list of handlers.
          * If a reference to the existing handle function is specified, remove the specific handler.
@@ -1479,7 +1488,7 @@ declare module "visual" {
          * @hidden
          */
         constructor(service: service.Service, element: HTMLElement, baseConfig: embed.IEmbedConfigurationBase, phasedRender?: boolean, isBootstrap?: boolean, iframe?: HTMLIFrameElement);
-        load(baseConfig: embed.IEmbedConfigurationBase, phasedRender?: boolean): Promise<void>;
+        load(phasedRender?: boolean): Promise<void>;
         /**
          * Gets the list of pages within the report - not supported in visual embed.
          *

dist/powerbi.js

@@ -1,6 +1,6 @@
 {
   "name": "powerbi-client",
-  "version": "2.13.2",
+  "version": "2.13.3",
   "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",

dist/powerbi.min.js

@@ -1,6 +1,6 @@
 /** @ignore *//** */
 const config = {
-  version: '2.13.2',
+  version: '2.13.3',
   type: 'js'
 };
 

package.json

@@ -175,6 +175,16 @@ export abstract class Embed {
    */
   iframe: HTMLIFrameElement;
 
+  /**
+   * Saves the iframe state. Each iframe should be loaded only once.
+   * After first load, .embed will go into embedExisting path which will send 
+   * a postMessage of /report/load instead of creating a new iframe.
+   *
+   * @type {boolean}
+   * @hidden
+   */
+  iframeLoaded: boolean;
+
   /**
    * Gets or sets the configuration settings for the Power BI embed component.
    *
@@ -244,6 +254,7 @@ export abstract class Embed {
     this.service = service;
     this.element = element;
     this.iframe = iframe;
+    this.iframeLoaded = false;
     this.embedtype = config.type.toLowerCase();
 
     this.populateConfig(config, isBootstrap);
@@ -358,27 +369,32 @@ export abstract class Embed {
    * @param {boolean} phasedRender
    * @returns {Promise<void>}
    */
-  load(config: IEmbedConfigurationBase, phasedRender?: boolean): Promise<void> {
-    if (!config.accessToken) {
+  load(phasedRender?: boolean): Promise<void> {
+    if (!this.config.accessToken) {
+      console.debug("Power BI SDK iframe is loaded but powerbi.embed is not called yet.");
+      return;
+    }
+
+    if (!this.iframeLoaded) {
+      console.debug("Power BI SDK is trying to post /report/load before iframe is ready.");
       return;
     }
 
-    const path = phasedRender && config.type === 'report' ? this.phasedLoadPath : this.loadPath;
+    const path = phasedRender && this.config.type === 'report' ? this.phasedLoadPath : this.loadPath;
     const headers = {
       uid: this.config.uniqueId,
       sdkSessionId: this.service.getSdkSessionId(),
       bootstrapped: this.config.bootstrapped,
       sdkVersion: sdkConfig.default.version
     };
 
-    return this.service.hpm.post<void>(path, config, headers, this.iframe.contentWindow)
+    return this.service.hpm.post<void>(path, this.config, headers, this.iframe.contentWindow)
       .then(response => {
-        utils.assign(this.config, config);
         return response.body;
       },
-        response => {
-          throw response.body;
-        });
+      response => {
+        throw response.body;
+      });
   }
 
   /**
@@ -455,7 +471,7 @@ export abstract class Embed {
    * ```
    */
   reload(): Promise<void> {
-    return this.load(this.config);
+    return this.load();
   }
 
   /**
@@ -720,10 +736,15 @@ export abstract class Embed {
         }
       }
 
-      this.iframe.addEventListener('load', () => this.load(this.config, phasedRender), false);
+      this.iframe.addEventListener('load', () => {
+        this.iframeLoaded = true;
+        this.load(phasedRender);
+      }, false);
 
       if (this.service.getNumberOfComponents() <= Embed.maxFrontLoadTimes) {
-        this.frontLoadHandler = () => this.frontLoadSendConfig(this.config);
+        this.frontLoadHandler = () => {
+          this.frontLoadSendConfig(this.config);
+        }
 
         // 'ready' event is fired by the embedded element (not by the iframe)
         this.element.addEventListener('ready', this.frontLoadHandler, false);
@@ -806,9 +827,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;
       });

src/config.ts

@@ -401,7 +401,8 @@ export class Service implements IService {
        */
       if(config.type === "report" && component.config.type === "create") {
         const report = new Report(this, element, config, /* phasedRender */ false, /* isBootstrap */ false, element.powerBiEmbed.iframe);
-        report.load(config);
+        component.populateConfig(config, /* isBootstrap */ false);
+        report.load();
         element.powerBiEmbed = report;
 
         this.addOrOverwriteEmbed(component, element);
@@ -413,7 +414,7 @@ export class Service implements IService {
     }
 
     component.populateConfig(config, /* isBootstrap */ false);
-    component.load(component.config, phasedRender);
+    component.load(phasedRender);
 
     return component;
   }

src/embed.ts

@@ -31,8 +31,8 @@ export class Visual extends Report {
     super(service, element, baseConfig, phasedRender, isBootstrap, iframe);
   }
 
-  load(baseConfig: embed.IEmbedConfigurationBase, phasedRender?: boolean): Promise<void> {
-    var config = <embed.IVisualEmbedConfiguration>baseConfig;
+  load(phasedRender?: boolean): Promise<void> {
+    var config = <embed.IVisualEmbedConfiguration>this.config;
 
     if (!config.accessToken) {
       // bootstrap flow.
@@ -88,7 +88,8 @@ export class Visual extends Report {
       pagesLayout: pagesLayout
     };
 
-    return super.load(config, phasedRender);
+    this.config = config;
+    return super.load(phasedRender);
   }
 
   /**