DEV: Update plugin JS loading in Ember CLI testem environment

Previously we were adding `/assets/discourse/tests/core_plugin_tests.js` to the test html all the time. This works in development mode, but fails silently when using testem via the `ember test` CLI, because there is no proxy running.

This commit makes a few changes to fix this, and make it more useful:

- Only renders the plugin `<script>` when in development mode, or when `LOAD_PLUGINS=1` (matching core's behavior)
- Only loads plugin translations based on the same logic
- When running via testem, and the above conditions are met, testem is configured to proxy `core_plugin_tests.js` through to a rails server. (port based on the `UNICORN_PORT` env variable)
- Adds a descriptive error if the plugin `<script>` fails to load. This can happen if the rails server hasn't been started
- Updates the logic for testem browsers. Ember CLI always launches testem in "CI" mode, and we don't really want 3 browsers opening by default. Our CI explicitly specifies the 3 browsers at runtime

app/assets/javascripts/discourse/lib/bootstrap-json/index.js

@@ -7,6 +7,7 @@ const cleanBaseURL = require("clean-base-url");
 const path = require("path");
 const { promises: fs } = require("fs");
 const { JSDOM } = require("jsdom");
+const { shouldLoadPluginTestJs } = require("discourse/lib/plugin-js");
 
 // via https://stackoverflow.com/a/6248722/165668
 function generateUID() {
@@ -298,6 +299,14 @@ module.exports = {
     return true;
   },
 
+  contentFor: function (type, config) {
+    if (shouldLoadPluginTestJs() && type === "test-plugin-js") {
+      return `<script src="${config.rootURL}assets/discourse/tests/active-plugins.js"></script>`;
+    } else if (shouldLoadPluginTestJs() && type === "test-plugin-tests-js") {
+      return `<script id="plugin-test-script" src="${config.rootURL}assets/discourse/tests/plugin-tests.js"></script>`;
+    }
+  },
+
   serverMiddleware(config) {
     const app = config.app;
     let { proxy, rootURL, baseURL } = config.options;

app/assets/javascripts/discourse/lib/plugin-js.js

@@ -0,0 +1,7 @@
+const EmberApp = require("ember-cli/lib/broccoli/ember-app");
+
+module.exports = {
+  shouldLoadPluginTestJs() {
+    return EmberApp.env() === "development" || process.env.LOAD_PLUGINS === "1";
+  },
+};

app/assets/javascripts/discourse/lib/translation-plugin.js

@@ -6,6 +6,7 @@ const mergeTrees = require("broccoli-merge-trees");
 const MessageFormat = require("messageformat");
 const deepmerge = require("deepmerge");
 const glob = require("glob");
+const { shouldLoadPluginTestJs } = require("discourse/lib/plugin-js");
 
 let built = false;
 
@@ -92,11 +93,15 @@ module.exports = function translatePlugin(...params) {
 };
 
 module.exports.createI18nTree = function (discourseRoot, vendorJs) {
-  let translations = [discourseRoot + "/config/locales"].concat(
-    glob
-      .sync(discourseRoot + "/plugins/*/config/locales/client.en.yml")
-      .map((f) => f.replace(/\/client\.en\.yml$/, ""))
-  );
+  let translations = [discourseRoot + "/config/locales"];
+
+  if (shouldLoadPluginTestJs()) {
+    translations = translations.concat(
+      glob
+        .sync(discourseRoot + "/plugins/*/config/locales/client.en.yml")
+        .map((f) => f.replace(/\/client\.en\.yml$/, ""))
+    );
+  }
 
   let en = new TranslationPlugin(translations, "client.en.yml");
 

app/assets/javascripts/discourse/testem.js

@@ -1,4 +1,5 @@
 const TapReporter = require("testem/lib/reporters/tap_reporter");
+const { shouldLoadPluginTestJs } = require("discourse/lib/plugin-js");
 
 class Reporter {
   constructor() {
@@ -25,8 +26,8 @@ class Reporter {
 module.exports = {
   test_page: "tests/index.html?hidepassed",
   disable_watching: true,
-  launch_in_ci: ["Chrome", "Firefox", "Headless Firefox"], // Firefox is old ESR version, Headless Firefox is up-to-date evergreen version
-  launch_in_dev: ["Chrome"],
+  launch_in_ci: ["Chrome"],
+  // launch_in_dev: ["Chrome"] // Ember-CLI always launches testem in 'CI' mode
   tap_failed_tests_only: process.env.CI,
   parallel: 1, // disable parallel tests for stability
   browser_start_timeout: 120,
@@ -51,3 +52,15 @@ module.exports = {
   },
   reporter: Reporter,
 };
+
+if (shouldLoadPluginTestJs()) {
+  const target = `http://localhost:${process.env.UNICORN_PORT || "3000"}`;
+  module.exports.proxies = {
+    "/assets/discourse/tests/active-plugins.js": {
+      target,
+    },
+    "/assets/discourse/tests/plugin-tests.js": {
+      target,
+    },
+  };
+}

app/assets/javascripts/discourse/tests/index.html

@@ -50,11 +50,11 @@
     <script src="{{rootURL}}assets/test-support.js"></script>
     <script src="{{rootURL}}assets/discourse.js"></script>
     <script src="{{rootURL}}assets/discourse-markdown.js"></script>
-    <script src="{{rootURL}}assets/discourse/tests/active-plugins.js"></script>
+    {{content-for "test-plugin-js"}}
     <script src="{{rootURL}}assets/admin.js"></script>
     <script src="{{rootURL}}assets/test-helpers.js"></script>
     <script src="{{rootURL}}assets/core-tests.js"></script>
-    <script src="{{rootURL}}assets/discourse/tests/plugin-tests.js"></script>
+    {{content-for "test-plugin-tests-js"}}
     <script>
       require('discourse/tests/test-boot-ember-cli');
     </script>

app/assets/javascripts/discourse/tests/test-boot-ember-cli.js

@@ -8,6 +8,13 @@ import { setup } from "qunit-dom";
 setEnvironment("testing");
 
 document.addEventListener("discourse-booted", () => {
+  const script = document.getElementById("plugin-test-script");
+  if (script && !requirejs.entries["discourse/tests/active-plugins"]) {
+    throw new Error(
+      `Plugin JS payload failed to load from ${script.src}. Is the Rails server running?`
+    );
+  }
+
   let setupTests = require("discourse/tests/setup-tests").default;
   const skippingCore =
     new URLSearchParams(window.location.search).get("qunit_skip_core") === "1";