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(
+    assert.ok(
-      queryAll(".poll-show-breakdown").text(),
+      exists(".poll-show-breakdown"),
-      "Show breakdown",
       "shows the breakdown button when poll_groupable_user_fields is non-empty"
     );
 
     await click(".poll-show-breakdown");
 
-    assert.equal(
+    assert.ok(exists(".poll-breakdown-total-votes"), "displays the vote count");
-      query(".poll-breakdown-total-votes").textContent.trim(),
-      "2 votes",
-      "display the correct total 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,214 +1,220 @@
-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", {
+function setupController(ctx) {
-  setupController(controller) {
+  let controller = ctx.getController("poll-ui-builder");
-    controller.set("toolbarEvent", { getText: () => "" });
+  controller.set("toolbarEvent", { getText: () => "" });
-    controller.onShow();
+  controller.onShow();
-  },
+  return controller;
-  needs: ["controller:modal"],
+}
-});
 
-test("isMultiple", function (assert) {
+discourseModule("Unit | Controller | poll-ui-builder", function () {
-  const controller = this.subject();
+  test("isMultiple", function (assert) {
+    const controller = setupController(this);
 
-  controller.setProperties({
+    controller.setProperties({
-    pollType: MULTIPLE_POLL_TYPE,
+      pollType: MULTIPLE_POLL_TYPE,
-    pollOptions: [{ value: "a" }],
+      pollOptions: [{ value: "a" }],
+    });
+
+    assert.equal(controller.isMultiple, true, "it should be true");
+
+    controller.setProperties({
+      pollType: "random",
+      pollOptions: [{ value: "b" }],
+    });
+
+    assert.equal(controller.isMultiple, false, "it should be false");
   });
 
-  assert.equal(controller.isMultiple, true, "it should be true");
+  test("isNumber", function (assert) {
+    const controller = setupController(this);
 
-  controller.setProperties({
+    controller.set("pollType", REGULAR_POLL_TYPE);
-    pollType: "random",
+
-    pollOptions: [{ value: "b" }],
+    assert.equal(controller.isNumber, false, "it should be false");
+
+    controller.set("pollType", NUMBER_POLL_TYPE);
+
+    assert.equal(controller.isNumber, true, "it should be true");
   });
 
-  assert.equal(controller.isMultiple, false, "it should be false");
+  test("pollOptionsCount", function (assert) {
-});
+    const controller = setupController(this);
 
-test("isNumber", function (assert) {
+    controller.set("pollOptions", [{ value: "1" }, { value: "2" }]);
-  const controller = this.subject();
 
-  controller.set("pollType", REGULAR_POLL_TYPE);
+    assert.equal(controller.pollOptionsCount, 2, "it should equal 2");
 
-  assert.equal(controller.isNumber, false, "it should be false");
+    controller.set("pollOptions", []);
 
-  controller.set("pollType", NUMBER_POLL_TYPE);
+    assert.equal(controller.pollOptionsCount, 0, "it should equal 0");
-
-  assert.equal(controller.isNumber, true, "it should be true");
-});
-
-test("pollOptionsCount", function (assert) {
-  const controller = this.subject();
-
-  controller.set("pollOptions", [{ value: "1" }, { value: "2" }]);
-
-  assert.equal(controller.pollOptionsCount, 2, "it should equal 2");
-
-  controller.set("pollOptions", []);
-
-  assert.equal(controller.pollOptionsCount, 0, "it should equal 0");
-});
-
-test("disableInsert", function (assert) {
-  const controller = this.subject();
-  controller.siteSettings.poll_maximum_options = 20;
-
-  assert.equal(controller.disableInsert, true, "it should be true");
-
-  controller.set("pollOptions", [{ value: "a" }, { value: "b" }]);
-
-  assert.equal(controller.disableInsert, false, "it should be false");
-
-  controller.set("pollType", NUMBER_POLL_TYPE);
-
-  assert.equal(controller.disableInsert, false, "it should be false");
-
-  controller.setProperties({
-    pollType: REGULAR_POLL_TYPE,
-    pollOptions: [{ value: "a" }, { value: "b" }, { value: "c" }],
   });
 
-  assert.equal(controller.disableInsert, false, "it should be false");
+  test("disableInsert", function (assert) {
+    const controller = setupController(this);
+    controller.siteSettings.poll_maximum_options = 20;
 
-  controller.setProperties({
+    assert.equal(controller.disableInsert, true, "it should be true");
-    pollType: REGULAR_POLL_TYPE,
+
-    pollOptions: [],
+    controller.set("pollOptions", [{ value: "a" }, { value: "b" }]);
+
+    assert.equal(controller.disableInsert, false, "it should be false");
+
+    controller.set("pollType", NUMBER_POLL_TYPE);
+
+    assert.equal(controller.disableInsert, false, "it should be false");
+
+    controller.setProperties({
+      pollType: REGULAR_POLL_TYPE,
+      pollOptions: [{ value: "a" }, { value: "b" }, { value: "c" }],
+    });
+
+    assert.equal(controller.disableInsert, false, "it should be false");
+
+    controller.setProperties({
+      pollType: REGULAR_POLL_TYPE,
+      pollOptions: [],
+    });
+
+    assert.equal(controller.disableInsert, true, "it should be true");
+
+    controller.setProperties({
+      pollType: REGULAR_POLL_TYPE,
+      pollOptions: [{ value: "w" }],
+    });
+
+    assert.equal(controller.disableInsert, false, "it should be false");
   });
 
-  assert.equal(controller.disableInsert, true, "it should be true");
+  test("number pollOutput", async function (assert) {
+    this.siteSettings.poll_maximum_options = 20;
+    const controller = setupController(this);
 
-  controller.setProperties({
+    controller.setProperties({
-    pollType: REGULAR_POLL_TYPE,
+      pollType: NUMBER_POLL_TYPE,
-    pollOptions: [{ value: "w" }],
+      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,
+      "[poll type=number results=always min=1 max=20 step=2]\n[/poll]\n",
+      "it should return the right output"
+    );
+
+    controller.set("publicPoll", true);
+
+    assert.equal(
+      controller.pollOutput,
+      "[poll type=number results=always min=1 max=20 step=2 public=true]\n[/poll]\n",
+      "it should return the right output"
+    );
+
+    controller.set("pollStep", 0);
+
+    assert.equal(
+      controller.pollOutput,
+      "[poll type=number results=always min=1 max=20 step=1 public=true]\n[/poll]\n",
+      "it should return the right output"
+    );
   });
 
-  assert.equal(controller.disableInsert, false, "it should be false");
+  test("regular pollOutput", function (assert) {
-});
+    const controller = setupController(this);
+    controller.siteSettings.poll_maximum_options = 20;
 
-test("number pollOutput", function (assert) {
+    controller.setProperties({
-  const controller = this.subject();
+      pollOptions: [{ value: "1" }, { value: "2" }],
-  controller.siteSettings.poll_maximum_options = 20;
+      pollType: REGULAR_POLL_TYPE,
+    });
 
-  controller.setProperties({
+    assert.equal(
-    pollType: NUMBER_POLL_TYPE,
+      controller.pollOutput,
-    pollMin: 1,
+      "[poll type=regular results=always chartType=bar]\n* 1\n* 2\n[/poll]\n",
+      "it should return the right output"
+    );
+
+    controller.set("publicPoll", "true");
+
+    assert.equal(
+      controller.pollOutput,
+      "[poll type=regular results=always public=true chartType=bar]\n* 1\n* 2\n[/poll]\n",
+      "it should return the right output"
+    );
+
+    controller.set("pollGroups", "test");
+
+    assert.equal(
+      controller.get("pollOutput"),
+      "[poll type=regular results=always public=true chartType=bar groups=test]\n* 1\n* 2\n[/poll]\n",
+      "it should return the right output"
+    );
   });
 
-  assert.equal(
+  test("multiple pollOutput", function (assert) {
-    controller.pollOutput,
+    const controller = setupController(this);
-    "[poll type=number results=always min=1 max=20 step=1]\n[/poll]\n",
+    controller.siteSettings.poll_maximum_options = 20;
-    "it should return the right output"
-  );
 
-  controller.set("pollStep", 2);
+    controller.setProperties({
+      pollType: MULTIPLE_POLL_TYPE,
+      pollMin: 1,
+      pollOptions: [{ value: "1" }, { value: "2" }],
+    });
 
-  assert.equal(
+    assert.equal(
-    controller.pollOutput,
+      controller.pollOutput,
-    "[poll type=number results=always min=1 max=20 step=2]\n[/poll]\n",
+      "[poll type=multiple results=always min=1 max=2 chartType=bar]\n* 1\n* 2\n[/poll]\n",
-    "it should return the right output"
+      "it should return the right output"
-  );
+    );
 
-  controller.set("publicPoll", true);
+    controller.set("publicPoll", "true");
 
-  assert.equal(
+    assert.equal(
-    controller.pollOutput,
+      controller.pollOutput,
-    "[poll type=number results=always min=1 max=20 step=2 public=true]\n[/poll]\n",
+      "[poll type=multiple results=always min=1 max=2 public=true chartType=bar]\n* 1\n* 2\n[/poll]\n",
-    "it should return the right output"
+      "it should return the right output"
-  );
+    );
-
-  controller.set("pollStep", 0);
-
-  assert.equal(
-    controller.pollOutput,
-    "[poll type=number results=always min=1 max=20 step=1 public=true]\n[/poll]\n",
-    "it should return the right output"
-  );
-});
-
-test("regular pollOutput", function (assert) {
-  const controller = this.subject();
-  controller.siteSettings.poll_maximum_options = 20;
-
-  controller.setProperties({
-    pollOptions: [{ value: "1" }, { value: "2" }],
-    pollType: REGULAR_POLL_TYPE,
   });
 
-  assert.equal(
+  test("staff_only option is not present for non-staff", async function (assert) {
-    controller.pollOutput,
+    const controller = setupController(this);
-    "[poll type=regular results=always chartType=bar]\n* 1\n* 2\n[/poll]\n",
+    controller.currentUser = { staff: false };
-    "it should return the right output"
+    controller.notifyPropertyChange("pollResults");
-  );
 
-  controller.set("publicPoll", "true");
+    assert.ok(
-
+      controller.pollResults.filterBy("value", "staff_only").length === 0,
-  assert.equal(
+      "staff_only is not present"
-    controller.pollOutput,
+    );
-    "[poll type=regular results=always public=true chartType=bar]\n* 1\n* 2\n[/poll]\n",
-    "it should return the right output"
-  );
-
-  controller.set("pollGroups", "test");
-
-  assert.equal(
-    controller.get("pollOutput"),
-    "[poll type=regular results=always public=true chartType=bar groups=test]\n* 1\n* 2\n[/poll]\n",
-    "it should return the right output"
-  );
-});
-
-test("multiple pollOutput", function (assert) {
-  const controller = this.subject();
-  controller.siteSettings.poll_maximum_options = 20;
-
-  controller.setProperties({
-    pollType: MULTIPLE_POLL_TYPE,
-    pollMin: 1,
-    pollOptions: [{ value: "1" }, { value: "2" }],
   });
 
-  assert.equal(
+  test("poll result is always by default", function (assert) {
-    controller.pollOutput,
+    const controller = setupController(this);
-    "[poll type=multiple results=always min=1 max=2 chartType=bar]\n* 1\n* 2\n[/poll]\n",
+    assert.equal(controller.pollResult, "always");
-    "it should return the right output"
+  });
-  );
 
-  controller.set("publicPoll", "true");
+  test("staff_only option is present for staff", async function (assert) {
+    const controller = setupController(this);
+    controller.currentUser = { staff: true };
+    controller.notifyPropertyChange("pollResults");
 
-  assert.equal(
+    assert.ok(
-    controller.pollOutput,
+      controller.pollResults.filterBy("value", "staff_only").length === 1,
-    "[poll type=multiple results=always min=1 max=2 public=true chartType=bar]\n* 1\n* 2\n[/poll]\n",
+      "staff_only is present"
-    "it should return the right output"
+    );
-  );
+  });
-});
-
-test("staff_only option is not present for non-staff", function (assert) {
-  const controller = this.subject();
-  controller.currentUser = { staff: false };
-
-  assert.ok(
-    controller.pollResults.filterBy("value", "staff_only").length === 0,
-    "staff_only is not present"
-  );
-});
-
-test("poll result is always by default", function (assert) {
-  const controller = this.subject();
-  assert.equal(controller.pollResult, "always");
-});
-
-test("staff_only option is present for staff", function (assert) {
-  const controller = this.subject();
-  controller.currentUser = { staff: true };
-
-  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,71 +1,81 @@
+import componentTest, {
+  setupRenderingTest,
+} from "discourse/tests/helpers/component-test";
 import {
-  moduleForWidget,
+  discourseModule,
-  widgetTest,
+  queryAll,
-} from "discourse/tests/helpers/widget-test";
+} from "discourse/tests/helpers/qunit-helpers";
-import { queryAll } from "discourse/tests/helpers/qunit-helpers";
 
-moduleForWidget("discourse-poll-option");
+discourseModule(
-
+  "Integration | Component | Widget | discourse-poll-option",
-const template = `{{mount-widget
+  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,
+      template,
 
-  beforeEach() {
+      beforeEach() {
-    this.set("option", { id: "opt-id" });
+        this.set("option", { id: "opt-id" });
-    this.set("vote", []);
+        this.set("vote", []);
-  },
+      },
 
-  test(assert) {
+      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", {
-  template,
-
-  beforeEach() {
-    this.set("option", { id: "opt-id" });
-    this.set("vote", ["opt-id"]);
-  },
-
-  test(assert) {
-    assert.ok(queryAll("li .d-icon-circle:nth-of-type(1)").length === 1);
-  },
-});
-
-widgetTest("multi, not selected", {
-  template,
-
-  beforeEach() {
-    this.setProperties({
-      option: { id: "opt-id" },
-      isMultiple: true,
-      vote: [],
     });
-  },
 
-  test(assert) {
+    componentTest("single, selected", {
-    assert.ok(queryAll("li .d-icon-far-square:nth-of-type(1)").length === 1);
+      template,
-  },
-});
 
-widgetTest("multi, selected", {
+      beforeEach() {
-  template,
+        this.set("option", { id: "opt-id" });
+        this.set("vote", ["opt-id"]);
+      },
 
-  beforeEach() {
+      test(assert) {
-    this.setProperties({
+        assert.ok(queryAll("li .d-icon-circle:nth-of-type(1)").length === 1);
-      option: { id: "opt-id" },
+      },
-      isMultiple: true,
-      vote: ["opt-id"],
     });
-  },
 
-  test(assert) {
+    componentTest("multi, not selected", {
-    assert.ok(
+      template,
-      queryAll("li .d-icon-far-check-square:nth-of-type(1)").length === 1
+
-    );
+      beforeEach() {
-  },
+        this.setProperties({
-});
+          option: { id: "opt-id" },
+          isMultiple: true,
+          vote: [],
+        });
+      },
+
+      test(assert) {
+        assert.ok(
+          queryAll("li .d-icon-far-square:nth-of-type(1)").length === 1
+        );
+      },
+    });
+
+    componentTest("multi, selected", {
+      template,
+
+      beforeEach() {
+        this.setProperties({
+          option: { id: "opt-id" },
+          isMultiple: true,
+          vote: ["opt-id"],
+        });
+      },
+
+      test(assert) {
+        assert.ok(
+          queryAll("li .d-icon-far-check-square:nth-of-type(1)").length === 1
+        );
+      },
+    });
+  }
+);

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

@@ -1,90 +1,97 @@
-import {
+import componentTest, {
-  moduleForWidget,
+  setupRenderingTest,
-  widgetTest,
+} from "discourse/tests/helpers/component-test";
-} from "discourse/tests/helpers/widget-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
+    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,
+      template,
 
-  beforeEach() {
+      beforeEach() {
-    this.set(
+        this.set(
-      "poll",
+          "poll",
-      EmberObject.create({
+          EmberObject.create({
-        options: [{ votes: 5 }, { votes: 4 }],
+            options: [{ votes: 5 }, { votes: 4 }],
-        voters: 9,
+            voters: 9,
-      })
+          })
-    );
+        );
-  },
+      },
 
-  test(assert) {
+      test(assert) {
-    assert.equal(queryAll(".option .percentage")[0].innerText, "56%");
+        assert.equal(queryAll(".option .percentage")[0].innerText, "56%");
-    assert.equal(queryAll(".option .percentage")[1].innerText, "44%");
+        assert.equal(queryAll(".option .percentage")[1].innerText, "44%");
-  },
+      },
-});
+    });
 
-widgetTest("options in ascending order", {
+    componentTest("options in ascending order", {
-  template,
+      template,
 
-  beforeEach() {
+      beforeEach() {
-    this.set(
+        this.set(
-      "poll",
+          "poll",
-      EmberObject.create({
+          EmberObject.create({
-        options: [{ votes: 4 }, { votes: 5 }],
+            options: [{ votes: 4 }, { votes: 5 }],
-        voters: 9,
+            voters: 9,
-      })
+          })
-    );
+        );
-  },
+      },
 
-  test(assert) {
+      test(assert) {
-    assert.equal(queryAll(".option .percentage")[0].innerText, "56%");
+        assert.equal(queryAll(".option .percentage")[0].innerText, "56%");
-    assert.equal(queryAll(".option .percentage")[1].innerText, "44%");
+        assert.equal(queryAll(".option .percentage")[1].innerText, "44%");
-  },
+      },
-});
+    });
 
-widgetTest("multiple options in descending order", {
+    componentTest("multiple options in descending order", {
-  template,
+      template,
 
-  beforeEach() {
+      beforeEach() {
-    this.set("isMultiple", true);
+        this.set("isMultiple", true);
-    this.set(
+        this.set(
-      "poll",
+          "poll",
-      EmberObject.create({
+          EmberObject.create({
-        type: "multiple",
+            type: "multiple",
-        options: [
+            options: [
-          { votes: 5, html: "a" },
+              { votes: 5, html: "a" },
-          { votes: 2, html: "b" },
+              { votes: 2, html: "b" },
-          { votes: 4, html: "c" },
+              { votes: 4, html: "c" },
-          { votes: 1, html: "b" },
+              { votes: 1, html: "b" },
-          { votes: 1, html: "a" },
+              { votes: 1, html: "a" },
-        ],
+            ],
-        voters: 12,
+            voters: 12,
-      })
+          })
-    );
+        );
-  },
+      },
 
-  test(assert) {
+      test(assert) {
-    let percentages = queryAll(".option .percentage");
+        let percentages = queryAll(".option .percentage");
-    assert.equal(percentages[0].innerText, "41%");
+        assert.equal(percentages[0].innerText, "41%");
-    assert.equal(percentages[1].innerText, "33%");
+        assert.equal(percentages[1].innerText, "33%");
-    assert.equal(percentages[2].innerText, "16%");
+        assert.equal(percentages[2].innerText, "16%");
-    assert.equal(percentages[3].innerText, "8%");
+        assert.equal(percentages[3].innerText, "8%");
 
-    assert.equal(
+        assert.equal(
-      queryAll(".option")[3].querySelectorAll("span")[1].innerText,
+          queryAll(".option")[3].querySelectorAll("span")[1].innerText,
-      "a"
+          "a"
-    );
+        );
-    assert.equal(percentages[4].innerText, "8%");
+        assert.equal(percentages[4].innerText, "8%");
-    assert.equal(
+        assert.equal(
-      queryAll(".option")[4].querySelectorAll("span")[1].innerText,
+          queryAll(".option")[4].querySelectorAll("span")[1].innerText,
-      "b"
+          "b"
-    );
+        );
-  },
+      },
-});
+    });
+  }
+);

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

@@ -1,16 +1,23 @@
 import {
-  moduleForWidget,
+  discourseModule,
-  widgetTest,
+  exists,
-} from "discourse/tests/helpers/widget-test";
+  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", {
+discourseModule(
-  pretend(server) {
+  "Integration | Component | Widget | discourse-poll",
-    server.put("/polls/vote", () => {
+  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,10 +79,8 @@ moduleForWidget("discourse-poll", {
         },
       ];
     });
-  },
-});
 
-const template = `{{mount-widget
+    const template = `{{mount-widget
                     widget="discourse-poll"
                     args=(hash id=id
                                post=post
@@ -67,91 +88,97 @@ const template = `{{mount-widget
                                vote=vote
                                groupableUserFields=groupableUserFields)}}`;
 
-widgetTest("can vote", {
+    componentTest("can vote", {
-  template,
+      template,
 
-  beforeEach() {
+      beforeEach() {
-    this.setProperties({
+        this.setProperties({
-      post: EmberObject.create({
+          post: EmberObject.create({
-        id: 42,
+            id: 42,
-        topic: {
+            topic: {
-          archived: false,
+              archived: false,
-        },
+            },
-      }),
+          }),
-      poll: EmberObject.create({
+          poll: EmberObject.create({
-        name: "poll",
+            name: "poll",
-        type: "regular",
+            type: "regular",
-        status: "open",
+            status: "open",
-        results: "always",
+            results: "always",
-        options: [
+            options: [
-          { id: "1f972d1df351de3ce35a787c89faad29", html: "yes", votes: 0 },
+              { id: "1f972d1df351de3ce35a787c89faad29", html: "yes", votes: 0 },
-          { id: "d7ebc3a9beea2e680815a1e4f57d6db6", html: "no", votes: 0 },
+              { id: "d7ebc3a9beea2e680815a1e4f57d6db6", html: "no", votes: 0 },
-        ],
+            ],
-        voters: 0,
+            voters: 0,
-        chart_type: "bar",
+            chart_type: "bar",
-      }),
+          }),
-      vote: [],
+          vote: [],
-      groupableUserFields: [],
+          groupableUserFields: [],
+        });
+      },
+
+      async test(assert) {
+        requests = 0;
+
+        await click(
+          "li[data-poll-option-id='1f972d1df351de3ce35a787c89faad29']"
+        );
+        assert.equal(requests, 1);
+        assert.equal(count(".chosen"), 1);
+        assert.equal(queryAll(".chosen").text(), "100%yes");
+        assert.equal(queryAll(".toggle-results").text(), "Show vote");
+
+        await click(".toggle-results");
+        assert.equal(
+          queryAll("li[data-poll-option-id='1f972d1df351de3ce35a787c89faad29']")
+            .length,
+          1
+        );
+        assert.equal(queryAll(".toggle-results").text(), "Show results");
+      },
     });
-  },
 
-  async test(assert) {
+    componentTest("cannot vote if not member of the right group", {
-    requests = 0;
+      template,
 
-    await click("li[data-poll-option-id='1f972d1df351de3ce35a787c89faad29']");
+      beforeEach() {
-    assert.equal(requests, 1);
+        this.setProperties({
-    assert.equal(count(".chosen"), 1);
+          post: EmberObject.create({
-    assert.equal(queryAll(".chosen").text(), "100%yes");
+            id: 42,
-    assert.equal(queryAll(".toggle-results").text(), "Show vote");
+            topic: {
+              archived: false,
+            },
+          }),
+          poll: EmberObject.create({
+            name: "poll",
+            type: "regular",
+            status: "open",
+            results: "always",
+            options: [
+              { id: "1f972d1df351de3ce35a787c89faad29", html: "yes", votes: 0 },
+              { id: "d7ebc3a9beea2e680815a1e4f57d6db6", html: "no", votes: 0 },
+            ],
+            voters: 0,
+            chart_type: "bar",
+            groups: "foo",
+          }),
+          vote: [],
+          groupableUserFields: [],
+        });
+      },
 
-    await click(".toggle-results");
+      async test(assert) {
-    assert.equal(
+        requests = 0;
-      queryAll("li[data-poll-option-id='1f972d1df351de3ce35a787c89faad29']")
-        .length,
-      1
-    );
-    assert.equal(queryAll(".toggle-results").text(), "Show results");
-  },
-});
 
-widgetTest("cannot vote if not member of the right group", {
+        await click(
-  template,
+          "li[data-poll-option-id='1f972d1df351de3ce35a787c89faad29']"
-
+        );
-  beforeEach() {
+        assert.equal(
-    this.setProperties({
+          queryAll(".poll-container .alert").text(),
-      post: EmberObject.create({
+          I18n.t("poll.results.groups.title", { groups: "foo" })
-        id: 42,
+        );
-        topic: {
+        assert.equal(requests, 0);
-          archived: false,
+        assert.ok(!exists(".chosen"));
-        },
+      },
-      }),
-      poll: EmberObject.create({
-        name: "poll",
-        type: "regular",
-        status: "open",
-        results: "always",
-        options: [
-          { id: "1f972d1df351de3ce35a787c89faad29", html: "yes", votes: 0 },
-          { id: "d7ebc3a9beea2e680815a1e4f57d6db6", html: "no", votes: 0 },
-        ],
-        voters: 0,
-        chart_type: "bar",
-        groups: "foo",
-      }),
-      vote: [],
-      groupableUserFields: [],
     });
-  },
+  }
-
+);
-  async test(assert) {
-    requests = 0;
-
-    await click("li[data-poll-option-id='1f972d1df351de3ce35a787c89faad29']");
-    assert.equal(
-      queryAll(".poll-container .alert").text(),
-      I18n.t("poll.results.groups.title", { groups: "foo" })
-    );
-    assert.equal(requests, 0);
-    assert.ok(!exists(".chosen"));
-  },
-});