0f807ba85b
On some modals the main/primary input field is a select-kit component (like `{{email-group-user-chooser}}` on the assign modal), so it makes sense to allow select-kit to steal focus on modals like these. This PR adds an `autofocus` option (default false) that allows select-kit to steal focus when it's rendered.
65 lines
1.7 KiB
JavaScript
65 lines
1.7 KiB
JavaScript
import componentTest, {
|
|
setupRenderingTest,
|
|
} from "discourse/tests/helpers/component-test";
|
|
import { discourseModule } from "discourse/tests/helpers/qunit-helpers";
|
|
import hbs from "htmlbars-inline-precompile";
|
|
import selectKit from "discourse/tests/helpers/select-kit-helper";
|
|
|
|
discourseModule(
|
|
"Integration | Component | select-kit/email-group-user-chooser",
|
|
function (hooks) {
|
|
setupRenderingTest(hooks);
|
|
|
|
hooks.beforeEach(function () {
|
|
this.set("subject", selectKit());
|
|
this.setProperties({
|
|
value: [],
|
|
onChange() {},
|
|
});
|
|
});
|
|
|
|
componentTest("autofocus option set to true", {
|
|
template: hbs`{{email-group-user-chooser
|
|
value=value
|
|
onChange=onChange
|
|
options=(hash
|
|
autofocus=true
|
|
)
|
|
}}`,
|
|
|
|
async test(assert) {
|
|
this.subject;
|
|
assert.ok(
|
|
this.subject.header().el()[0].classList.contains("is-focused"),
|
|
"select-kit header has is-focused class"
|
|
);
|
|
assert.ok(
|
|
this.subject.filter().el()[0].querySelector(".filter-input")
|
|
.autofocus,
|
|
"filter input has autofocus attribute"
|
|
);
|
|
},
|
|
});
|
|
|
|
componentTest("without autofocus", {
|
|
template: hbs`{{email-group-user-chooser
|
|
value=value
|
|
onChange=onChange
|
|
}}`,
|
|
|
|
async test(assert) {
|
|
this.subject;
|
|
assert.ok(
|
|
!this.subject.header().el()[0].classList.contains("is-focused"),
|
|
"select-kit header doesn't have is-focused class"
|
|
);
|
|
assert.ok(
|
|
!this.subject.filter().el()[0].querySelector(".filter-input")
|
|
.autofocus,
|
|
"filter input doesn't have autofocus attribute"
|
|
);
|
|
},
|
|
});
|
|
}
|
|
);
|