Fabo/allow extension for deployment previews (#120)

* whitelist deployment previews

* working on previews

* changelog

* deps

* fixed test

* Update background.js

* linted

* linted

* linted

* security updated

* install deps in lunie submodule

package.json

@@ -18,7 +18,7 @@
     "build": "cross-env NODE_ENV=production webpack --hide-modules && node ./scripts/remove-localhost.js",
     "build:dev": "cross-env NODE_ENV=development webpack --hide-modules",
     "build-zip": "node scripts/build-zip.js",
-    "initiate-submodule": "git submodule init && git submodule update && cd lunie && git checkout origin/master",
+    "initiate-submodule": "git submodule init && git submodule update && cd lunie && git checkout origin/master && yarn",
     "watch": "npm run build -- --watch",
     "watch:dev": "cross-env HMR=true npm run build:dev -- --watch",
     "test:unit": "jest --coverage",
@@ -62,6 +62,7 @@
     "bignumber.js": "^9.0.0",
     "concurrently": "^4.1.1",
     "core-js": "^3.1.4",
+    "handlebars": ">=4.5.2",
     "moment": "^2.24.0",
     "regenerator-runtime": "^0.13.2",
     "vue": "^2.6.10",
@@ -123,6 +124,7 @@
     "webpack-extension-reloader": "^1.1.0"
   },
   "resolutions": {
-    "handlebars": ">=4.5.2"
+    "handlebars": ">=4.5.2",
+    "serialize-javascript": ">=2.1.1"
   }
 }

pending/fabo_allow-extension-for-deployment-previews

@@ -0,0 +1 @@
+[Added] Allow extension in netlify deployment previews @faboweb

src/background.js

@@ -7,7 +7,11 @@ import { bindRequestsToTabs } from './tabsHandler'
 global.browser = require('webextension-polyfill')
 
 const extensionHost = location.origin
-const whitelisted = ['https://app.lunie.io', extensionHost]
+const whitelisted = [
+  'https://app.lunie.io',
+  /https:\/\/\w+--lunieio.netlify.com/, // to use the extension with deployment previews
+  extensionHost
+]
 if (process.env.NODE_ENV === 'development') {
   whitelisted.push('https://localhost')
   whitelisted.push('http://localhost')
@@ -34,13 +38,26 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
 
   return true
 })
-bindRequestsToTabs(signRequestQueue, whitelisted)
 
 // only allow whitelisted websites to send us messages
 function senderAllowed(sender) {
   // if sender.tab is not defined, the message comes from the extension
-  if (sender.tab && !whitelisted.find(url => sender.tab.url.startsWith(url))) {
+  if (sender.tab && !whitelistedChecker(sender.tab.url)) {
     return false
   }
   return true
 }
+
+const whitelistedChecker = url => {
+  return !!whitelisted.find(whitelistedUrl => {
+    // check regexps
+    if (whitelistedUrl instanceof RegExp) {
+      whitelistedUrl.exec(url)
+      return whitelistedUrl.lastIndex === 0 // check if the regex matches on index 0 (to avoid any possible hack later on)
+    }
+    // prefer normal strings as easier to read and error check
+    return url.startsWith(whitelistedUrl)
+  })
+}
+
+bindRequestsToTabs(signRequestQueue, whitelistedChecker)

src/manifest.json

@@ -26,7 +26,8 @@
         "https://localhost/*",
         "https://lunie.io/*",
         "https://app.lunie.io/*",
-        "https://www.lunie.io/*"
+        "https://www.lunie.io/*",
+        "https://*.netlify.com/*"
       ],
       "js": [
         "contentScript.js"

src/tabsHandler.js

@@ -1,6 +1,6 @@
 // requests always reference a tab so that a response finds the right listener
 // if a tab is killed or it's url changes the request is not useful anymore
-export function bindRequestsToTabs(signRequestQueue, whitelisted) {
+export function bindRequestsToTabs(signRequestQueue, whitelistedChecker) {
   // check if tab got removed
   chrome.tabs.onRemoved.addListener(function(tabID) {
     signRequestQueue.unqueueSignRequestForTab(tabID)
@@ -11,11 +11,8 @@ export function bindRequestsToTabs(signRequestQueue, whitelisted) {
     if (!changeInfo.url) {
       return
     }
-    if (
-      !whitelisted.find(whitelistedUrl =>
-        changeInfo.url.startsWith(whitelistedUrl)
-      )
-    ) {
+    // if the new url is not whitelisted kill the request
+    if (!whitelistedChecker(changeInfo.url)) {
       signRequestQueue.unqueueSignRequestForTab(tabID)
     }
   })

test/unit/tabsHandler.spec.js

@@ -40,7 +40,9 @@ describe('Sign request queue', () => {
         }
       }
     }
-    bindRequestsToTabs(signRequestQueue, ['https://lunie.io'])
+    bindRequestsToTabs(signRequestQueue, url =>
+      ['https://lunie.io'].find(whitelisted => whitelisted.startsWith(url))
+    )
 
     expect(signRequestQueue.unqueueSignRequestForTab).toHaveBeenCalledWith(42)
     expect(signRequestQueue.unqueueSignRequestForTab).toHaveBeenCalledTimes(1)