mirror of
https://github.com/discourse/discourse.git
synced 2024-11-26 11:33:44 +08:00
39f3dbd945
* renames `select-box-kit` into `select-kit`
* introduces `single-select` and `multi-select` as base components
* introduces {{search-advanced-category-chooser}} as a better component for selecting category in advanced search
* improves events handling in select-kit
* recreates color selection inputs using {{multi-select}} and a custom {{selected-color}} component
* replaces category-selector by a component using select-kit and based on multi-select
* improves positioning of wrapper
* removes the need for offscreen, and instead use `select-kit-header` as a base focus point for all select-kit based components
* introduces a formal plugin api for select-kit based components
* introduces a formal pattern for loading and updating select-kit based components:
```
computeValue()
computeContent()
mutateValue()
```
140 lines
3.4 KiB
JavaScript
140 lines
3.4 KiB
JavaScript
import componentTest from 'helpers/component-test';
|
|
|
|
moduleForComponent('category-chooser', {integration: true});
|
|
|
|
componentTest('with value', {
|
|
template: '{{category-chooser value=2}}',
|
|
|
|
test(assert) {
|
|
expandSelectKit();
|
|
|
|
andThen(() => {
|
|
assert.equal(selectKit('.category-chooser').header.name(), "feature");
|
|
});
|
|
}
|
|
});
|
|
|
|
componentTest('with excludeCategoryId', {
|
|
template: '{{category-chooser excludeCategoryId=2}}',
|
|
|
|
test(assert) {
|
|
expandSelectKit();
|
|
|
|
andThen(() => {
|
|
assert.equal(selectKit('.category-chooser').rowByValue(2).el.length, 0);
|
|
});
|
|
}
|
|
});
|
|
|
|
componentTest('with scopedCategoryId', {
|
|
template: '{{category-chooser scopedCategoryId=2}}',
|
|
|
|
test(assert) {
|
|
expandSelectKit();
|
|
|
|
andThen(() => {
|
|
assert.equal(selectKit('.category-chooser').rowByIndex(0).name(), "feature");
|
|
assert.equal(selectKit('.category-chooser').rowByIndex(1).name(), "spec");
|
|
assert.equal(selectKit('.category-chooser').el.find(".select-kit-row").length, 2);
|
|
});
|
|
}
|
|
});
|
|
|
|
componentTest('with allowUncategorized=null', {
|
|
template: '{{category-chooser allowUncategorized=null}}',
|
|
|
|
beforeEach() {
|
|
this.siteSettings.allow_uncategorized_topics = false;
|
|
},
|
|
|
|
test(assert) {
|
|
expandSelectKit();
|
|
|
|
andThen(() => {
|
|
assert.equal(selectKit('.category-chooser').header.name(), "Select a category…");
|
|
});
|
|
}
|
|
});
|
|
|
|
componentTest('with allowUncategorized=null rootNone=true', {
|
|
template: '{{category-chooser allowUncategorized=null rootNone=true}}',
|
|
|
|
beforeEach() {
|
|
this.siteSettings.allow_uncategorized_topics = false;
|
|
},
|
|
|
|
test(assert) {
|
|
expandSelectKit();
|
|
|
|
andThen(() => {
|
|
assert.equal(selectKit('.category-chooser').header.name(), "Select a category…");
|
|
});
|
|
}
|
|
});
|
|
|
|
componentTest('with disallowed uncategorized, rootNone and rootNoneLabel', {
|
|
template: '{{category-chooser allowUncategorized=null rootNone=true rootNoneLabel="test.root"}}',
|
|
|
|
beforeEach() {
|
|
I18n.translations[I18n.locale].js.test = {root: 'root none label'};
|
|
this.siteSettings.allow_uncategorized_topics = false;
|
|
},
|
|
|
|
test(assert) {
|
|
expandSelectKit();
|
|
|
|
andThen(() => {
|
|
assert.equal(selectKit('.category-chooser').header.name(), "Select a category…");
|
|
});
|
|
}
|
|
});
|
|
|
|
componentTest('with allowed uncategorized', {
|
|
template: '{{category-chooser allowUncategorized=true}}',
|
|
|
|
beforeEach() {
|
|
this.siteSettings.allow_uncategorized_topics = true;
|
|
},
|
|
|
|
test(assert) {
|
|
expandSelectKit();
|
|
|
|
andThen(() => {
|
|
assert.equal(selectKit('.category-chooser').header.name(), "uncategorized");
|
|
});
|
|
}
|
|
});
|
|
|
|
componentTest('with allowed uncategorized and rootNone', {
|
|
template: '{{category-chooser allowUncategorized=true rootNone=true}}',
|
|
|
|
beforeEach() {
|
|
this.siteSettings.allow_uncategorized_topics = true;
|
|
},
|
|
|
|
test(assert) {
|
|
expandSelectKit();
|
|
|
|
andThen(() => {
|
|
assert.equal(selectKit('.category-chooser').header.name(), "(no category)");
|
|
});
|
|
}
|
|
});
|
|
|
|
componentTest('with allowed uncategorized rootNone and rootNoneLabel', {
|
|
template: '{{category-chooser allowUncategorized=true rootNone=true rootNoneLabel="test.root"}}',
|
|
|
|
beforeEach() {
|
|
I18n.translations[I18n.locale].js.test = {root: 'root none label'};
|
|
this.siteSettings.allow_uncategorized_topics = true;
|
|
},
|
|
|
|
test(assert) {
|
|
expandSelectKit();
|
|
|
|
andThen(() => {
|
|
assert.equal(selectKit('.category-chooser').header.name(), "root none label");
|
|
});
|
|
}
|
|
});
|