Change how CDN_HOST is passed down to make assets build reproducible (#14381)

* Change how CDN_HOST is passed down to make assets build reproducible

* Change webpacker/webpack configuration to dynamically load publicPath based on meta header

* Fix embedded layout missing the cdn-host meta header

7 files changed, 27 insertions, 0 deletions

diff --git a/app/javascript/packs/about.js b/app/javascript/packs/about.js
index 843cb2c87..892d825ec 100644
--- a/app/javascript/packs/about.js
+++ b/app/javascript/packs/about.js
@@ -1,3 +1,4 @@
+import './public-path';
 import loadPolyfills from '../mastodon/load_polyfills';
 import { start } from '../mastodon/common';
 
diff --git a/app/javascript/packs/admin.js b/app/javascript/packs/admin.js
index 51f92de8a..65b8dc040 100644
--- a/app/javascript/packs/admin.js
+++ b/app/javascript/packs/admin.js
@@ -1,3 +1,4 @@
+import './public-path';
 import { delegate } from '@rails/ujs';
 import ready from '../mastodon/ready';
 
diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js
index c65ebed74..91240aecf 100644
--- a/app/javascript/packs/application.js
+++ b/app/javascript/packs/application.js
@@ -1,3 +1,4 @@
+import './public-path';
 import loadPolyfills from '../mastodon/load_polyfills';
 import { start } from '../mastodon/common';
 
diff --git a/app/javascript/packs/error.js b/app/javascript/packs/error.js
index 685c89065..6376dc2f5 100644
--- a/app/javascript/packs/error.js
+++ b/app/javascript/packs/error.js
@@ -1,3 +1,4 @@
+import './public-path';
 import ready from '../mastodon/ready';
 
 ready(() => {
diff --git a/app/javascript/packs/public-path.js b/app/javascript/packs/public-path.js
new file mode 100644
index 000000000..f96109f4f
--- /dev/null
+++ b/app/javascript/packs/public-path.js
@@ -0,0 +1,21 @@
+// Dynamically set webpack's loading path depending on a meta header, in order
+// to share the same assets regardless of instance configuration.
+// See https://webpack.js.org/guides/public-path/#on-the-fly
+
+function removeOuterSlashes(string) {
+  return string.replace(/^\/*/, '').replace(/\/*$/, '');
+}
+
+function formatPublicPath(host = '', path = '') {
+  let formattedHost = removeOuterSlashes(host);
+  if (formattedHost && !/^http/i.test(formattedHost)) {
+    formattedHost = `//${formattedHost}`;
+  }
+  const formattedPath = removeOuterSlashes(path);
+  return `${formattedHost}/${formattedPath}/`;
+}
+
+const cdnHost = document.querySelector('meta[name=cdn-host]');
+
+// eslint-disable-next-line camelcase, no-undef, no-unused-vars
+__webpack_public_path__ = formatPublicPath(cdnHost ? cdnHost.content : '', process.env.PUBLIC_OUTPUT_PATH);
diff --git a/app/javascript/packs/public.js b/app/javascript/packs/public.js
index 551e281a8..39defa7ae 100644
--- a/app/javascript/packs/public.js
+++ b/app/javascript/packs/public.js
@@ -1,3 +1,4 @@
+import './public-path';
 import escapeTextContentForBrowser from 'escape-html';
 import loadPolyfills from '../mastodon/load_polyfills';
 import ready from '../mastodon/ready';
diff --git a/app/javascript/packs/share.js b/app/javascript/packs/share.js
index 4ef23e1b2..1225d7b52 100644
--- a/app/javascript/packs/share.js
+++ b/app/javascript/packs/share.js
@@ -1,3 +1,4 @@
+import './public-path';
 import loadPolyfills from '../mastodon/load_polyfills';
 import { start } from '../mastodon/common';