From 46604aaca0ba2b5055c619495a6c4a966233b996 Mon Sep 17 00:00:00 2001 From: David Walsh Date: Tue, 12 Sep 2023 13:18:38 -0500 Subject: [PATCH] Add renderJavaScriptLoader function, use loader on background also --- app/background.html | 18 +-------- app/popup.html | 2 +- app/scripts/load-app.js | 19 ++++++---- development/build/scripts.js | 72 ++++++++++++++++++++++-------------- 4 files changed, 59 insertions(+), 52 deletions(-) diff --git a/app/background.html b/app/background.html index eabb3bf3a704..beed01def0ce 100644 --- a/app/background.html +++ b/app/background.html @@ -4,23 +4,7 @@ - - - - - {{@if(it.applyLavaMoat)}} - - - - {{#else}} - - - - - {{/if}} - {{@each(it.jsBundles) => val}} - - {{/each}} + diff --git a/app/popup.html b/app/popup.html index 97cf5478c1de..90b4c162b33c 100644 --- a/app/popup.html +++ b/app/popup.html @@ -15,4 +15,4 @@
- \ No newline at end of file + diff --git a/app/scripts/load-app.js b/app/scripts/load-app.js index 595cee291939..ffb307c18cf7 100644 --- a/app/scripts/load-app.js +++ b/app/scripts/load-app.js @@ -2,20 +2,25 @@ 'use strict'; setTimeout(() => { - const scriptsToLoad = [/*SCRIPTS*/]; + // eslint-disable-next-line spaced-comment + const scriptsToLoad = [ + /* SCRIPTS */ + ]; const loadScript = (src) => { const script = document.createElement('script'); script.type = 'text/javascript'; script.async = true; - script.onload = () => { - if (scriptsToLoad.length) { - loadScript(scriptsToLoad.shift()); - } - }; + script.onload = loadNext; script.src = src; document.body.appendChild(script); }; - loadScript(scriptsToLoad.shift()); + loadNext(); + + function loadNext() { + if (scriptsToLoad.length) { + loadScript(scriptsToLoad.shift()); + } + } }, 13); diff --git a/development/build/scripts.js b/development/build/scripts.js index 24626d0c6b23..2f4e81aa3bcc 100644 --- a/development/build/scripts.js +++ b/development/build/scripts.js @@ -714,26 +714,27 @@ function createFactoredBuild({ case 'ui': { renderHtmlFile({ htmlName: 'popup', - groupSet, - commonSet, browserPlatforms, applyLavaMoat, }); renderHtmlFile({ htmlName: 'notification', - groupSet, - commonSet, browserPlatforms, applyLavaMoat, isMMI: buildType === 'mmi', }); renderHtmlFile({ htmlName: 'home', + browserPlatforms, + applyLavaMoat, + isMMI: buildType === 'mmi', + }); + renderJavaScriptLoader({ groupSet, commonSet, browserPlatforms, applyLavaMoat, - isMMI: buildType === 'mmi', + destinationFileName: 'load-app.js', }); break; } @@ -745,6 +746,13 @@ function createFactoredBuild({ browserPlatforms, applyLavaMoat, }); + renderJavaScriptLoader({ + groupSet, + commonSet, + browserPlatforms, + applyLavaMoat, + destinationFileName: 'load-background.js', + }); if (process.env.ENABLE_MV3) { const jsBundles = [ ...commonSet.values(), @@ -1210,28 +1218,23 @@ async function setEnvironmentVariables({ }); } -function renderHtmlFile({ - htmlName, +function renderJavaScriptLoader({ groupSet, commonSet, browserPlatforms, applyLavaMoat, - isMMI, + destinationFileName, }) { if (applyLavaMoat === undefined) { throw new Error( 'build/scripts/renderHtmlFile - must specify "applyLavaMoat" option', ); } - const htmlFilePath = `./app/${htmlName}.html`; - const htmlTemplate = readFileSync(htmlFilePath, 'utf8'); + const jsBundles = [...commonSet.values(), ...groupSet.values()].map( (label) => `./${label}.js`, ); - const appLoadFilePath = './app/scripts/load-app.js'; - const appLoadContents = readFileSync(appLoadFilePath, 'utf8'); - const securityScripts = applyLavaMoat ? ['./runtime-lavamoat.js', './lockdown-more.js', './policy-load.js'] : [ @@ -1250,25 +1253,40 @@ function renderHtmlFile({ ...jsBundles, ]; - const htmlOutput = Sqrl.render(htmlTemplate, { - isMMI, - jsBundles, + console.log( + `Asked to create ${destinationFileName} with scripts: `, + requiredScripts, + ); + + browserPlatforms.forEach((platform) => { + const appLoadFilePath = './app/scripts/load-app.js'; + const appLoadContents = readFileSync(appLoadFilePath, 'utf8'); + + const scriptDest = `./dist/${platform}/${destinationFileName}`; + const scriptOutput = appLoadContents.replace( + '/* SCRIPTS */', + `...${JSON.stringify(requiredScripts)}`, + ); + + console.log(`WRITING ${scriptDest}`); + writeFileSync(scriptDest, scriptOutput); }); +} + +function renderHtmlFile({ htmlName, browserPlatforms, applyLavaMoat, isMMI }) { + if (applyLavaMoat === undefined) { + throw new Error( + 'build/scripts/renderHtmlFile - must specify "applyLavaMoat" option', + ); + } + const htmlFilePath = `./app/${htmlName}.html`; + const htmlTemplate = readFileSync(htmlFilePath, 'utf8'); + + const htmlOutput = Sqrl.render(htmlTemplate, { isMMI }); browserPlatforms.forEach((platform) => { const dest = `./dist/${platform}/${htmlName}.html`; // we dont have a way of creating async events atm writeFileSync(dest, htmlOutput); - - if (htmlName === 'home') { - const scriptDest = `./dist/${platform}/load-app.js`; - const scriptOutput = appLoadContents.replace( - '[/*SCRIPTS*/]', - JSON.stringify(requiredScripts), - ); - - console.log(`WRITING ${scriptDest}`); - writeFileSync(scriptDest, scriptOutput); - } }); }