FIX: ensures category chooser is working with non english char (#10866)

This commit is also moving one test to a component test.

A followup to this commit would be to ensure every dropdowns are using a regex instead of the normalize/lowercase system we have now.

app/assets/javascripts/discourse/tests/acceptance/category-chooser-test.js

@@ -25,19 +25,3 @@ test("prefill category when category_id is set", async (assert) => {
 
   assert.equal(selectKit(".category-chooser").header().value(), 1);
 });
-
-test("filter is case insensitive", async (assert) => {
-  const categoryChooser = selectKit(".category-chooser");
-
-  await visit("/");
-  await click("#create-topic");
-  await categoryChooser.expand();
-  await categoryChooser.fillInFilter("bug");
-
-  assert.ok(categoryChooser.rows().length, 1);
-
-  await categoryChooser.emptyFilter();
-  await categoryChooser.fillInFilter("Bug");
-
-  assert.ok(categoryChooser.rows().length, 1);
-});

app/assets/javascripts/discourse/tests/integration/components/select-kit/category-chooser-test.js

@@ -1,3 +1,4 @@
+import createStore from "discourse/tests/helpers/create-store";
 import I18n from "I18n";
 import componentTest from "discourse/tests/helpers/component-test";
 import { testSelectKitModule } from "discourse/tests/helpers/select-kit-helper";
@@ -144,3 +145,52 @@ componentTest("with allowed uncategorized and none", {
     assert.equal(this.subject.header().label(), "root none label");
   },
 });
+
+componentTest("filter is case insensitive", {
+  template: template(),
+
+  async test(assert) {
+    await this.subject.expand();
+    await this.subject.fillInFilter("bug");
+
+    assert.ok(this.subject.rows().length, 1);
+    assert.equal(this.subject.rowByIndex(0).name(), "bug");
+
+    await this.subject.emptyFilter();
+    await this.subject.fillInFilter("Bug");
+
+    assert.ok(this.subject.rows().length, 1);
+    assert.equal(this.subject.rowByIndex(0).name(), "bug");
+  },
+});
+
+componentTest("filter works with non english characters", {
+  template: `
+    {{category-chooser
+      value=value
+      content=content
+    }}
+  `,
+
+  beforeEach() {
+    const store = createStore();
+    const nonEnglishCat = store.createRecord("category", {
+      id: 1,
+      name: "chữ Quốc ngữ",
+    });
+    const englishCat = store.createRecord("category", {
+      id: 2,
+      name: "Baz",
+    });
+
+    this.set("content", [nonEnglishCat, englishCat]);
+  },
+
+  async test(assert) {
+    await this.subject.expand();
+    await this.subject.fillInFilter("hữ");
+
+    assert.ok(this.subject.rows().length, 1);
+    assert.equal(this.subject.rowByIndex(0).name(), "chữ Quốc ngữ");
+  },
+});

app/assets/javascripts/select-kit/addon/components/category-chooser.js

@@ -67,7 +67,7 @@ export default ComboBoxComponent.extend({
 
   search(filter) {
     if (filter) {
-      filter = filter.toLowerCase();
+      filter = this._normalize(filter);
       return this.content.filter((item) => {
         const category = Category.findById(this.getValue(item));
         const categoryName = this.getName(item);