Remove compat scripts and move API URL redirection to contentSetup

ext/src/compat/youtube.js

@@ -1,60 +0,0 @@
-"use strict";
-
-// Insert script before first script is run
-document.addEventListener("beforescriptexecute", function onBeforeScriptExecute () {
-    document.removeEventListener("beforescriptexecute", onBeforeScriptExecute);
-
-    const scriptElement = document.createElement("script");
-    scriptElement.src = browser.runtime.getURL("vendor/webcomponents-lite.min.js");
-    document.head.prepend(scriptElement);
-});
-
-
-const EXT_SENDER_SCRIPT_URLS = [
-    "chrome-extension://pkedcjkdefgpdelpbcmbmeomcjbeemfm/cast_sender.js"
-  , "chrome-extension://enhhojjnijigcajfphajepfemndkmdlo/cast_sender.js"
-];
-
-const SENDER_SCRIPT_URL = "https://www.gstatic.com/cv/js/sender/v1/cast_sender.js";
-
-
-// Store reference to original function
-const _createElement = document.createElement;
-
-function createElement () {
-    // Call original function
-    const element = _createElement.apply(this, arguments);
-
-    /**
-     * If the new element being created is a <script> element,
-     * replace the src property setter to intercept the new value.
-     *
-     * If it matches Chrome's cast extension sender script URL,
-     * replace it with the standard API URL, the request for which
-     * is handled in the main script.
-     */
-    if (element.nodeName === "SCRIPT") {
-        const { get, set } = Reflect.getOwnPropertyDescriptor(
-                Reflect.getPrototypeOf(element.wrappedJSObject), "src");
-
-        Reflect.defineProperty(element.wrappedJSObject, "src", {
-            configurable: true
-          , enumerable: true          
-          , get
-
-          , set: exportFunction(function (value) {
-                if (EXT_SENDER_SCRIPT_URLS.includes(value)) {
-                    return set.call(this, SENDER_SCRIPT_URL);
-                }
-                return set.call(this, value);
-            }, window)
-        });
-    }
-
-    return element;
-}
-
-// Redefine page's document.createElement function
-exportFunction(createElement, document, {
-    defineAs: "createElement"
-});

ext/src/global.d.ts

@@ -7,8 +7,8 @@ declare const APPLICATION_NAME: string;
 declare const APPLICATION_VERSION: string;
 
 
-declare interface Window {
-    wrappedJSObject: typeof Window;
+declare interface Object {
+    wrappedJSObject: Object;
 }
 
 

ext/src/lib/utils.ts

@@ -31,3 +31,6 @@ export function getWindowCenteredProps (
       , top: Math.floor(centerY - height / 2)
     };
 }
+
+
+export const REMOTE_MATCH_PATTERN_REGEX = /^(?:(?:(\*|https?|ftp):\/\/(\*|(?:\*\.(?:[^\/\*:]\.?)+(?:[^\.])|[^\/\*:]*))?)(\/.*)|<all_urls>)$/;

ext/src/main.ts

