use a pluggable document/window pattern for testing request storage JS

Shopify · Jan 2, 2019 · 6dbe74a · 6dbe74a
1 parent 1a9b9f4
commit 6dbe74a
Showing 1 changed file with 34 additions and 23 deletions.
diff --git a/packages/koa-shopify-auth/client/request-storage.js b/packages/koa-shopify-auth/client/request-storage.js
@@ -1,20 +1,23 @@
-(function() {
-  function StorageAccessHelper() {
-    this.hasStorageAccessUrl = window.redirectUrl + '&top_level=true';
+/* eslint-env: browser */
+(function(global) {
+  function StorageAccessHelper(_window, _document) {
+    this.window = _window;
+    this.document = _document;
+    this.hasStorageAccessUrl = this.window.redirectUrl + '&top_level=true';
+
     this.checkWindow();
     this.checkForStorageAccess();
   }
 
   StorageAccessHelper.prototype.checkWindow = function() {
-    if (window.top === window.self) {
-      debugger
-      window.location.href = this.hasStorageAccessUrl;
+    if (this.window.top === this.window.self) {
+      this.window.location.href = this.hasStorageAccessUrl;
     }
   }
 
   StorageAccessHelper.prototype.checkForStorageAccess = function() {
     if (this.hasStorageAccess()) {
-      document.hasStorageAccess().then(function(hasAccess) {
+      this.document.hasStorageAccess().then(function(hasAccess) {
         if (hasAccess) {
           this.handleHasStorageAccess();
         } else {
@@ -27,47 +30,49 @@
   }
 
   StorageAccessHelper.prototype.handleHasStorageAccess = function () {
-    if (sessionStorage.getItem('shopify.granted_storage_access')) {
+    if (this.document.sessionStorage.getItem('shopify.granted_storage_access')) {
       // If app was classified by ITP and used Storage Access API to acquire access
       this.redirectToAppHome();
     } else {
       // If app has not been classified by ITP and still has storage access
-      this.redirectToAppTLD();
+      this.redirectToAppTLD('/');
     }
   }
 
   StorageAccessHelper.prototype.handleGetStorageAccess = function() {
-    if (sessionStorage.getItem('shopify.top_level_interaction')) {
+    if (this.document.sessionStorage.getItem('shopify.top_level_interaction')) {
       // If merchant has been redirected to interact with TLD (requirement for prompting request to gain storage access)
       this.setupRequestStorageAccess();
     } else {
       // If merchant has not been redirected to interact with TLD (requirement for prompting request to gain storage access)
-      this.redirectToAppTLD('/shopify/auth/top_level_interaction?shop=' + window.shop);
+      this.redirectToAppTLD('/shopify/auth/top_level_interaction?shop=' + this.window.shop);
     }
   }
 
   StorageAccessHelper.prototype.setupRequestStorageAccess = function () {
-    document.getElementById('CookiePartitionPrompt').classList.remove('hide');
-    document.getElementById('AcceptCookies')
+    this.document.getElementById('CookiePartitionPrompt').classList.remove('hide');
+    this.document.getElementById('AcceptCookies')
       .addEventListener('click', this.handleRequestStorageAccess.bind(this));
   }
 
   StorageAccessHelper.prototype.handleRequestStorageAccess = function () {
-    document.requestStorageAccess().then(this.redirectToAppHome, this.redirectToAppsIndex);
+    this.document.requestStorageAccess().then(
+      this.redirectToAppHome.bind(this), this.redirectToAppsIndex.bind(this)
+    );
   }
 
   StorageAccessHelper.prototype.hasStorageAccess = function() {
-    return Boolean(document.hasStorageAccess);
+    return Boolean(this.document.hasStorageAccess);
   }
 
   StorageAccessHelper.prototype.redirectToAppHome = function() {
-    sessionStorage.setItem('shopify.granted_storage_access', true);
-    document.cookie = 'shopify.granted_storage_access=1';
-    window.location.href = '/?shop=' + window.shop;
+    this.document.sessionStorage.setItem('shopify.granted_storage_access', true);
+    this.document.cookie = 'shopify.granted_storage_access=1';
+    this.window.location.href = '/?shop=' + this.window.shop;
   }
 
   StorageAccessHelper.prototype.redirectToAppTLD = function(url) {
-    var normalizedLink = document.createElement('a');
+    var normalizedLink = this.document.createElement('a');
     normalizedLink.href = url;
 
     var data = JSON.stringify({
@@ -76,12 +81,18 @@
         location: normalizedLink.href,
       }
     });
-    window.parent.postMessage(data, window.shopOrigin);
+    this.window.parent.postMessage(data, this.window.shopOrigin);
   }
 
   StorageAccessHelper.prototype.redirectToAppsIndex = function () {
-    window.parent.location.href = `${window.shopOrigin}/admin/apps`;
+    this.window.parent.location.href = `${this.window.shopOrigin}/admin/apps`;
   }
 
-  document.addEventListener('DOMContentLoaded', new StorageAccessHelper());
-})();
+  if (typeof module === 'undefined') {
+    document.addEventListener('DOMContentLoaded', function () {
+      new StorageAccessHelper(window, document);
+    });
+  } else {
+    module.exports = StorageAccessHelper;
+  }
+})(this);