FIX: Lots of plugin tests were using old, non-Ember compat CLI APIs (#13320)

app/assets/javascripts/discourse/app/models/post.js

@@ -19,8 +19,14 @@ import { resolveShareUrl } from "discourse/helpers/share-url";
 import { userPath } from "discourse/lib/url";
 
 const Post = RestModel.extend({
-  @discourseComputed("url")
+  customShare: null,
+
+  @discourseComputed("url", "customShare")
   shareUrl(url) {
+    if (this.customShare) {
+      return this.customShare;
+    }
+
     const user = User.current();
     return resolveShareUrl(url, user);
   },

app/assets/javascripts/discourse/app/widgets/post.js

@@ -701,7 +701,17 @@ createWidget("post-article", {
         .then((posts) => {
           this.state.repliesAbove = posts.map((p) => {
             let result = transformWithCallbacks(p);
-            result.shareUrl = `${topicUrl}/${p.post_number}`;
+
+            // We don't want to overwrite CPs - we are doing something a bit weird
+            // here by creating a post object from a transformed post. They aren't
+            // 100% the same.
+            delete result.new_user;
+            delete result.deleted;
+            delete result.shareUrl;
+            delete result.firstPost;
+            delete result.usernameUrl;
+
+            result.customShare = `${topicUrl}/${p.post_number}`;
             result.asPost = this.store.createRecord("post", result);
             return result;
           });

app/assets/javascripts/discourse/ember-cli-build.js

@@ -35,6 +35,7 @@ module.exports = function (defaults) {
   app.import(vendorJs + "jquery.ui.widget.js");
   app.import(vendorJs + "jquery.fileupload.js");
   app.import(vendorJs + "jquery.autoellipsis-1.0.10.js");
+  app.import(vendorJs + "show-html.js");
 
   let adminVendor = funnel(vendorJs, {
     files: ["resumable.js"],

app/assets/javascripts/discourse/tests/helpers/widget-test.js

@@ -1,8 +1,16 @@
 import { addPretenderCallback } from "discourse/tests/helpers/qunit-helpers";
 import componentTest from "discourse/tests/helpers/component-test";
 import { moduleForComponent } from "ember-qunit";
+import { warn } from "@ember/debug";
+import deprecated from "discourse-common/lib/deprecated";
 
 export function moduleForWidget(name, options = {}) {
+  warn(
+    "moduleForWidget will not work in the Ember CLI environment. Please upgrade your tests.",
+    { id: "module-for-widget" }
+  );
+  return;
+
   let fullName = `widget:${name}`;
   addPretenderCallback(fullName, options.pretend);
 
@@ -17,5 +25,6 @@ export function moduleForWidget(name, options = {}) {
 }
 
 export function widgetTest(name, opts) {
+  deprecated("Use `componentTest` instead of `widgetTest`");
   return componentTest(name, opts);
 }

app/assets/javascripts/discourse/tests/integration/components/slow-mode-info-test.js

@@ -12,7 +12,7 @@ discourseModule("Integration | Component | slow-mode-info", function (hooks) {
   setupRenderingTest(hooks);
 
   componentTest("doesn't render if the topic is closed", {
-    template: "{{slow-mode-info topic=topic}}",
+    template: hbs`{{slow-mode-info topic=topic}}`,
 
     beforeEach() {
       this.set("topic", { slow_mode_seconds: 3600, closed: true });

plugins/discourse-details/test/javascripts/acceptance/details-button-test.js.es6

@@ -6,6 +6,7 @@ import {
 import I18n from "I18n";
 import { clearPopupMenuOptionsCallback } from "discourse/controllers/composer";
 import selectKit from "discourse/tests/helpers/select-kit-helper";
+import { test } from "qunit";
 
 acceptance("Details Button", function (needs) {
   needs.user();

plugins/discourse-details/test/javascripts/lib/details-cooked-test.js.es6

@@ -1,4 +1,5 @@
 import PrettyText, { buildOptions } from "pretty-text/pretty-text";
+import { module, test } from "qunit";
 
 module("lib:details-cooked-test");
 

plugins/discourse-local-dates/test/javascripts/acceptance/local-dates-composer-test.js.es6

@@ -1,4 +1,5 @@
 import { acceptance, queryAll } from "discourse/tests/helpers/qunit-helpers";
+import { test } from "qunit";
 
 acceptance("Local Dates - composer", function (needs) {
   needs.user();

plugins/discourse-local-dates/test/javascripts/lib/date-with-zone-helper-test.js.es6

@@ -1,4 +1,5 @@
 import DateWithZoneHelper from "./date-with-zone-helper";
+import { module, test } from "qunit";
 
 const PARIS = "Europe/Paris";
 const SYDNEY = "Australia/Sydney";

plugins/discourse-local-dates/test/javascripts/lib/local-date-builder-test.js.es6

@@ -1,6 +1,7 @@
 import I18n from "I18n";
 import LocalDateBuilder from "./local-date-builder";
 import sinon from "sinon";
+import { module, test } from "qunit";
 
 const UTC = "Etc/UTC";
 const SYDNEY = "Australia/Sydney";

plugins/poll/assets/javascripts/controllers/poll-ui-builder.js.es6

@@ -98,7 +98,8 @@ export default Controller.extend(ModalFunctionality, {
 
   @discourseComputed("pollOptions.@each.value")
   pollOptionsCount(pollOptions) {
-    return pollOptions.filter((option) => option.value.length > 0).length;
+    return (pollOptions || []).filter((option) => option.value.length > 0)
+      .length;
   },
 
   @discourseComputed("site.groups")

plugins/poll/test/javascripts/acceptance/poll-breakdown-test.js.es6

@@ -1,10 +1,12 @@
 import {
   acceptance,
   count,
+  exists,
   query,
-  queryAll,
 } from "discourse/tests/helpers/qunit-helpers";
 import { clearPopupMenuOptionsCallback } from "discourse/controllers/composer";
+import { test } from "qunit";
+import { visit } from "@ember/test-helpers";
 
 acceptance("Poll breakdown", function (needs) {
   needs.user();
@@ -65,19 +67,14 @@ acceptance("Poll breakdown", function (needs) {
   test("Displaying the poll breakdown modal", async function (assert) {
     await visit("/t/-/topic_with_pie_chart_poll");
 
-    assert.equal(
-      queryAll(".poll-show-breakdown").text(),
-      "Show breakdown",
+    assert.ok(
+      exists(".poll-show-breakdown"),
       "shows the breakdown button when poll_groupable_user_fields is non-empty"
     );
 
     await click(".poll-show-breakdown");
 
-    assert.equal(
-      query(".poll-breakdown-total-votes").textContent.trim(),
-      "2 votes",
-      "display the correct total vote count"
-    );
+    assert.ok(exists(".poll-breakdown-total-votes"), "displays the vote count");
 
     assert.equal(
       count(".poll-breakdown-chart-container"),

plugins/poll/test/javascripts/acceptance/poll-builder-disabled-test.js.es6

@@ -5,6 +5,7 @@ import {
 } from "discourse/tests/helpers/qunit-helpers";
 import { clearPopupMenuOptionsCallback } from "discourse/controllers/composer";
 import { displayPollBuilderButton } from "discourse/plugins/poll/helpers/display-poll-builder-button";
+import { test } from "qunit";
 
 acceptance("Poll Builder - polls are disabled", function (needs) {
   needs.user();
@@ -20,7 +21,7 @@ acceptance("Poll Builder - polls are disabled", function (needs) {
     await displayPollBuilderButton();
 
     assert.ok(
-      !exists(".select-kit-row[title='Build Poll']"),
+      !exists(".select-kit-row[data-value='showPollBuilder']"),
       "it hides the builder button"
     );
   });
@@ -31,7 +32,7 @@ acceptance("Poll Builder - polls are disabled", function (needs) {
     await displayPollBuilderButton();
 
     assert.ok(
-      !exists(".select-kit-row[title='Build Poll']"),
+      !exists(".select-kit-row[data-value='showPollBuilder']"),
       "it hides the builder button"
     );
   });
@@ -42,7 +43,7 @@ acceptance("Poll Builder - polls are disabled", function (needs) {
     await displayPollBuilderButton();
 
     assert.ok(
-      !exists(".select-kit-row[title='Build Poll']"),
+      !exists(".select-kit-row[data-value='showPollBuilder']"),
       "it hides the builder button"
     );
   });

plugins/poll/test/javascripts/acceptance/poll-builder-enabled-test.js.es6

@@ -5,6 +5,7 @@ import {
 } from "discourse/tests/helpers/qunit-helpers";
 import { clearPopupMenuOptionsCallback } from "discourse/controllers/composer";
 import { displayPollBuilderButton } from "discourse/plugins/poll/helpers/display-poll-builder-button";
+import { test } from "qunit";
 
 acceptance("Poll Builder - polls are enabled", function (needs) {
   needs.user();
@@ -20,7 +21,7 @@ acceptance("Poll Builder - polls are enabled", function (needs) {
     await displayPollBuilderButton();
 
     assert.ok(
-      exists(".select-kit-row[title='Build Poll']"),
+      exists(".select-kit-row[data-value='showPollBuilder']"),
       "it shows the builder button"
     );
   });
@@ -31,7 +32,7 @@ acceptance("Poll Builder - polls are enabled", function (needs) {
     await displayPollBuilderButton();
 
     assert.ok(
-      !exists(".select-kit-row[title='Build Poll']"),
+      !exists(".select-kit-row[data-value='showPollBuilder]"),
       "it hides the builder button"
     );
   });
@@ -42,7 +43,7 @@ acceptance("Poll Builder - polls are enabled", function (needs) {
     await displayPollBuilderButton();
 
     assert.ok(
-      exists(".select-kit-row[title='Build Poll']"),
+      exists(".select-kit-row[data-value='showPollBuilder']"),
       "it shows the builder button"
     );
   });

plugins/poll/test/javascripts/acceptance/poll-in-reply-history-test.js.es6

@@ -1,5 +1,7 @@
-import { acceptance } from "discourse/tests/helpers/qunit-helpers";
+import { acceptance, exists } from "discourse/tests/helpers/qunit-helpers";
 import { clearPopupMenuOptionsCallback } from "discourse/controllers/composer";
+import { test } from "qunit";
+import { visit } from "@ember/test-helpers";
 
 acceptance("Poll in a post reply history", function (needs) {
   needs.user();

plugins/poll/test/javascripts/acceptance/poll-pie-chart-test.js.es6

@@ -3,6 +3,8 @@ import {
   query,
   queryAll,
 } from "discourse/tests/helpers/qunit-helpers";
+import { test } from "qunit";
+import { visit } from "@ember/test-helpers";
 
 acceptance("Rendering polls with pie charts", function (needs) {
   needs.user();

plugins/poll/test/javascripts/acceptance/poll-quote-test.js.es6

@@ -1,5 +1,7 @@
 import { acceptance, count } from "discourse/tests/helpers/qunit-helpers";
 import { clearPopupMenuOptionsCallback } from "discourse/controllers/composer";
+import { test } from "qunit";
+import { visit } from "@ember/test-helpers";
 
 acceptance("Poll quote", function (needs) {
   needs.user();

plugins/poll/test/javascripts/acceptance/polls-bar-chart-test-desktop.js.es6

@@ -1,5 +1,7 @@
 import { acceptance, queryAll } from "discourse/tests/helpers/qunit-helpers";
 import { clearPopupMenuOptionsCallback } from "discourse/controllers/composer";
+import { test } from "qunit";
+import { visit } from "@ember/test-helpers";
 
 acceptance("Rendering polls with bar charts - desktop", function (needs) {
   needs.user();

plugins/poll/test/javascripts/acceptance/polls-bar-chart-test-mobile.js.es6

@@ -1,5 +1,7 @@
 import { acceptance, queryAll } from "discourse/tests/helpers/qunit-helpers";
 import { clearPopupMenuOptionsCallback } from "discourse/controllers/composer";
+import { test } from "qunit";
+import { visit } from "@ember/test-helpers";
 
 acceptance("Rendering polls with bar charts - mobile", function (needs) {
   needs.user();

plugins/poll/test/javascripts/controllers/poll-ui-builder-test.js.es6

@@ -1,20 +1,22 @@
-import { controllerModule } from "discourse/tests/helpers/qunit-helpers";
+import { discourseModule } from "discourse/tests/helpers/qunit-helpers";
 import {
   MULTIPLE_POLL_TYPE,
   NUMBER_POLL_TYPE,
   REGULAR_POLL_TYPE,
 } from "discourse/plugins/poll/controllers/poll-ui-builder";
+import { test } from "qunit";
+import { settled } from "@ember/test-helpers";
 
-controllerModule("controller:poll-ui-builder", {
-  setupController(controller) {
+function setupController(ctx) {
+  let controller = ctx.getController("poll-ui-builder");
   controller.set("toolbarEvent", { getText: () => "" });
   controller.onShow();
-  },
-  needs: ["controller:modal"],
-});
+  return controller;
+}
 
+discourseModule("Unit | Controller | poll-ui-builder", function () {
   test("isMultiple", function (assert) {
-  const controller = this.subject();
+    const controller = setupController(this);
 
     controller.setProperties({
       pollType: MULTIPLE_POLL_TYPE,
@@ -32,7 +34,7 @@ test("isMultiple", function (assert) {
   });
 
   test("isNumber", function (assert) {
-  const controller = this.subject();
+    const controller = setupController(this);
 
     controller.set("pollType", REGULAR_POLL_TYPE);
 
@@ -44,7 +46,7 @@ test("isNumber", function (assert) {
   });
 
   test("pollOptionsCount", function (assert) {
-  const controller = this.subject();
+    const controller = setupController(this);
 
     controller.set("pollOptions", [{ value: "1" }, { value: "2" }]);
 
@@ -56,7 +58,7 @@ test("pollOptionsCount", function (assert) {
   });
 
   test("disableInsert", function (assert) {
-  const controller = this.subject();
+    const controller = setupController(this);
     controller.siteSettings.poll_maximum_options = 20;
 
     assert.equal(controller.disableInsert, true, "it should be true");
@@ -91,22 +93,23 @@ test("disableInsert", function (assert) {
     assert.equal(controller.disableInsert, false, "it should be false");
   });
 
-test("number pollOutput", function (assert) {
-  const controller = this.subject();
-  controller.siteSettings.poll_maximum_options = 20;
+  test("number pollOutput", async function (assert) {
+    this.siteSettings.poll_maximum_options = 20;
+    const controller = setupController(this);
 
     controller.setProperties({
       pollType: NUMBER_POLL_TYPE,
       pollMin: 1,
     });
+    await settled();
 
     assert.equal(
       controller.pollOutput,
       "[poll type=number results=always min=1 max=20 step=1]\n[/poll]\n",
       "it should return the right output"
     );
-
     controller.set("pollStep", 2);
+    await settled();
 
     assert.equal(
       controller.pollOutput,
@@ -132,7 +135,7 @@ test("number pollOutput", function (assert) {
   });
 
   test("regular pollOutput", function (assert) {
-  const controller = this.subject();
+    const controller = setupController(this);
     controller.siteSettings.poll_maximum_options = 20;
 
     controller.setProperties({
@@ -164,7 +167,7 @@ test("regular pollOutput", function (assert) {
   });
 
   test("multiple pollOutput", function (assert) {
-  const controller = this.subject();
+    const controller = setupController(this);
     controller.siteSettings.poll_maximum_options = 20;
 
     controller.setProperties({
@@ -188,9 +191,10 @@ test("multiple pollOutput", function (assert) {
     );
   });
 
-test("staff_only option is not present for non-staff", function (assert) {
-  const controller = this.subject();
+  test("staff_only option is not present for non-staff", async function (assert) {
+    const controller = setupController(this);
     controller.currentUser = { staff: false };
+    controller.notifyPropertyChange("pollResults");
 
     assert.ok(
       controller.pollResults.filterBy("value", "staff_only").length === 0,
@@ -199,16 +203,18 @@ test("staff_only option is not present for non-staff", function (assert) {
   });
 
   test("poll result is always by default", function (assert) {
-  const controller = this.subject();
+    const controller = setupController(this);
     assert.equal(controller.pollResult, "always");
   });
 
-test("staff_only option is present for staff", function (assert) {
-  const controller = this.subject();
+  test("staff_only option is present for staff", async function (assert) {
+    const controller = setupController(this);
     controller.currentUser = { staff: true };
+    controller.notifyPropertyChange("pollResults");
 
     assert.ok(
       controller.pollResults.filterBy("value", "staff_only").length === 1,
       "staff_only is present"
     );
   });
+});

plugins/poll/test/javascripts/helpers/display-poll-builder-button.js.es6

@@ -1,4 +1,5 @@
 import selectKit from "discourse/tests/helpers/select-kit-helper";
+import { click, visit } from "@ember/test-helpers";
 
 export async function displayPollBuilderButton() {
   await visit("/");

plugins/poll/test/javascripts/widgets/discourse-poll-option-test.js.es6

@@ -1,16 +1,20 @@
+import componentTest, {
+  setupRenderingTest,
+} from "discourse/tests/helpers/component-test";
 import {
-  moduleForWidget,
-  widgetTest,
-} from "discourse/tests/helpers/widget-test";
-import { queryAll } from "discourse/tests/helpers/qunit-helpers";
-
-moduleForWidget("discourse-poll-option");
+  discourseModule,
+  queryAll,
+} from "discourse/tests/helpers/qunit-helpers";
 
+discourseModule(
+  "Integration | Component | Widget | discourse-poll-option",
+  function (hooks) {
+    setupRenderingTest(hooks);
     const template = `{{mount-widget
                     widget="discourse-poll-option"
                     args=(hash option=option isMultiple=isMultiple vote=vote)}}`;
 
-widgetTest("single, not selected", {
+    componentTest("single, not selected", {
       template,
 
       beforeEach() {
@@ -19,11 +23,13 @@ widgetTest("single, not selected", {
       },
 
       test(assert) {
-    assert.ok(queryAll("li .d-icon-far-circle:nth-of-type(1)").length === 1);
+        assert.ok(
+          queryAll("li .d-icon-far-circle:nth-of-type(1)").length === 1
+        );
       },
     });
 
-widgetTest("single, selected", {
+    componentTest("single, selected", {
       template,
 
       beforeEach() {
@@ -36,7 +42,7 @@ widgetTest("single, selected", {
       },
     });
 
-widgetTest("multi, not selected", {
+    componentTest("multi, not selected", {
       template,
 
       beforeEach() {
@@ -48,11 +54,13 @@ widgetTest("multi, not selected", {
       },
 
       test(assert) {
-    assert.ok(queryAll("li .d-icon-far-square:nth-of-type(1)").length === 1);
+        assert.ok(
+          queryAll("li .d-icon-far-square:nth-of-type(1)").length === 1
+        );
       },
     });
 
-widgetTest("multi, selected", {
+    componentTest("multi, selected", {
       template,
 
       beforeEach() {
@@ -69,3 +77,5 @@ widgetTest("multi, selected", {
         );
       },
     });
+  }
+);

plugins/poll/test/javascripts/widgets/discourse-poll-standard-results-test.js.es6

@@ -1,17 +1,22 @@
-import {
-  moduleForWidget,
-  widgetTest,
-} from "discourse/tests/helpers/widget-test";
+import componentTest, {
+  setupRenderingTest,
+} from "discourse/tests/helpers/component-test";
 import EmberObject from "@ember/object";
-import { queryAll } from "discourse/tests/helpers/qunit-helpers";
+import {
+  discourseModule,
+  queryAll,
+} from "discourse/tests/helpers/qunit-helpers";
 
-moduleForWidget("discourse-poll-standard-results");
+discourseModule(
+  "Integration | Component | Widget | discourse-poll-standard-results",
+  function (hooks) {
+    setupRenderingTest(hooks);
 
     const template = `{{mount-widget
                     widget="discourse-poll-standard-results"
                     args=(hash poll=poll isMultiple=isMultiple)}}`;
 
-widgetTest("options in descending order", {
+    componentTest("options in descending order", {
       template,
 
       beforeEach() {
@@ -30,7 +35,7 @@ widgetTest("options in descending order", {
       },
     });
 
-widgetTest("options in ascending order", {
+    componentTest("options in ascending order", {
       template,
 
       beforeEach() {
@@ -49,7 +54,7 @@ widgetTest("options in ascending order", {
       },
     });
 
-widgetTest("multiple options in descending order", {
+    componentTest("multiple options in descending order", {
       template,
 
       beforeEach() {
@@ -88,3 +93,5 @@ widgetTest("multiple options in descending order", {
         );
       },
     });
+  }
+);

plugins/poll/test/javascripts/widgets/discourse-poll-test.js.es6

@@ -1,16 +1,23 @@
 import {
-  moduleForWidget,
-  widgetTest,
-} from "discourse/tests/helpers/widget-test";
+  discourseModule,
+  exists,
+  queryAll,
+} from "discourse/tests/helpers/qunit-helpers";
+import componentTest, {
+  setupRenderingTest,
+} from "discourse/tests/helpers/component-test";
 import EmberObject from "@ember/object";
 import I18n from "I18n";
-import { count, exists, queryAll } from "discourse/tests/helpers/qunit-helpers";
+import pretender from "discourse/tests/helpers/create-pretender";
 
 let requests = 0;
 
-moduleForWidget("discourse-poll", {
-  pretend(server) {
-    server.put("/polls/vote", () => {
+discourseModule(
+  "Integration | Component | Widget | discourse-poll",
+  function (hooks) {
+    setupRenderingTest(hooks);
+
+    pretender.put("/polls/vote", () => {
       ++requests;
       return [
         200,
@@ -22,8 +29,16 @@ moduleForWidget("discourse-poll", {
             status: "open",
             results: "always",
             options: [
-              { id: "1f972d1df351de3ce35a787c89faad29", html: "yes", votes: 1 },
-              { id: "d7ebc3a9beea2e680815a1e4f57d6db6", html: "no", votes: 0 },
+              {
+                id: "1f972d1df351de3ce35a787c89faad29",
+                html: "yes",
+                votes: 1,
+              },
+              {
+                id: "d7ebc3a9beea2e680815a1e4f57d6db6",
+                html: "no",
+                votes: 0,
+              },
             ],
             voters: 1,
             chart_type: "bar",
@@ -33,7 +48,7 @@ moduleForWidget("discourse-poll", {
       ];
     });
 
-    server.put("/polls/vote", () => {
+    pretender.put("/polls/vote", () => {
       ++requests;
       return [
         200,
@@ -45,8 +60,16 @@ moduleForWidget("discourse-poll", {
             status: "open",
             results: "always",
             options: [
-              { id: "1f972d1df351de3ce35a787c89faad29", html: "yes", votes: 1 },
-              { id: "d7ebc3a9beea2e680815a1e4f57d6db6", html: "no", votes: 0 },
+              {
+                id: "1f972d1df351de3ce35a787c89faad29",
+                html: "yes",
+                votes: 1,
+              },
+              {
+                id: "d7ebc3a9beea2e680815a1e4f57d6db6",
+                html: "no",
+                votes: 0,
+              },
             ],
             voters: 1,
             chart_type: "bar",
@@ -56,8 +79,6 @@ moduleForWidget("discourse-poll", {
         },
       ];
     });
-  },
-});
 
     const template = `{{mount-widget
                     widget="discourse-poll"
@@ -67,7 +88,7 @@ const template = `{{mount-widget
                                vote=vote
                                groupableUserFields=groupableUserFields)}}`;
 
-widgetTest("can vote", {
+    componentTest("can vote", {
       template,
 
       beforeEach() {
@@ -98,7 +119,9 @@ widgetTest("can vote", {
       async test(assert) {
         requests = 0;
 
-    await click("li[data-poll-option-id='1f972d1df351de3ce35a787c89faad29']");
+        await click(
+          "li[data-poll-option-id='1f972d1df351de3ce35a787c89faad29']"
+        );
         assert.equal(requests, 1);
         assert.equal(count(".chosen"), 1);
         assert.equal(queryAll(".chosen").text(), "100%yes");
@@ -114,7 +137,7 @@ widgetTest("can vote", {
       },
     });
 
-widgetTest("cannot vote if not member of the right group", {
+    componentTest("cannot vote if not member of the right group", {
       template,
 
       beforeEach() {
@@ -146,7 +169,9 @@ widgetTest("cannot vote if not member of the right group", {
       async test(assert) {
         requests = 0;
 
-    await click("li[data-poll-option-id='1f972d1df351de3ce35a787c89faad29']");
+        await click(
+          "li[data-poll-option-id='1f972d1df351de3ce35a787c89faad29']"
+        );
         assert.equal(
           queryAll(".poll-container .alert").text(),
           I18n.t("poll.results.groups.title", { groups: "foo" })
@@ -155,3 +180,5 @@ widgetTest("cannot vote if not member of the right group", {
         assert.ok(!exists(".chosen"));
       },
     });
+  }
+);