Support extracting fastboot specific config from meta tag

ember-fastboot · Aug 22, 2021 · dd38417 · dd38417
1 parent fc6fc24
commit dd38417
Show file tree

Hide file tree

Showing 2 changed files with 110 additions and 11 deletions.
diff --git a/packages/fastboot/src/html-entrypoint.js b/packages/fastboot/src/html-entrypoint.js
@@ -4,21 +4,37 @@ const { JSDOM } = require('jsdom');
 const fs = require('fs');
 const path = require('path');
 
+function mergeContent(metaElement, config, configName) {
+  let name = metaElement.getAttribute('name');
+  if (name && name.endsWith(configName)) {
+    let content = JSON.parse(decodeURIComponent(metaElement.getAttribute('content')));
+    content.APP = Object.assign({ autoboot: false }, content.APP);
+    config[name.slice(0, -1 * configName.length)] = content;
+    return true;
+  }
+  return false;
+}
+
 function htmlEntrypoint(appName, distPath, htmlPath) {
   let html = fs.readFileSync(path.join(distPath, htmlPath), 'utf8');
   let dom = new JSDOM(html);
-  let scripts = [];
 
+  let fastbootConfig = {};
   let config = {};
   for (let element of dom.window.document.querySelectorAll('meta')) {
-    let name = element.getAttribute('name');
-    if (name && name.endsWith('/config/environment')) {
-      let content = JSON.parse(decodeURIComponent(element.getAttribute('content')));
-      content.APP = Object.assign({ autoboot: false }, content.APP);
-      config[name.slice(0, -1 * '/config/environment'.length)] = content;
+    mergeContent(element, config, '/config/environment');
+    let fastbootMerged = mergeContent(element, fastbootConfig, '/config/fastboot-environment');
+    if (fastbootMerged) {
+      element.remove();
     }
   }
 
+  let isFastbootConfigBuilt = Object.keys(fastbootConfig).length > 0;
+  if (isFastbootConfigBuilt) {
+    config = fastbootConfig;
+  }
+
+  let scripts = [];
   let rootURL = getRootURL(appName, config);
 
   for (let element of dom.window.document.querySelectorAll('script,fastboot-script')) {

diff --git a/packages/fastboot/test/html-entrypoint-test.js b/packages/fastboot/test/html-entrypoint-test.js
@@ -222,11 +222,79 @@ describe('htmlEntrypoint', function() {
   it('extracts configs from meta', function() {
     let tmpobj = tmp.dirSync();
     let tmpLocation = tmpobj.name;
+    let configObj = {
+      'my-app': {
+        APP: {
+          autoboot: false,
+        },
+        configKey: 'someValue',
+      },
+      'my-engine': {
+        APP: {
+          autoboot: false,
+        },
+        engineKey: 'engineValue',
+      },
+    };
+    let metaTags = Object.entries(configObj)
+      .map(
+        ([name, options]) =>
+          `<meta name="${name}/config/fastboot-environment" content="${encodeURIComponent(
+            JSON.stringify(options)
+          )}"></meta>`
+      )
+      .join('\n');
+
+    let project = {
+      'index.html': `
+        <html>
+          <head>
+            ${metaTags}
+          </head>
+          <body>
+            <script src="/custom-root-url/bar.js"></script>
+          </body>
+        </html>
+      `,
+    };
+
+    fixturify.writeSync(tmpLocation, project);
+    let { config } = htmlEntrypoint('my-app', tmpLocation, 'index.html');
+    expect(config).to.deep.equal(configObj);
+  });
+
+  it('support config fallback name "config/environement" when there is no fastboot-environement in HTML', function() {
+    let tmpobj = tmp.dirSync();
+    let tmpLocation = tmpobj.name;
+    let configObj = {
+      'my-app': {
+        APP: {
+          autoboot: false,
+        },
+        configKey: 'someValue',
+      },
+      'my-engine': {
+        APP: {
+          autoboot: false,
+        },
+        engineKey: 'engineValue',
+      },
+    };
+    let metaTags = Object.entries(configObj)
+      .map(
+        ([name, options]) =>
+          `<meta name="${name}/config/environment" content="${encodeURIComponent(
+            JSON.stringify(options)
+          )}"></meta>`
+      )
+      .join('\n');
 
     let project = {
       'index.html': `
         <html>
-          <meta name="my-app/config/environment" content="%7B%22rootURL%22%3A%22%2Fcustom-root-url%2F%22%7D" >
+          <head>
+            ${metaTags}
+          </head>
           <body>
             <script src="/custom-root-url/bar.js"></script>
           </body>
@@ -235,20 +303,35 @@ describe('htmlEntrypoint', function() {
     };
 
     fixturify.writeSync(tmpLocation, project);
+
     let { config } = htmlEntrypoint('my-app', tmpLocation, 'index.html');
-    expect(config).to.deep.equal({
-      'my-app': { APP: { autoboot: false }, rootURL: '/custom-root-url/' },
-    });
+    expect(config).to.deep.equal(configObj);
   });
 
   it('understands customized rootURL', function() {
     let tmpobj = tmp.dirSync();
     let tmpLocation = tmpobj.name;
+    let config = {
+      'my-app': {
+        rootURL: '/custom-root-url/',
+      },
+    };
+
+    let metaTags = Object.entries(config)
+      .map(
+        ([name, options]) =>
+          `<meta name="${name}/config/fastboot-environment" content="${encodeURIComponent(
+            JSON.stringify(options)
+          )}"></meta>`
+      )
+      .join('\n');
 
     let project = {
       'index.html': `
         <html>
-          <meta name="my-app/config/environment" content="%7B%22rootURL%22%3A%22%2Fcustom-root-url%2F%22%7D" >
+          <head>
+            ${metaTags}
+          </head>
           <body>
             <fastboot-script src="foo.js"></fastboot-script>
             <script src="/custom-root-url/bar.js"></script>