diff --git a/app/assets/javascripts/discourse/tests/acceptance/search-full-test.js b/app/assets/javascripts/discourse/tests/acceptance/search-full-test.js
index 7fe764a3544..a133d104e1b 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/search-full-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/search-full-test.js
@@ -299,6 +299,7 @@ acceptance("Search - Full Page", function (needs) {
await visit("/search");
+ await click(".advanced-filters > summary");
await fillIn(".search-query", "none");
await inSelector.expand();
await inSelector.selectRowByValue("bookmarks");
@@ -322,6 +323,7 @@ acceptance("Search - Full Page", function (needs) {
await visit("/search");
+ await click(".advanced-filters > summary");
await fillIn(".search-query", "none");
await statusSelector.expand();
await statusSelector.selectRowByValue("closed");
@@ -345,6 +347,7 @@ acceptance("Search - Full Page", function (needs) {
await visit("/search");
+ await click(".advanced-filters > summary");
await fillIn(".search-query", "status:none");
assert.strictEqual(
@@ -359,6 +362,7 @@ acceptance("Search - Full Page", function (needs) {
await visit("/search");
+ await click(".advanced-filters > summary");
await fillIn(".search-query", "in:none");
assert.strictEqual(
@@ -378,6 +382,7 @@ acceptance("Search - Full Page", function (needs) {
);
await visit("/search");
+ await click(".advanced-filters > summary");
await fillIn(".search-query", "none");
await selectDate(".date-picker#search-post-date", "2016-10-05");
@@ -403,6 +408,7 @@ acceptance("Search - Full Page", function (needs) {
test("update min post count through advanced search ui", async function (assert) {
await visit("/search");
+ await click(".advanced-filters > summary");
await fillIn(".search-query", "none");
await fillIn("#search-min-post-count", "5");
@@ -422,6 +428,7 @@ acceptance("Search - Full Page", function (needs) {
test("update max post count through advanced search ui", async function (assert) {
await visit("/search");
+ await click(".advanced-filters > summary");
await fillIn(".search-query", "none");
await fillIn("#search-max-post-count", "5");
@@ -484,6 +491,7 @@ acceptance("Search - Full Page", function (needs) {
await fillIn(".search-query", "admin");
assert.ok(!exists(".fps-user-item"), "has no user results");
+ await click(".advanced-filters > summary");
await typeSelector.expand();
await typeSelector.selectRowByValue(SEARCH_TYPE_USERS);
@@ -511,6 +519,7 @@ acceptance("Search - Full Page", function (needs) {
assert.ok(!exists(".fps-tag-item"), "has no category/tag results");
+ await click(".advanced-filters > summary");
await typeSelector.expand();
await typeSelector.selectRowByValue(SEARCH_TYPE_CATS_TAGS);
await click(".search-cta");
diff --git a/app/assets/javascripts/discourse/tests/helpers/select-kit-helper.js b/app/assets/javascripts/discourse/tests/helpers/select-kit-helper.js
index aaa15afe3ce..149cc9c1178 100644
--- a/app/assets/javascripts/discourse/tests/helpers/select-kit-helper.js
+++ b/app/assets/javascripts/discourse/tests/helpers/select-kit-helper.js
@@ -1,17 +1,17 @@
import { click, fillIn, triggerEvent } from "@ember/test-helpers";
-import { exists, queryAll } from "discourse/tests/helpers/qunit-helpers";
+import { exists, query, queryAll } from "discourse/tests/helpers/qunit-helpers";
import { isEmpty } from "@ember/utils";
import { moduleForComponent } from "ember-qunit";
function checkSelectKitIsNotExpanded(selector) {
- if (queryAll(selector).hasClass("is-expanded")) {
+ if (query(selector).classList.contains("is-expanded")) {
// eslint-disable-next-line no-console
console.warn("You expected select-kit to be collapsed but it is expanded.");
}
}
function checkSelectKitIsNotCollapsed(selector) {
- if (!queryAll(selector).hasClass("is-expanded")) {
+ if (!query(selector).classList.contains("is-expanded")) {
// eslint-disable-next-line no-console
console.warn("You expected select-kit to be expanded but it is collapsed.");
}
@@ -31,7 +31,7 @@ async function selectKitFillInFilter(filter, selector) {
checkSelectKitIsNotCollapsed(selector);
await fillIn(
`${selector} .filter-input`,
- queryAll(`${selector} .filter-input`).val() + filter
+ query(`${selector} .filter-input`).value + filter
);
}
@@ -61,7 +61,7 @@ async function selectKitSelectRowByIndex(index, selector) {
}
async function keyboardHelper(value, target, selector) {
- target = queryAll(selector).find(target || ".filter-input");
+ target = query(selector).querySelector(target || ".filter-input");
if (value === "selectAll") {
// special casing the only one not working with triggerEvent
@@ -70,7 +70,7 @@ async function keyboardHelper(value, target, selector) {
event.key = "A";
event.keyCode = 65;
event.metaKey = true;
- target.trigger(event);
+ $(target).trigger(event);
} else {
const mapping = {
enter: { key: "Enter", keyCode: 13 },
@@ -82,7 +82,7 @@ async function keyboardHelper(value, target, selector) {
};
await triggerEvent(
- target[0],
+ target,
"keydown",
mapping[value.toLowerCase()] || {
key: value,
@@ -95,19 +95,19 @@ async function keyboardHelper(value, target, selector) {
function rowHelper(row) {
return {
name() {
- return row.attr("data-name");
+ return row.getAttribute("data-name");
},
icon() {
- return row.find(".d-icon");
+ return row.querySelector(".d-icon");
},
title() {
- return row.attr("title");
+ return row.getAttribute("title");
},
label() {
- return row.find(".name").text().trim();
+ return row.querySelector(".name").innerText.trim();
},
value() {
- const value = row.attr("data-value");
+ const value = row?.getAttribute("data-value");
return isEmpty(value) ? null : value;
},
exists() {
@@ -122,23 +122,22 @@ function rowHelper(row) {
function headerHelper(header) {
return {
value() {
- const value = header.attr("data-value");
+ const value = header.getAttribute("data-value");
return isEmpty(value) ? null : value;
},
name() {
- return header.attr("data-name");
+ return header.getAttribute("data-name");
},
label() {
- return header
- .text()
+ return header.innerText
.trim()
.replace(/(^[\s\u200b]*|[\s\u200b]*$)/g, "");
},
icon() {
- return header.find(".d-icon");
+ return header.querySelector(".d-icon");
},
title() {
- return header.find(".selected-name").attr("title");
+ return header.querySelector(".selected-name").getAttribute("title");
},
el() {
return header;
@@ -149,13 +148,13 @@ function headerHelper(header) {
function filterHelper(filter) {
return {
icon() {
- return filter.find(".d-icon");
+ return filter.querySelector(".d-icon");
},
exists() {
return exists(filter);
},
value() {
- return filter.find("input").val();
+ return filter.querySelector("input").value;
},
el() {
return filter;
@@ -208,89 +207,89 @@ export default function selectKit(selector) {
},
isExpanded() {
- return queryAll(selector).hasClass("is-expanded");
+ return query(selector).classList.contains("is-expanded");
},
isFocused() {
- return queryAll(selector).hasClass("is-focused");
+ return query(selector).classList.contains("is-focused");
},
isHidden() {
- return queryAll(selector).hasClass("is-hidden");
+ return query(selector).classList.contains("is-hidden");
},
isDisabled() {
- return queryAll(selector).hasClass("is-disabled");
+ return query(selector).classList.contains("is-disabled");
},
header() {
- return headerHelper(queryAll(selector).find(".select-kit-header"));
+ return headerHelper(query(selector).querySelector(".select-kit-header"));
},
filter() {
- return filterHelper(queryAll(selector).find(".select-kit-filter"));
+ return filterHelper(query(selector).querySelector(".select-kit-filter"));
},
rows() {
- return queryAll(selector).find(".select-kit-row");
+ return query(selector).querySelectorAll(".select-kit-row");
},
displayedContent() {
- return this.rows()
- .map((_, row) => {
- return {
- name: row.getAttribute("data-name"),
- id: row.getAttribute("data-value"),
- };
- })
- .toArray();
+ return [...this.rows()].map((row) => ({
+ name: row.getAttribute("data-name"),
+ id: row.getAttribute("data-value"),
+ }));
},
rowByValue(value) {
return rowHelper(
- queryAll(selector).find('.select-kit-row[data-value="' + value + '"]')
+ query(selector).querySelector(`.select-kit-row[data-value="${value}"]`)
);
},
rowByName(name) {
return rowHelper(
- queryAll(selector).find('.select-kit-row[data-name="' + name + '"]')
+ query(selector).querySelector(`.select-kit-row[data-name="${name}"]`)
);
},
rowByIndex(index) {
return rowHelper(
- queryAll(selector).find(
- ".select-kit-row:nth-of-type(" + (index + 1) + ")"
+ query(selector).querySelector(
+ `.select-kit-row:nth-of-type(${index + 1})`
)
);
},
el() {
- return queryAll(selector);
+ return query(selector);
},
noneRow() {
- return rowHelper(queryAll(selector).find(".select-kit-row.none"));
+ return rowHelper(query(selector).querySelector(".select-kit-row.none"));
},
validationMessage() {
- const validationMessage = queryAll(selector).find(".validation-message");
+ const validationMessage = query(selector).querySelector(
+ ".validation-message"
+ );
- if (validationMessage.length) {
- return validationMessage.html().trim();
+ if (validationMessage) {
+ return validationMessage.innerHTML.trim();
} else {
return null;
}
},
selectedRow() {
- return rowHelper(queryAll(selector).find(".select-kit-row.is-selected"));
+ return rowHelper(
+ query(selector).querySelector(".select-kit-row.is-selected")
+ );
},
highlightedRow() {
return rowHelper(
- queryAll(selector).find(".select-kit-row.is-highlighted")
+ query(selector).querySelector(".select-kit-row.is-highlighted")
);
},
@@ -314,11 +313,11 @@ export function testSelectKitModule(moduleName, options = {}) {
beforeEach() {
this.set("subject", selectKit());
- options.beforeEach && options.beforeEach.call(this);
+ options.beforeEach?.call(this);
},
afterEach() {
- options.afterEach && options.afterEach.call(this);
+ options.afterEach?.call(this);
},
});
}
diff --git a/app/assets/javascripts/discourse/tests/integration/components/select-kit/category-chooser-test.js b/app/assets/javascripts/discourse/tests/integration/components/select-kit/category-chooser-test.js
index aff1ac24273..75d9e005a3f 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/select-kit/category-chooser-test.js
+++ b/app/assets/javascripts/discourse/tests/integration/components/select-kit/category-chooser-test.js
@@ -314,7 +314,7 @@ discourseModule(
await this.subject.expand();
assert.strictEqual(
- this.subject.rowByIndex(0).el()[0].querySelector(".category-desc")
+ this.subject.rowByIndex(0).el().querySelector(".category-desc")
.innerText,
'baz "bar ‘foo’'
);
diff --git a/app/assets/javascripts/discourse/tests/integration/components/select-kit/category-drop-test.js b/app/assets/javascripts/discourse/tests/integration/components/select-kit/category-drop-test.js
index 91b74845889..8f60850e36d 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/select-kit/category-drop-test.js
+++ b/app/assets/javascripts/discourse/tests/integration/components/select-kit/category-drop-test.js
@@ -5,7 +5,7 @@ import {
import componentTest, {
setupRenderingTest,
} from "discourse/tests/helpers/component-test";
-import { discourseModule, exists } from "discourse/tests/helpers/qunit-helpers";
+import { discourseModule } from "discourse/tests/helpers/qunit-helpers";
import Category from "discourse/models/category";
import DiscourseURL from "discourse/lib/url";
import I18n from "I18n";
@@ -53,10 +53,10 @@ discourseModule(
`,
async test(assert) {
- const $header = this.subject.header().el();
+ const header = this.subject.header().el();
assert.ok(
- exists($header.find(`.d-icon-caret-right`)),
+ header.querySelector(`.d-icon-caret-right`),
"it uses the correct default icon"
);
},
@@ -101,7 +101,7 @@ discourseModule(
const row = this.subject.rowByValue(this.category.id);
assert.ok(
- exists(row.el().find(".category-desc")),
+ row.el().querySelector(".category-desc"),
"it shows category description for newcomers"
);
},
@@ -127,8 +127,8 @@ discourseModule(
await this.subject.expand();
const row = this.subject.rowByValue(this.category.id);
- assert.ok(
- !exists(row.el().find(".category-desc")),
+ assert.notOk(
+ row.el().querySelector(".category-desc"),
"it doesn't shows category description for TL0+"
);
},
@@ -154,8 +154,8 @@ discourseModule(
await this.subject.expand();
const row = this.subject.rowByValue(this.category.id);
- assert.ok(
- !exists(row.el().find(".category-desc")),
+ assert.notOk(
+ row.el().querySelector(".category-desc"),
"it doesn't show category description for staff"
);
},
@@ -210,8 +210,8 @@ discourseModule(
const childRow = this.subject.rowByValue(childCategoryId);
assert.ok(childRow.exists(), "the child row is showing");
- const $categoryStatus = childRow.el().find(".category-status");
- assert.ok($categoryStatus.text().trim().match(/^spec/));
+ const categoryStatus = childRow.el().querySelector(".category-status");
+ assert.ok(categoryStatus.innerText.trim().match(/^spec/));
},
});
@@ -279,7 +279,10 @@ discourseModule(
const category = Category.findById(7);
const row = this.subject.rowByValue(category.id);
- const topicCount = row.el().find(".topic-count").text().trim();
+ const topicCount = row
+ .el()
+ .querySelector(".topic-count")
+ .innerText.trim();
assert.strictEqual(
topicCount,
@@ -310,7 +313,10 @@ discourseModule(
const category = Category.findById(7);
const row = this.subject.rowByValue(category.id);
- const topicCount = row.el().find(".topic-count").text().trim();
+ const topicCount = row
+ .el()
+ .querySelector(".topic-count")
+ .innerText.trim();
assert.strictEqual(
topicCount,
diff --git a/app/assets/javascripts/discourse/tests/integration/components/select-kit/combo-box-test.js b/app/assets/javascripts/discourse/tests/integration/components/select-kit/combo-box-test.js
index 1178156a55e..8d4d7d57c93 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/select-kit/combo-box-test.js
+++ b/app/assets/javascripts/discourse/tests/integration/components/select-kit/combo-box-test.js
@@ -1,7 +1,7 @@
import componentTest, {
setupRenderingTest,
} from "discourse/tests/helpers/component-test";
-import { discourseModule, exists } from "discourse/tests/helpers/qunit-helpers";
+import { discourseModule } from "discourse/tests/helpers/qunit-helpers";
import { click } from "@ember/test-helpers";
import hbs from "htmlbars-inline-precompile";
import selectKit from "discourse/tests/helpers/select-kit-helper";
@@ -54,21 +54,21 @@ discourseModule(
},
async test(assert) {
- const $header = this.subject.header();
+ const header = this.subject.header();
assert.ok(
- exists($header.el().find(".btn-clear")),
+ header.el().querySelector(".btn-clear"),
"it shows the clear button"
);
- assert.strictEqual($header.value(), DEFAULT_VALUE.toString());
+ assert.strictEqual(header.value(), DEFAULT_VALUE.toString());
- await click($header.el().find(".btn-clear")[0]);
+ await click(header.el().querySelector(".btn-clear"));
assert.notOk(
- exists($header.el().find(".btn-clear")),
+ header.el().querySelector(".btn-clear"),
"it hides the clear button"
);
- assert.strictEqual($header.value(), null);
+ assert.strictEqual(header.value(), null);
},
});
@@ -92,17 +92,17 @@ discourseModule(
},
async test(assert) {
- const $header = this.subject.header().el();
+ const header = this.subject.header().el();
assert.ok(
- exists($header.find(`.d-icon-${this.caretDownIcon}`)),
+ header.querySelector(`.d-icon-${this.caretDownIcon}`),
"it uses the icon provided"
);
await this.subject.expand();
assert.ok(
- exists($header.find(`.d-icon-${this.caretUpIcon}`)),
+ header.querySelector(`.d-icon-${this.caretUpIcon}`),
"it uses the icon provided"
);
},
diff --git a/app/assets/javascripts/discourse/tests/integration/components/select-kit/dropdown-select-box-test.js b/app/assets/javascripts/discourse/tests/integration/components/select-kit/dropdown-select-box-test.js
index 80af3a66167..d2539e9fbbd 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/select-kit/dropdown-select-box-test.js
+++ b/app/assets/javascripts/discourse/tests/integration/components/select-kit/dropdown-select-box-test.js
@@ -1,7 +1,7 @@
import componentTest, {
setupRenderingTest,
} from "discourse/tests/helpers/component-test";
-import { discourseModule, exists } from "discourse/tests/helpers/qunit-helpers";
+import { discourseModule } from "discourse/tests/helpers/qunit-helpers";
import hbs from "htmlbars-inline-precompile";
import selectKit from "discourse/tests/helpers/select-kit-helper";
@@ -82,13 +82,13 @@ discourseModule(
},
async test(assert) {
- assert.ok(
- !exists(this.subject.header().el().find(".selected-name")),
+ assert.notOk(
+ this.subject.header().el().querySelector(".selected-name"),
"it hides the text of the selected item"
);
assert.strictEqual(
- this.subject.header().el().attr("title"),
+ this.subject.header().el().getAttribute("title"),
"[en.test_none]",
"it adds a title attribute to the button"
);
@@ -112,7 +112,7 @@ discourseModule(
async test(assert) {
assert.ok(
- exists(this.subject.header().el().find(".selected-name")),
+ this.subject.header().el().querySelector(".selected-name"),
"it shows the text of the selected item"
);
},
diff --git a/app/assets/javascripts/discourse/tests/integration/components/select-kit/notifications-button-test.js b/app/assets/javascripts/discourse/tests/integration/components/select-kit/notifications-button-test.js
index 39592a80ba4..997722851eb 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/select-kit/notifications-button-test.js
+++ b/app/assets/javascripts/discourse/tests/integration/components/select-kit/notifications-button-test.js
@@ -44,7 +44,7 @@ discourseModule(
"it shows the regular choice when value is not set"
);
- const icon = this.subject.header().icon()[0];
+ const icon = this.subject.header().icon();
assert.ok(
icon.classList.contains("d-icon-d-regular"),
"it shows the correct icon"
diff --git a/app/assets/javascripts/discourse/tests/integration/components/select-kit/single-select-test.js b/app/assets/javascripts/discourse/tests/integration/components/select-kit/single-select-test.js
index 9455f8dcb46..d84a898827e 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/select-kit/single-select-test.js
+++ b/app/assets/javascripts/discourse/tests/integration/components/select-kit/single-select-test.js
@@ -401,19 +401,19 @@ discourseModule(
async test(assert) {
assert.strictEqual(
- this.subject.header().el()[0].querySelector(".selected-name").lang,
+ this.subject.header().el().querySelector(".selected-name").lang,
""
);
await this.subject.expand();
const row = this.subject.rowByValue(1);
- assert.strictEqual(row.el()[0].lang, "be");
+ assert.strictEqual(row.el().lang, "be");
await this.subject.selectRowByValue(1);
assert.strictEqual(
- this.subject.header().el()[0].querySelector(".selected-name").lang,
+ this.subject.header().el().querySelector(".selected-name").lang,
"be"
);
},
@@ -431,7 +431,7 @@ discourseModule(
async test(assert) {
assert.strictEqual(
- this.subject.header().el()[0].getAttribute("name"),
+ this.subject.header().el().getAttribute("name"),
I18n.t("select_kit.select_to_filter")
);
@@ -439,7 +439,7 @@ discourseModule(
await this.subject.selectRowByValue(1);
assert.strictEqual(
- this.subject.header().el()[0].getAttribute("name"),
+ this.subject.header().el().getAttribute("name"),
I18n.t("select_kit.filter_by", {
name: this.content.firstObject.name,
})
diff --git a/app/assets/javascripts/discourse/tests/integration/components/select-kit/topic-notifications-options-test.js b/app/assets/javascripts/discourse/tests/integration/components/select-kit/topic-notifications-options-test.js
index 56e754ecc35..027b40f8a20 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/select-kit/topic-notifications-options-test.js
+++ b/app/assets/javascripts/discourse/tests/integration/components/select-kit/topic-notifications-options-test.js
@@ -19,12 +19,8 @@ const buildTopic = function (archetype) {
});
};
-function extractDescs(rows) {
- return Array.from(
- rows.find(".desc").map(function () {
- return this.textContent.trim();
- })
- );
+function extractDescriptions(rows) {
+ return [...rows].map((el) => el.querySelector(".desc").textContent.trim());
}
function getTranslations(type = "") {
@@ -53,7 +49,7 @@ discourseModule(
async test(assert) {
await selectKit().expand();
- const uiTexts = extractDescs(selectKit().rows());
+ const uiTexts = extractDescriptions(selectKit().rows());
const descriptions = getTranslations();
assert.strictEqual(
@@ -86,7 +82,7 @@ discourseModule(
async test(assert) {
await selectKit().expand();
- const uiTexts = extractDescs(selectKit().rows());
+ const uiTexts = extractDescriptions(selectKit().rows());
const descriptions = getTranslations("_pm");
assert.strictEqual(