update tf-storage and tf-globals to use window to pass data accross t…

…he binary boundry

tensorboard/components/tf_globals/globals-polymer.ts

@@ -20,4 +20,12 @@ import * as tf_globals from './globals';
 class TfGlobals extends PolymerElement {
   override _template = null;
   tf_globals = tf_globals;
+  constructor() {
+    super();
+    const extendedWindow: any = window;
+    if (!extendedWindow['tensorboard']) {
+      extendedWindow['tensorboard'] = {};
+    }
+    extendedWindow['tensorboard']['tf_globals'] = tf_globals;
+  }
 }

tensorboard/components/tf_storage/tf-storage-polymer.ts

@@ -20,4 +20,12 @@ import * as tf_storage from './index';
 class TfStorage extends PolymerElement {
   override _template = null;
   tf_storage = tf_storage;
+  constructor() {
+    super();
+    const extendedWindow: any = window;
+    if (!extendedWindow['tensorboard']) {
+      extendedWindow['tensorboard'] = {};
+    }
+    extendedWindow['tensorboard']['tf_storage'] = tf_storage;
+  }
 }

tensorboard/webapp/deeplink/BUILD

@@ -11,8 +11,6 @@ tf_ng_module(
         "types.ts",
     ],
     deps = [
-        "//tensorboard/components/tf_globals:tf_globals_lib",
-        "//tensorboard/components/tf_storage",
         "//tensorboard/webapp:tb_polymer_interop_types",
         "@npm//@angular/core",
     ],
@@ -26,8 +24,6 @@ tf_ng_module(
     ],
     deps = [
         ":deeplink",
-        "//tensorboard/components/tf_globals:tf_globals_lib",
-        "//tensorboard/components/tf_storage",
         "//tensorboard/webapp/angular:expect_angular_core_testing",
         "@npm//@types/jasmine",
     ],

tensorboard/webapp/deeplink/deeplink_test.ts

@@ -31,16 +31,22 @@ describe('deeplink', () => {
     getStringSpy = jasmine.createSpy();
     migrateLegacyURLSchemeSpy = jasmine.createSpy();
     setUseHashSpy = jasmine.createSpy();
-    TEST_ONLY.utils.globals = {
-      setUseHash: setUseHashSpy,
-    } as any;
-    TEST_ONLY.utils.storage = {
-      migrateLegacyURLScheme: migrateLegacyURLSchemeSpy,
-      getString: getStringSpy,
-      setString: setStringSpy,
-    } as any;
+
     // Cannot safely stub out window.location.hash or rely on test framework
     // to not make use of the hash (it does).
+
+    // Do not rely on Polymer bundle in the test.
+    (window as any).tensorboard = {
+      tf_storage: {
+        setString: setStringSpy,
+        getString: getStringSpy,
+        migrateLegacyURLScheme: migrateLegacyURLSchemeSpy,
+      },
+      tf_globals: {
+        setUseHash: setUseHashSpy,
+      },
+    };
+
     deepLinker = TestBed.inject(HashDeepLinker);
   });
 

tensorboard/webapp/deeplink/hash.ts

@@ -14,36 +14,37 @@ limitations under the License.
 ==============================================================================*/
 
 import {Injectable} from '@angular/core';
+import {TfStorageElement} from '../tb_polymer_interop_types';
 import {DeepLinkerInterface, SetStringOption} from './types';
-import * as globals from '../../components/tf_globals/globals';
-import * as storage from '../../components/tf_storage/storage';
 
 // TODO(tensorboard-team): merge this module with tf_storage/storage.ts when
 // tf_ts_library can be referenced by tf_web_library.
 const TAB = '__tab__';
 
-// Setting these imports as properties of an object to allow test spys
-const utils = {
-  globals,
-  storage,
-};
-
 @Injectable()
 export class HashDeepLinker implements DeepLinkerInterface {
+  tfStorage: DeepLinkerInterface & {
+    migrateLegacyURLScheme: () => void;
+  };
+
   constructor() {
+    document.createElement('tf-storage');
+    document.createElement('tf-globals');
+    this.tfStorage = (window as any)['tensorboard']['tf_storage'];
+
     // Note: `migrateLegacyURLScheme()` must be called before `setUseHash`, so
     // that tfStorage reads from the actual URL, not the fake hash for tests
     // only.
-    utils.globals.setUseHash(true);
-    utils.storage.migrateLegacyURLScheme();
+    (window as any)['tensorboard']['tf_globals'].setUseHash(true);
+    this.tfStorage.migrateLegacyURLScheme();
   }
 
   getString(key: string): string {
-    return utils.storage.getString(key);
+    return this.tfStorage.getString(key);
   }
 
   setString(key: string, value: string, options?: SetStringOption): void {
-    utils.storage.setString(key, value, options);
+    this.tfStorage.setString(key, value, options);
   }
 
   getPluginId(): string {
@@ -57,5 +58,4 @@ export class HashDeepLinker implements DeepLinkerInterface {
 
 export const TEST_ONLY = {
   TAB,
-  utils,
 };