Populate default styles on load

Author: sammacbeth

src/features/click-to-load.js

@@ -22,7 +22,7 @@ const titleID = 'DuckDuckGoPrivacyEssentialsCTLElementTitle'
 // @see {getConfig}
 let config = null
 let sharedStrings = null
-let styles = null
+let styles = getStyles()
 
 // TODO: Remove these redundant data structures and refactor the related code.
 //       There should be no need to have the entity configuration stored in two
@@ -1618,10 +1618,13 @@ export default class ClickToLoad extends ContentFeature {
         const websiteOwner = args?.site?.parentEntity
         const settings = args?.featureSettings?.clickToLoad || {}
         const locale = args?.locale || 'en'
-        const localizedConfig = getConfig(locale, args?.assets)
+        const localizedConfig = getConfig(locale)
         config = localizedConfig.config
         sharedStrings = localizedConfig.sharedStrings
-        styles = localizedConfig.styles
+        // update styles if asset config was sent
+        if (args?.assets) {
+            styles = getStyles(args.assets)
+        }
 
         for (const entity of Object.keys(config)) {
             // Strip config entities that are first-party, or aren't enabled in the

src/features/click-to-load/ctl-config.js

@@ -16,7 +16,7 @@ import localesJSON from '../../../build/locales/ctl-locales.js'
 /**
  * Get CSS style defintions for CTL, using the provided AssetConfig for any non-embedded assets
  * (e.g. fonts.)
- * @param {AssetConfig} assets
+ * @param {AssetConfig} [assets]
  */
 export function getStyles (assets) {
     let fontStyle = ''
@@ -624,15 +624,13 @@ export function getStyles (assets) {
 
 /**
  * @param {string} locale UI locale
- * @param {AssetConfig} assets Config for UI assets
  */
-export function getConfig (locale, assets) {
+export function getConfig (locale) {
     const locales = JSON.parse(localesJSON)
     const fbStrings = locales[locale]['facebook.json']
     const ytStrings = locales[locale]['youtube.json']
 
     const sharedStrings = locales[locale]['shared.json']
-    const styles = getStyles(assets)
     const config = {
         'Facebook, Inc.': {
             informationalModal: {
@@ -1041,5 +1039,5 @@ export function getConfig (locale, assets) {
         }
     }
 
-    return { config, sharedStrings, styles }
+    return { config, sharedStrings }
 }