@@ -179,12 +179,14 @@ async function onBeforeSendHeaders (
     // Find and rewrite the User-Agent header
     for (const header of details.requestHeaders) {
         if (header.name.toLowerCase() === "user-agent") {
-            // TODO: Move this somewhere else
+
+            // TODO: Remove need for this
             if (host.value === "www.youtube.com") {
                 header.value = getChromeUserAgent(os, true);
-            } else {
-                header.value = currentUAString;
+                break;
             }
+            
+            header.value = currentUAString;
 
             break;
         }
@@ -195,6 +197,9 @@ async function onBeforeSendHeaders (
     };
 }
 
+/**
+ * Updates any extension state based on options changes.
+ */
 async function onOptionsUpdated (alteredOptions?: Array<(keyof Options)>) {
     const { options } = await browser.storage.sync.get("options");
 
@@ -203,29 +208,35 @@ async function onOptionsUpdated (alteredOptions?: Array<(keyof Options)>) {
         return;
     }
 
-    const registerFunctions = {
-        onBeforeSendHeaders () {
-            browser.webRequest.onBeforeSendHeaders.addListener(
-                    onBeforeSendHeaders
-                  , { urls: options.userAgentWhitelistEnabled
-                        ? options.userAgentWhitelist
-                        : [] }
-                  , [  "blocking", "requestHeaders" ]);
-        }
-    };
+    /**
+     * Adds a webRequest listener that intercepts and modifies user agent based on 
+     */
+    function register_userAgentWhitelist () {
+        browser.webRequest.onBeforeSendHeaders.addListener(
+                onBeforeSendHeaders
+              , { urls: options.userAgentWhitelistEnabled
+                    ? options.userAgentWhitelist
+                    : [] }
+              , [  "blocking", "requestHeaders" ]);
+    }
+
+    function unregister_userAgentWhitelist () {
+        browser.webRequest.onBeforeSendHeaders.removeListener(
+              onBeforeSendHeaders);
+    }
+
+
 
     if (!alteredOptions) {
         // If no altered properties specified, register all listeners
-        for (const func of Object.values(registerFunctions)) {
-            func();
-        }
+        register_userAgentWhitelist();
     } else {
+
         if (alteredOptions.includes("userAgentWhitelist")
              || alteredOptions.includes("userAgentWhitelistEnabled")) {
 
-            browser.webRequest.onBeforeSendHeaders.removeListener(
-                    onBeforeSendHeaders);
-            registerFunctions.onBeforeSendHeaders();
+            unregister_userAgentWhitelist();
+            register_userAgentWhitelist();
         }
 
         if (alteredOptions.includes("mirroringEnabled")) {

ext/src/manifest.json

@@ -27,13 +27,7 @@
   , "background": {
         "scripts": [ "main.js" ]
     }
-  , "content_scripts": [
-        {
-            "matches": [ "https://www.youtube.com/*" ]
-          , "js": [ "compat/youtube.js" ]
-          , "run_at": "document_start"
-        }
-    ]
+
   , "content_security_policy": "CONTENT_SECURITY_POLICY"
   , "default_locale": "en"
   , "manifest_version": 2

ext/src/options/index.tsx

@@ -10,6 +10,7 @@ import Bridge from "./Bridge";
 import EditableList from "./EditableList";
 
 import getBridgeInfo, { BridgeInfo } from "../lib/getBridgeInfo";
+import { REMOTE_MATCH_PATTERN_REGEX } from "../lib/utils";
 
 
 const _ = browser.i18n.getMessage;
@@ -26,8 +27,6 @@ browser.runtime.getPlatformInfo()
     });
 
 
-const MATCH_PATTERN_REGEX = /^(?:(?:(\*|https?|ftp):\/\/((?:\*\.|[^\/\*])+)|(file):\/\/\/?(?:\*\.|[^\/\*])+)(\/.*)|<all_urls>)$/;
-
 function getInputValue (input: HTMLInputElement) {
     switch (input.type) {
         case "checkbox":
@@ -236,7 +235,7 @@ class OptionsApp extends Component<{}, OptionsAppState> {
                             </div>
                             <EditableList data={ this.state.options.userAgentWhitelist }
                                           onChange={ this.handleWhitelistChange }
-                                          itemPattern={ MATCH_PATTERN_REGEX }
+                                          itemPattern={ REMOTE_MATCH_PATTERN_REGEX }
                                           itemPatternError={ this.getWhitelistItemPatternError } />
                         </div>
                     </fieldset>

ext/src/shim/contentSetup.ts

@@ -4,3 +4,40 @@ const _window = (window.wrappedJSObject as any);
 
 _window.chrome = cloneInto({}, window);
 _window.navigator.presentation = cloneInto({}, window);
+
+
+
+const EXT_SENDER_SCRIPT_URLS = [
+    "chrome-extension://pkedcjkdefgpdelpbcmbmeomcjbeemfm/cast_sender.js"
+  , "chrome-extension://enhhojjnijigcajfphajepfemndkmdlo/cast_sender.js"
+];
+
+const SENDER_SCRIPT_URL = "https://www.gstatic.com/cv/js/sender/v1/cast_sender.js";
+
+
+/**
+ * Replace the src property setter on <script> elements to
+ * intercept the new value.
+ *
+ * If it matches one of Chrome's cast extension sender script
+ * URLs, replace it with the standard API URL, the request for
+ * which is handled in the main script.
+ */
+const { get, set } = Reflect.getOwnPropertyDescriptor(
+        HTMLScriptElement.prototype.wrappedJSObject, "src");
+
+Reflect.defineProperty(
+        HTMLScriptElement.prototype.wrappedJSObject, "src", {
+
+    configurable: true
+  , enumerable: true
+  , get
+
+  , set: exportFunction(function (value) {
+        if (EXT_SENDER_SCRIPT_URLS.includes(value)) {
+            return set.call(this, SENDER_SCRIPT_URL);
+        }
+
+        return set.call(this, value);
+    }, window)
+});

ext/webpack.config.js

@@ -1,23 +1,22 @@
 "use strict";
 
-const path              = require("path");
-const webpack           = require("webpack");
+const path = require("path");
+const webpack = require("webpack");
 const CopyWebpackPlugin = require("copy-webpack-plugin");
 
 module.exports = (env) => ({
     entry: {
-        "main"           : `${env.includePath}/main.ts`
-      , "popup/bundle"   : `${env.includePath}/popup/index.tsx`
-      , "options/bundle" : `${env.includePath}/options/index.tsx`
-      , "updater/bundle" : `${env.includePath}/updater/index.tsx`
-      , "mediaCast"      : `${env.includePath}/mediaCast.js`
-      , "mirroringCast"  : `${env.includePath}/mirroringCast.js`
-      , "compat/youtube" : `${env.includePath}/compat/youtube.js`
+        "main": `${env.includePath}/main.ts`
+      , "popup/bundle": `${env.includePath}/popup/index.tsx`
+      , "options/bundle": `${env.includePath}/options/index.tsx`
+      , "updater/bundle": `${env.includePath}/updater/index.tsx`
+      , "mediaCast": `${env.includePath}/mediaCast.js`
+      , "mirroringCast": `${env.includePath}/mirroringCast.js`
 
         // Shim entries
-      , "shim/bundle"       : `${env.includePath}/shim/index.ts`
-      , "shim/content"      : `${env.includePath}/shim/content.ts`
-      , "shim/contentSetup" : `${env.includePath}/shim/contentSetup.ts`
+      , "shim/bundle": `${env.includePath}/shim/index.ts`
+      , "shim/content": `${env.includePath}/shim/content.ts`
+      , "shim/contentSetup": `${env.includePath}/shim/contentSetup.ts`
     }
   , output: {
         filename: "[name].js"
@@ -25,12 +24,12 @@ module.exports = (env) => ({
     }
   , plugins: [
         new webpack.DefinePlugin({
-            "EXTENSION_NAME"      : JSON.stringify(env.extensionName)
-          , "EXTENSION_ID"        : JSON.stringify(env.extensionId)
-          , "EXTENSION_VERSION"   : JSON.stringify(env.extensionVersion)
-          , "MIRRORING_APP_ID"    : JSON.stringify(env.mirroringAppId)
-          , "APPLICATION_NAME"    : JSON.stringify(env.applicationName)
-          , "APPLICATION_VERSION" : JSON.stringify(env.applicationVersion)
+            "EXTENSION_NAME": JSON.stringify(env.extensionName)
+          , "EXTENSION_ID": JSON.stringify(env.extensionId)
+          , "EXTENSION_VERSION": JSON.stringify(env.extensionVersion)
+          , "MIRRORING_APP_ID": JSON.stringify(env.mirroringAppId)
+          , "APPLICATION_NAME": JSON.stringify(env.applicationName)
+          , "APPLICATION_VERSION": JSON.stringify(env.applicationVersion)
         })
 
         // Copy static assets