From d16a2c776a859d83ee7da29b429f0db126dde3c0 Mon Sep 17 00:00:00 2001 From: Maja Komel Date: Tue, 24 Jul 2018 20:12:09 +0200 Subject: [PATCH] DEV: migrate components tests to async/await --- .../components/admin-report-test.js.es6 | 145 ++++---- .../categories-admin-dropdown-test.js.es6 | 8 +- .../components/category-chooser-test.js.es6 | 252 ++++++------- .../components/combo-box-test.js.es6 | 352 ++++++++---------- .../components/pinned-options-test.js.es6 | 32 +- .../topic-footer-mobile-dropdown-test.js.es6 | 72 ++-- .../topic-notifications-button-test.js.es6 | 52 ++- .../topic-notifications-options-test.js.es6 | 56 ++- .../components/value-list-test.js.es6 | 59 ++- test/javascripts/helpers/select-kit-helper.js | 206 +++++++--- 10 files changed, 619 insertions(+), 615 deletions(-) diff --git a/test/javascripts/components/admin-report-test.js.es6 b/test/javascripts/components/admin-report-test.js.es6 index 5aa62740a68..900886db887 100644 --- a/test/javascripts/components/admin-report-test.js.es6 +++ b/test/javascripts/components/admin-report-test.js.es6 @@ -7,73 +7,69 @@ moduleForComponent("admin-report", { componentTest("default", { template: "{{admin-report dataSourceName='signups'}}", - test(assert) { - andThen(() => { - assert.ok(exists(".admin-report.signups")); + async test(assert) { + assert.ok(exists(".admin-report.signups")); - assert.ok( - exists(".admin-report.table.signups", "it defaults to table mode") - ); + assert.ok( + exists(".admin-report.table.signups", "it defaults to table mode") + ); - assert.equal( - find(".report-header .title") - .text() - .trim(), - "Signups", - "it has a title" - ); + assert.equal( + find(".report-header .title") + .text() + .trim(), + "Signups", + "it has a title" + ); - assert.equal( - find(".report-header .info").attr("data-tooltip"), - "New account registrations for this period", - "it has a description" - ); + assert.equal( + find(".report-header .info").attr("data-tooltip"), + "New account registrations for this period", + "it has a description" + ); - assert.equal( - find(".report-body .report-table thead tr th:first-child") - .text() - .trim(), - "Day", - "it has col headers" - ); + assert.equal( + find(".report-body .report-table thead tr th:first-child") + .text() + .trim(), + "Day", + "it has col headers" + ); - assert.equal( - find(".report-body .report-table thead tr th:nth-child(2)") - .text() - .trim(), - "Count", - "it has col headers" - ); + assert.equal( + find(".report-body .report-table thead tr th:nth-child(2)") + .text() + .trim(), + "Count", + "it has col headers" + ); - assert.equal( - find(".report-body .report-table tbody tr:nth-child(1) td:nth-child(1)") - .text() - .trim(), - "June 16, 2018", - "it has rows" - ); + assert.equal( + find(".report-body .report-table tbody tr:nth-child(1) td:nth-child(1)") + .text() + .trim(), + "June 16, 2018", + "it has rows" + ); - assert.equal( - find(".report-body .report-table tbody tr:nth-child(1) td:nth-child(2)") - .text() - .trim(), - "12", - "it has rows" - ); + assert.equal( + find(".report-body .report-table tbody tr:nth-child(1) td:nth-child(2)") + .text() + .trim(), + "12", + "it has rows" + ); - assert.ok(exists(".totals-sample-table"), "it has totals"); - }); + assert.ok(exists(".totals-sample-table"), "it has totals"); - click(".admin-report-table-header.y .sort-button"); - andThen(() => { - assert.equal( - find(".report-body .report-table tbody tr:nth-child(1) td:nth-child(2)") - .text() - .trim(), - "7", - "it can sort rows" - ); - }); + await click(".admin-report-table-header.y .sort-button"); + assert.equal( + find(".report-body .report-table tbody tr:nth-child(1) td:nth-child(2)") + .text() + .trim(), + "7", + "it can sort rows" + ); } }); @@ -90,32 +86,25 @@ componentTest("options", { }, test(assert) { - andThen(() => { - assert.ok(exists(".pagination"), "it paginates the results"); - assert.equal( - find(".pagination button").length, - 3, - "it creates the correct number of pages" - ); + assert.ok(exists(".pagination"), "it paginates the results"); + assert.equal( + find(".pagination button").length, + 3, + "it creates the correct number of pages" + ); - assert.notOk(exists(".totals-sample-table"), "it hides totals"); - }); + assert.notOk(exists(".totals-sample-table"), "it hides totals"); } }); componentTest("switch modes", { template: "{{admin-report dataSourceName='signups'}}", - test(assert) { - click(".mode-button.chart"); + async test(assert) { + await click(".mode-button.chart"); - andThen(() => { - assert.notOk( - exists(".admin-report.table.signups"), - "it removes the table" - ); - assert.ok(exists(".admin-report.chart.signups"), "it shows the chart"); - }); + assert.notOk(exists(".admin-report.table.signups"), "it removes the table"); + assert.ok(exists(".admin-report.chart.signups"), "it shows the chart"); } }); @@ -123,8 +112,6 @@ componentTest("timeout", { template: "{{admin-report dataSourceName='signups_timeout'}}", test(assert) { - andThen(() => { - assert.ok(exists(".alert-error"), "it displays a timeout error"); - }); + assert.ok(exists(".alert-error"), "it displays a timeout error"); } }); diff --git a/test/javascripts/components/categories-admin-dropdown-test.js.es6 b/test/javascripts/components/categories-admin-dropdown-test.js.es6 index 8825cf33733..c25224d81a2 100644 --- a/test/javascripts/components/categories-admin-dropdown-test.js.es6 +++ b/test/javascripts/components/categories-admin-dropdown-test.js.es6 @@ -4,16 +4,14 @@ moduleForComponent("categories-admin-dropdown", { integration: true }); componentTest("default", { template: "{{categories-admin-dropdown}}", - test(assert) { + async test(assert) { const subject = selectKit(); assert.equal(subject.el().find(".d-icon-bars").length, 1); assert.equal(subject.el().find(".d-icon-caret-down").length, 1); - subject.expand(); + await subject.expandAwait(); - andThen(() => { - assert.equal(subject.rowByValue("create").name(), "New Category"); - }); + assert.equal(subject.rowByValue("create").name(), "New Category"); } }); diff --git a/test/javascripts/components/category-chooser-test.js.es6 b/test/javascripts/components/category-chooser-test.js.es6 index 73aa9d5ede0..434336b4763 100644 --- a/test/javascripts/components/category-chooser-test.js.es6 +++ b/test/javascripts/components/category-chooser-test.js.es6 @@ -11,35 +11,31 @@ componentTest("with value", { template: "{{category-chooser value=2}}", test(assert) { - andThen(() => { - assert.equal( - this.get("subject") - .header() - .value(), - 2 - ); - assert.equal( - this.get("subject") - .header() - .title(), - "feature" - ); - }); + assert.equal( + this.get("subject") + .header() + .value(), + 2 + ); + assert.equal( + this.get("subject") + .header() + .title(), + "feature" + ); } }); componentTest("with excludeCategoryId", { template: "{{category-chooser excludeCategoryId=2}}", - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expandAwait(); - andThen(() => - assert.notOk( - this.get("subject") - .rowByValue(2) - .exists() - ) + assert.notOk( + this.get("subject") + .rowByValue(2) + .exists() ); } }); @@ -47,36 +43,34 @@ componentTest("with excludeCategoryId", { componentTest("with scopedCategoryId", { template: "{{category-chooser scopedCategoryId=2}}", - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expandAwait(); - andThen(() => { - assert.equal( - this.get("subject") - .rowByIndex(0) - .title(), - "Discussion about features or potential features of Discourse: how they work, why they work, etc." - ); - assert.equal( - this.get("subject") - .rowByIndex(0) - .value(), - 2 - ); - assert.equal( - this.get("subject") - .rowByIndex(1) - .title(), - "My idea here is to have mini specs for features we would like built but have no bandwidth to build" - ); - assert.equal( - this.get("subject") - .rowByIndex(1) - .value(), - 26 - ); - assert.equal(this.get("subject").rows().length, 2); - }); + assert.equal( + this.get("subject") + .rowByIndex(0) + .title(), + "Discussion about features or potential features of Discourse: how they work, why they work, etc." + ); + assert.equal( + this.get("subject") + .rowByIndex(0) + .value(), + 2 + ); + assert.equal( + this.get("subject") + .rowByIndex(1) + .title(), + "My idea here is to have mini specs for features we would like built but have no bandwidth to build" + ); + assert.equal( + this.get("subject") + .rowByIndex(1) + .value(), + 26 + ); + assert.equal(this.get("subject").rows().length, 2); } }); @@ -88,20 +82,18 @@ componentTest("with allowUncategorized=null", { }, test(assert) { - andThen(() => { - assert.equal( - this.get("subject") - .header() - .value(), - null - ); - assert.equal( - this.get("subject") - .header() - .title(), - "category" - ); - }); + assert.equal( + this.get("subject") + .header() + .value(), + null + ); + assert.equal( + this.get("subject") + .header() + .title(), + "category" + ); } }); @@ -113,20 +105,18 @@ componentTest("with allowUncategorized=null rootNone=true", { }, test(assert) { - andThen(() => { - assert.equal( - this.get("subject") - .header() - .value(), - null - ); - assert.equal( - this.get("subject") - .header() - .title(), - "category" - ); - }); + assert.equal( + this.get("subject") + .header() + .value(), + null + ); + assert.equal( + this.get("subject") + .header() + .title(), + "category" + ); } }); @@ -140,20 +130,18 @@ componentTest("with disallowed uncategorized, rootNone and rootNoneLabel", { }, test(assert) { - andThen(() => { - assert.equal( - this.get("subject") - .header() - .value(), - null - ); - assert.equal( - this.get("subject") - .header() - .title(), - "category" - ); - }); + assert.equal( + this.get("subject") + .header() + .value(), + null + ); + assert.equal( + this.get("subject") + .header() + .title(), + "category" + ); } }); @@ -165,20 +153,18 @@ componentTest("with allowed uncategorized", { }, test(assert) { - andThen(() => { - assert.equal( - this.get("subject") - .header() - .value(), - null - ); - assert.equal( - this.get("subject") - .header() - .title(), - "uncategorized" - ); - }); + assert.equal( + this.get("subject") + .header() + .value(), + null + ); + assert.equal( + this.get("subject") + .header() + .title(), + "uncategorized" + ); } }); @@ -190,20 +176,18 @@ componentTest("with allowed uncategorized and rootNone", { }, test(assert) { - andThen(() => { - assert.equal( - this.get("subject") - .header() - .value(), - null - ); - assert.equal( - this.get("subject") - .header() - .title(), - "(no category)" - ); - }); + assert.equal( + this.get("subject") + .header() + .value(), + null + ); + assert.equal( + this.get("subject") + .header() + .title(), + "(no category)" + ); } }); @@ -217,19 +201,17 @@ componentTest("with allowed uncategorized rootNone and rootNoneLabel", { }, test(assert) { - andThen(() => { - assert.equal( - this.get("subject") - .header() - .value(), - null - ); - assert.equal( - this.get("subject") - .header() - .title(), - "root none label" - ); - }); + assert.equal( + this.get("subject") + .header() + .value(), + null + ); + assert.equal( + this.get("subject") + .header() + .title(), + "root none label" + ); } }); diff --git a/test/javascripts/components/combo-box-test.js.es6 b/test/javascripts/components/combo-box-test.js.es6 index b2b2dc9ffe2..c127157b907 100644 --- a/test/javascripts/components/combo-box-test.js.es6 +++ b/test/javascripts/components/combo-box-test.js.es6 @@ -12,29 +12,27 @@ componentTest("default", { this.set("items", [{ id: 1, name: "hello" }, { id: 2, name: "world" }]); }, - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expandAwait(); - andThen(() => { - assert.equal( - this.get("subject") - .header() - .name(), - "hello" - ); - assert.equal( - this.get("subject") - .rowByValue(1) - .name(), - "hello" - ); - assert.equal( - this.get("subject") - .rowByValue(2) - .name(), - "world" - ); - }); + assert.equal( + this.get("subject") + .header() + .name(), + "hello" + ); + assert.equal( + this.get("subject") + .rowByValue(1) + .name(), + "hello" + ); + assert.equal( + this.get("subject") + .rowByValue(2) + .name(), + "world" + ); } }); @@ -47,23 +45,21 @@ componentTest("with valueAttribute", { ]); }, - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expandAwait(); - andThen(() => { - assert.equal( - this.get("subject") - .rowByValue(0) - .name(), - "hello" - ); - assert.equal( - this.get("subject") - .rowByValue(1) - .name(), - "world" - ); - }); + assert.equal( + this.get("subject") + .rowByValue(0) + .name(), + "hello" + ); + assert.equal( + this.get("subject") + .rowByValue(1) + .name(), + "world" + ); } }); @@ -73,23 +69,21 @@ componentTest("with nameProperty", { this.set("items", [{ id: 0, text: "hello" }, { id: 1, text: "world" }]); }, - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expandAwait(); - andThen(() => { - assert.equal( - this.get("subject") - .rowByValue(0) - .name(), - "hello" - ); - assert.equal( - this.get("subject") - .rowByValue(1) - .name(), - "world" - ); - }); + assert.equal( + this.get("subject") + .rowByValue(0) + .name(), + "hello" + ); + assert.equal( + this.get("subject") + .rowByValue(1) + .name(), + "world" + ); } }); @@ -99,23 +93,21 @@ componentTest("with an array as content", { this.set("items", ["evil", "trout", "hat"]); }, - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expandAwait(); - andThen(() => { - assert.equal( - this.get("subject") - .rowByValue("evil") - .name(), - "evil" - ); - assert.equal( - this.get("subject") - .rowByValue("trout") - .name(), - "trout" - ); - }); + assert.equal( + this.get("subject") + .rowByValue("evil") + .name(), + "evil" + ); + assert.equal( + this.get("subject") + .rowByValue("trout") + .name(), + "trout" + ); } }); @@ -127,42 +119,38 @@ componentTest("with value and none as a string", { this.set("value", "trout"); }, - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expandAwait(); - andThen(() => { - assert.equal( - this.get("subject") - .noneRow() - .name(), - "none" - ); - assert.equal( - this.get("subject") - .rowByValue("evil") - .name(), - "evil" - ); - assert.equal( - this.get("subject") - .rowByValue("trout") - .name(), - "trout" - ); - assert.equal( - this.get("subject") - .header() - .name(), - "trout" - ); - assert.equal(this.get("value"), "trout"); - }); + assert.equal( + this.get("subject") + .noneRow() + .name(), + "none" + ); + assert.equal( + this.get("subject") + .rowByValue("evil") + .name(), + "evil" + ); + assert.equal( + this.get("subject") + .rowByValue("trout") + .name(), + "trout" + ); + assert.equal( + this.get("subject") + .header() + .name(), + "trout" + ); + assert.equal(this.get("value"), "trout"); - this.get("subject").selectNoneRow(); + await this.get("subject").selectNoneRowAwait(); - andThen(() => { - assert.equal(this.get("value"), null); - }); + assert.equal(this.get("value"), null); } }); @@ -174,42 +162,38 @@ componentTest("with value and none as an object", { this.set("value", "evil"); }, - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expand(); - andThen(() => { - assert.equal( - this.get("subject") - .noneRow() - .name(), - "none" - ); - assert.equal( - this.get("subject") - .rowByValue("evil") - .name(), - "evil" - ); - assert.equal( - this.get("subject") - .rowByValue("trout") - .name(), - "trout" - ); - assert.equal( - this.get("subject") - .header() - .name(), - "evil" - ); - assert.equal(this.get("value"), "evil"); - }); + assert.equal( + this.get("subject") + .noneRow() + .name(), + "none" + ); + assert.equal( + this.get("subject") + .rowByValue("evil") + .name(), + "evil" + ); + assert.equal( + this.get("subject") + .rowByValue("trout") + .name(), + "trout" + ); + assert.equal( + this.get("subject") + .header() + .name(), + "evil" + ); + assert.equal(this.get("value"), "evil"); - this.get("subject").selectNoneRow(); + await this.get("subject").selectNoneRowAwait(); - andThen(() => { - assert.equal(this.get("value"), null); - }); + assert.equal(this.get("value"), null); } }); @@ -222,17 +206,15 @@ componentTest("with no value and none as an object", { this.set("value", null); }, - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expandAwait(); - andThen(() => { - assert.equal( - this.get("subject") - .header() - .name(), - "none" - ); - }); + assert.equal( + this.get("subject") + .header() + .name(), + "none" + ); } }); @@ -245,17 +227,15 @@ componentTest("with no value and none string", { this.set("value", null); }, - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expandAwait(); - andThen(() => { - assert.equal( - this.get("subject") - .header() - .name(), - "none" - ); - }); + assert.equal( + this.get("subject") + .header() + .name(), + "none" + ); } }); @@ -266,18 +246,16 @@ componentTest("with no value and no none", { this.set("value", null); }, - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expandAwait(); - andThen(() => { - assert.equal( - this.get("subject") - .header() - .name(), - "evil", - "it sets the first row as value" - ); - }); + assert.equal( + this.get("subject") + .header() + .name(), + "evil", + "it sets the first row as value" + ); } }); @@ -288,18 +266,16 @@ componentTest("with empty string as value", { this.set("value", ""); }, - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expand(); - andThen(() => { - assert.equal( - this.get("subject") - .header() - .name(), - "evil", - "it sets the first row as value" - ); - }); + assert.equal( + this.get("subject") + .header() + .name(), + "evil", + "it sets the first row as value" + ); } }); @@ -312,17 +288,15 @@ componentTest("with noneLabel", { this.set("noneLabel", "test.none"); }, - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expandAwait(); - andThen(() => { - assert.equal( - this.get("subject") - .header() - .name(), - "none", - "it displays noneLabel as the header name" - ); - }); + assert.equal( + this.get("subject") + .header() + .name(), + "none", + "it displays noneLabel as the header name" + ); } }); diff --git a/test/javascripts/components/pinned-options-test.js.es6 b/test/javascripts/components/pinned-options-test.js.es6 index c195ad5a8e9..9585fd4dedf 100644 --- a/test/javascripts/components/pinned-options-test.js.es6 +++ b/test/javascripts/components/pinned-options-test.js.es6 @@ -26,25 +26,21 @@ componentTest("updating the content refreshes the list", { this.set("pinned", true); }, - test(assert) { - andThen(() => { - assert.equal( - this.get("subject") - .header() - .name(), - "pinned" - ); - }); + async test(assert) { + assert.equal( + this.get("subject") + .header() + .name(), + "pinned" + ); - andThen(() => this.set("pinned", false)); + await this.set("pinned", false); - andThen(() => { - assert.equal( - this.get("subject") - .header() - .name(), - "unpinned" - ); - }); + assert.equal( + this.get("subject") + .header() + .name(), + "unpinned" + ); } }); diff --git a/test/javascripts/components/topic-footer-mobile-dropdown-test.js.es6 b/test/javascripts/components/topic-footer-mobile-dropdown-test.js.es6 index 26915e8066b..6ba9d0f1b06 100644 --- a/test/javascripts/components/topic-footer-mobile-dropdown-test.js.es6 +++ b/test/javascripts/components/topic-footer-mobile-dropdown-test.js.es6 @@ -21,46 +21,42 @@ componentTest("default", { this.set("topic", buildTopic()); }, - test(assert) { - this.get("subject").expand(); + async test(assert) { + await this.get("subject").expandAwait(); - andThen(() => { - assert.equal( - this.get("subject") - .header() - .title(), - "Topic Controls" - ); - assert.equal( - this.get("subject") - .header() - .value(), - null - ); - assert.equal( - this.get("subject") - .rowByIndex(0) - .name(), - "Bookmark" - ); - assert.equal( - this.get("subject") - .rowByIndex(1) - .name(), - "Share" - ); - assert.notOk( - this.get("subject") - .selectedRow() - .exists(), - "it doesn’t preselect first row" - ); - }); + assert.equal( + this.get("subject") + .header() + .title(), + "Topic Controls" + ); + assert.equal( + this.get("subject") + .header() + .value(), + null + ); + assert.equal( + this.get("subject") + .rowByIndex(0) + .name(), + "Bookmark" + ); + assert.equal( + this.get("subject") + .rowByIndex(1) + .name(), + "Share" + ); + assert.notOk( + this.get("subject") + .selectedRow() + .exists(), + "it doesn’t preselect first row" + ); - this.get("subject").selectRowByValue("share"); + await this.get("subject").selectRowByValueAwait("share"); - andThen(() => { - assert.equal(this.get("value"), null, "it resets the value"); - }); + assert.equal(this.get("value"), null, "it resets the value"); } }); diff --git a/test/javascripts/components/topic-notifications-button-test.js.es6 b/test/javascripts/components/topic-notifications-button-test.js.es6 index 62d4d10288a..b64ff4fd283 100644 --- a/test/javascripts/components/topic-notifications-button-test.js.es6 +++ b/test/javascripts/components/topic-notifications-button-test.js.es6 @@ -31,28 +31,24 @@ componentTest("the header has a localized title", { this.set("topic", buildTopic(1)); }, - test(assert) { - andThen(() => { - assert.equal( - selectKit() - .header() - .name(), - "Normal", - "it has the correct title" - ); - }); + async test(assert) { + assert.equal( + selectKit() + .header() + .name(), + "Normal", + "it has the correct title" + ); - this.set("topic", buildTopic(2)); + await this.set("topic", buildTopic(2)); - andThen(() => { - assert.equal( - selectKit() - .header() - .name(), - "Tracking", - "it correctly changes the title" - ); - }); + assert.equal( + selectKit() + .header() + .name(), + "Tracking", + "it correctly changes the title" + ); } }); @@ -66,14 +62,12 @@ componentTest("the header has a localized title", { }, test(assert) { - andThen(() => { - assert.equal( - selectKit() - .header() - .name(), - `${originalTranslation} PM`, - "it has the correct title for PMs" - ); - }); + assert.equal( + selectKit() + .header() + .name(), + `${originalTranslation} PM`, + "it has the correct title for PMs" + ); } }); diff --git a/test/javascripts/components/topic-notifications-options-test.js.es6 b/test/javascripts/components/topic-notifications-options-test.js.es6 index cf43ae57cc4..e8d7b8bb986 100644 --- a/test/javascripts/components/topic-notifications-options-test.js.es6 +++ b/test/javascripts/components/topic-notifications-options-test.js.es6 @@ -32,26 +32,24 @@ componentTest("regular topic notification level descriptions", { template: "{{topic-notifications-options value=topic.details.notification_level topic=topic}}", - test(assert) { - selectKit().expand(); - this.set("topic", buildTopic("regular")); + async test(assert) { + await selectKit().expandAwait(); + await this.set("topic", buildTopic("regular")); - andThen(() => { - const uiTexts = extractDescs(selectKit().rows()); - const descriptions = getTranslations(); + const uiTexts = extractDescs(selectKit().rows()); + const descriptions = getTranslations(); + assert.equal( + uiTexts.length, + descriptions.length, + "it has the correct copy" + ); + uiTexts.forEach((text, index) => { assert.equal( - uiTexts.length, - descriptions.length, + text.trim(), + descriptions[index].trim(), "it has the correct copy" ); - uiTexts.forEach((text, index) => { - assert.equal( - text.trim(), - descriptions[index].trim(), - "it has the correct copy" - ); - }); }); } }); @@ -60,26 +58,24 @@ componentTest("PM topic notification level descriptions", { template: "{{topic-notifications-options value=topic.details.notification_level topic=topic}}", - test(assert) { - selectKit().expand(); - this.set("topic", buildTopic("private_message")); + async test(assert) { + await selectKit().expandAwait(); + await this.set("topic", buildTopic("private_message")); - andThen(() => { - const uiTexts = extractDescs(selectKit().rows()); - const descriptions = getTranslations("_pm"); + const uiTexts = extractDescs(selectKit().rows()); + const descriptions = getTranslations("_pm"); + assert.equal( + uiTexts.length, + descriptions.length, + "it has the correct copy" + ); + uiTexts.forEach((text, index) => { assert.equal( - uiTexts.length, - descriptions.length, + text.trim(), + descriptions[index].trim(), "it has the correct copy" ); - uiTexts.forEach((text, index) => { - assert.equal( - text.trim(), - descriptions[index].trim(), - "it has the correct copy" - ); - }); }); } }); diff --git a/test/javascripts/components/value-list-test.js.es6 b/test/javascripts/components/value-list-test.js.es6 index aaa936c901e..7af861a9b17 100644 --- a/test/javascripts/components/value-list-test.js.es6 +++ b/test/javascripts/components/value-list-test.js.es6 @@ -3,7 +3,7 @@ moduleForComponent("value-list", { integration: true }); componentTest("functionality", { template: '{{value-list values=values inputType="array"}}', - test(assert) { + async test(assert) { assert.ok(this.$(".values .value").length === 0, "it has no values"); assert.ok(this.$("input").length, "it renders the input"); assert.ok( @@ -11,29 +11,20 @@ componentTest("functionality", { "it is disabled with no value" ); - fillIn("input", "eviltrout"); - andThen(() => { - assert.ok( - !this.$(".btn-primary[disabled]").length, - "it isn't disabled anymore" - ); - }); + await fillIn("input", "eviltrout"); + assert.ok( + !this.$(".btn-primary[disabled]").length, + "it isn't disabled anymore" + ); - click(".btn-primary"); - andThen(() => { - assert.equal(this.$(".values .value").length, 1, "it adds the value"); - assert.equal(this.$("input").val(), "", "it clears the input"); - assert.ok( - this.$(".btn-primary[disabled]").length, - "it is disabled again" - ); - assert.equal(this.get("values"), "eviltrout", "it appends the value"); - }); + await click(".btn-primary"); + assert.equal(this.$(".values .value").length, 1, "it adds the value"); + assert.equal(this.$("input").val(), "", "it clears the input"); + assert.ok(this.$(".btn-primary[disabled]").length, "it is disabled again"); + assert.equal(this.get("values"), "eviltrout", "it appends the value"); - click(".value .btn-small"); - andThen(() => { - assert.ok(this.$(".values .value").length === 0, "it removes the value"); - }); + await click(".value .btn-small"); + assert.ok(this.$(".values .value").length === 0, "it removes the value"); } }); @@ -43,16 +34,14 @@ componentTest("with string delimited values", { this.set("valueString", "hello\nworld"); }, - test(assert) { + async test(assert) { assert.equal(this.$(".values .value").length, 2); - fillIn("input", "eviltrout"); - click(".btn-primary"); + await fillIn("input", "eviltrout"); + await click(".btn-primary"); - andThen(() => { - assert.equal(this.$(".values .value").length, 3); - assert.equal(this.get("valueString"), "hello\nworld\neviltrout"); - }); + assert.equal(this.$(".values .value").length, 3); + assert.equal(this.get("valueString"), "hello\nworld\neviltrout"); } }); @@ -62,15 +51,13 @@ componentTest("with array values", { this.set("valueArray", ["abc", "def"]); }, - test(assert) { + async test(assert) { assert.equal(this.$(".values .value").length, 2); - fillIn("input", "eviltrout"); - click(".btn-primary"); + await fillIn("input", "eviltrout"); + await click(".btn-primary"); - andThen(() => { - assert.equal(this.$(".values .value").length, 3); - assert.deepEqual(this.get("valueArray"), ["abc", "def", "eviltrout"]); - }); + assert.equal(this.$(".values .value").length, 3); + assert.deepEqual(this.get("valueArray"), ["abc", "def", "eviltrout"]); } }); diff --git a/test/javascripts/helpers/select-kit-helper.js b/test/javascripts/helpers/select-kit-helper.js index ea2462762c2..9c80847a060 100644 --- a/test/javascripts/helpers/select-kit-helper.js +++ b/test/javascripts/helpers/select-kit-helper.js @@ -1,80 +1,134 @@ function checkSelectKitIsNotExpanded(selector) { - if (find(selector).hasClass('is-expanded')) { - throw new Error('You expected select-kit to be collapsed but it is expanded.'); + if (find(selector).hasClass("is-expanded")) { + throw new Error( + "You expected select-kit to be collapsed but it is expanded." + ); } } function checkSelectKitIsNotCollapsed(selector) { - if (!find(selector).hasClass('is-expanded')) { - throw new Error('You expected select-kit to be expanded but it is collapsed.'); + if (!find(selector).hasClass("is-expanded")) { + throw new Error( + "You expected select-kit to be expanded but it is collapsed." + ); } } -Ember.Test.registerAsyncHelper('expandSelectKit', function(app, selector) { +Ember.Test.registerAsyncHelper("expandSelectKit", function(app, selector) { checkSelectKitIsNotExpanded(selector); - click(selector + ' .select-kit-header'); + click(selector + " .select-kit-header"); }); -Ember.Test.registerAsyncHelper('collapseSelectKit', function(app, selector) { +Ember.Test.registerAsyncHelper("collapseSelectKit", function(app, selector) { checkSelectKitIsNotCollapsed(selector); - click(selector + ' .select-kit-header'); + click(selector + " .select-kit-header"); }); -Ember.Test.registerAsyncHelper('selectKitFillInFilter', function(app, filter, selector) { +Ember.Test.registerAsyncHelper("selectKitFillInFilter", function( + app, + filter, + selector +) { checkSelectKitIsNotCollapsed(selector); - fillIn(selector + ' .filter-input', filter); + fillIn(selector + " .filter-input", filter); }); -Ember.Test.registerAsyncHelper('selectKitSelectRowByValue', function(app, value, selector) { +Ember.Test.registerAsyncHelper("selectKitSelectRowByValue", function( + app, + value, + selector +) { checkSelectKitIsNotCollapsed(selector); click(selector + " .select-kit-row[data-value='" + value + "']"); }); -Ember.Test.registerAsyncHelper('selectKitSelectRowByName', function(app, name, selector) { +Ember.Test.registerAsyncHelper("selectKitSelectRowByName", function( + app, + name, + selector +) { checkSelectKitIsNotCollapsed(selector); click(selector + " .select-kit-row[data-name='" + name + "']"); }); -Ember.Test.registerAsyncHelper('selectKitSelectNoneRow', function(app, selector) { +Ember.Test.registerAsyncHelper("selectKitSelectNoneRow", function( + app, + selector +) { checkSelectKitIsNotCollapsed(selector); click(selector + " .select-kit-row.none"); }); -Ember.Test.registerAsyncHelper('selectKitSelectRowByIndex', function(app, index, selector) { +Ember.Test.registerAsyncHelper("selectKitSelectRowByIndex", function( + app, + index, + selector +) { checkSelectKitIsNotCollapsed(selector); click(find(selector + " .select-kit-row").eq(index)); }); -function selectKit(selector) { // eslint-disable-line no-unused-vars +// eslint-disable-next-line no-unused-vars +function selectKit(selector) { selector = selector || ".select-kit"; function rowHelper(row) { return { - name: function() { return row.attr('data-name'); }, - icon: function() { return row.find('.d-icon'); }, - title: function() { return row.attr('title'); }, - value: function() { return row.attr('data-value'); }, - exists: function() { return exists(row); }, - el: function() { return row; } + name: function() { + return row.attr("data-name"); + }, + icon: function() { + return row.find(".d-icon"); + }, + title: function() { + return row.attr("title"); + }, + value: function() { + return row.attr("data-value"); + }, + exists: function() { + return exists(row); + }, + el: function() { + return row; + } }; } function headerHelper(header) { return { - value: function() { return header.attr('data-value'); }, - name: function() { return header.attr('data-name'); }, - label: function() { return header.text().trim(); }, - icon: function() { return header.find('.icon'); }, - title: function() { return header.attr('title'); }, - el: function() { return header; } + value: function() { + return header.attr("data-value"); + }, + name: function() { + return header.attr("data-name"); + }, + label: function() { + return header.text().trim(); + }, + icon: function() { + return header.find(".icon"); + }, + title: function() { + return header.attr("title"); + }, + el: function() { + return header; + } }; } function filterHelper(filter) { return { - icon: function() { return filter.find('.d-icon'); }, - exists: function() { return exists(filter); }, - el: function() { return filter; } + icon: function() { + return filter.find(".d-icon"); + }, + exists: function() { + return exists(filter); + }, + el: function() { + return filter; + } }; } @@ -85,24 +139,40 @@ function selectKit(selector) { // eslint-disable-line no-unused-vars options = options || {}; andThen(function() { - var type = options.type || 'keydown'; + var type = options.type || "keydown"; var event = jQuery.Event(type); event.keyCode = keyCode; - if (options && options.metaKey) { event.metaKey = true; } + if (options && options.metaKey) { + event.metaKey = true; + } find(eventSelector).trigger(event); }); } return { - down: function(target) { createEvent(target, 40); }, - up: function(target) { createEvent(target, 38); }, - escape: function(target) { createEvent(target, 27); }, - enter: function(target) { createEvent(target, 13); }, - tab: function(target) { createEvent(target, 9); }, - backspace: function(target) { createEvent(target, 8); }, - selectAll: function(target) { createEvent(target, 65, {metaKey: true}); }, + down: function(target) { + createEvent(target, 40); + }, + up: function(target) { + createEvent(target, 38); + }, + escape: function(target) { + createEvent(target, 27); + }, + enter: function(target) { + createEvent(target, 13); + }, + tab: function(target) { + createEvent(target, 9); + }, + backspace: function(target) { + createEvent(target, 8); + }, + selectAll: function(target) { + createEvent(target, 65, { metaKey: true }); + } }; - }; + } return { expandAwait: function() { @@ -114,6 +184,10 @@ function selectKit(selector) { // eslint-disable-line no-unused-vars return selectKit(selector); }, + collapseAwait: function() { + return collapseSelectKit(selector); + }, + collapse: function() { collapseSelectKit(selector); return selectKit(selector); @@ -143,57 +217,75 @@ function selectKit(selector) { // eslint-disable-line no-unused-vars return selectKit(selector); }, + selectNoneRowAwait: function() { + return selectKitSelectNoneRow(selector); + }, + fillInFilter: function(filter) { selectKitFillInFilter(filter, selector); return selectKit(selector); }, - keyboard: function() { return keyboardHelper(selector); }, + fillInFilterAwait: function(filter) { + return selectKitFillInFilter(filter, selector); + }, + + keyboard: function() { + return keyboardHelper(selector); + }, isExpanded: function() { - return find(selector).hasClass('is-expanded'); + return find(selector).hasClass("is-expanded"); }, isFocused: function() { - return find(selector).hasClass('is-focused'); + return find(selector).hasClass("is-focused"); }, isHidden: function() { - return find(selector).hasClass('is-hidden'); + return find(selector).hasClass("is-hidden"); }, header: function() { - return headerHelper(find(selector).find('.select-kit-header')); + return headerHelper(find(selector).find(".select-kit-header")); }, filter: function() { - return filterHelper(find(selector).find('.select-kit-filter')); + return filterHelper(find(selector).find(".select-kit-filter")); }, rows: function() { - return find(selector).find('.select-kit-row'); + return find(selector).find(".select-kit-row"); }, rowByValue: function(value) { - return rowHelper(find(selector).find('.select-kit-row[data-value="' + value + '"]')); + return rowHelper( + find(selector).find('.select-kit-row[data-value="' + value + '"]') + ); }, rowByName: function(name) { - return rowHelper(find(selector).find('.select-kit-row[data-name="' + name + '"]')); + return rowHelper( + find(selector).find('.select-kit-row[data-name="' + name + '"]') + ); }, rowByIndex: function(index) { - return rowHelper(find(selector).find('.select-kit-row:eq(' + index + ')')); + return rowHelper( + find(selector).find(".select-kit-row:eq(" + index + ")") + ); }, - el: function() { return find(selector); }, + el: function() { + return find(selector); + }, noneRow: function() { - return rowHelper(find(selector).find('.select-kit-row.none')); + return rowHelper(find(selector).find(".select-kit-row.none")); }, validationMessage: function() { - var validationMessage = find(selector).find('.validation-message'); + var validationMessage = find(selector).find(".validation-message"); if (validationMessage.length) { return validationMessage.html().trim(); @@ -203,13 +295,15 @@ function selectKit(selector) { // eslint-disable-line no-unused-vars }, selectedRow: function() { - return rowHelper(find(selector).find('.select-kit-row.is-selected')); + return rowHelper(find(selector).find(".select-kit-row.is-selected")); }, highlightedRow: function() { - return rowHelper(find(selector).find('.select-kit-row.is-highlighted')); + return rowHelper(find(selector).find(".select-kit-row.is-highlighted")); }, - exists: function() { return exists(selector); } + exists: function() { + return exists(selector); + } }; }