discourse/test/javascripts/admin/components/themes-list-test.js

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

145 lines
3.9 KiB
JavaScript
Raw Normal View History

import I18n from "I18n";
2018-08-31 03:23:15 +08:00
import componentTest from "helpers/component-test";
import Theme, { THEMES, COMPONENTS } from "admin/models/theme";
2018-08-31 03:23:15 +08:00
moduleForComponent("themes-list", { integration: true });
componentTest("current tab is themes", {
template:
"{{themes-list themes=themes components=components currentTab=currentTab}}",
beforeEach() {
this.themes = [1, 2, 3, 4, 5].map((num) =>
Theme.create({ name: `Theme ${num}` })
);
this.components = [1, 2, 3, 4, 5].map((num) =>
Theme.create({
name: `Child ${num}`,
component: true,
parentThemes: [this.themes[num - 1]],
parent_themes: [1, 2, 3, 4, 5],
})
);
2018-08-31 03:23:15 +08:00
this.setProperties({
themes: this.themes,
components: this.components,
2018-08-31 03:23:15 +08:00
currentTab: THEMES,
});
},
test(assert) {
assert.equal(
find(".themes-tab").hasClass("active"),
2018-08-31 03:23:15 +08:00
true,
"themes tab is active"
);
assert.equal(
find(".components-tab").hasClass("active"),
2018-08-31 03:23:15 +08:00
false,
"components tab is not active"
);
assert.equal(
find(".inactive-indicator").index(),
2018-08-31 03:23:15 +08:00
-1,
"there is no inactive themes separator when all themes are inactive"
);
assert.equal(find(".themes-list-item").length, 5, "displays all themes");
2018-08-31 03:23:15 +08:00
[2, 3].forEach((num) => this.themes[num].set("user_selectable", true));
this.themes[4].set("default", true);
this.set("themes", this.themes);
const names = [4, 2, 3, 0, 1].map((num) => this.themes[num].get("name")); // default theme always on top, followed by user-selectable ones and then the rest
2018-08-31 03:23:15 +08:00
assert.deepEqual(
Array.from(find(".themes-list-item").find(".name")).map((node) =>
2018-08-31 03:23:15 +08:00
node.innerText.trim()
),
names,
"sorts themes correctly"
);
assert.equal(
find(".inactive-indicator").index(),
2018-08-31 03:23:15 +08:00
3,
"the separator is in the right location"
);
this.themes.forEach((theme) => theme.set("user_selectable", true));
this.set("themes", this.themes);
2018-08-31 03:23:15 +08:00
assert.equal(
find(".inactive-indicator").index(),
2018-08-31 03:23:15 +08:00
-1,
"there is no inactive themes separator when all themes are user-selectable"
);
this.set("themes", []);
assert.equal(
find(".themes-list-item").length,
2018-08-31 03:23:15 +08:00
1,
"shows one entry with a message when there is nothing to display"
);
assert.equal(
find(".themes-list-item span.empty").text().trim(),
2018-08-31 03:23:15 +08:00
I18n.t("admin.customize.theme.empty"),
"displays the right message"
);
},
});
componentTest("current tab is components", {
template:
"{{themes-list themes=themes components=components currentTab=currentTab}}",
beforeEach() {
this.themes = [1, 2, 3, 4, 5].map((num) =>
Theme.create({ name: `Theme ${num}` })
);
this.components = [1, 2, 3, 4, 5].map((num) =>
Theme.create({
name: `Child ${num}`,
component: true,
parentThemes: [this.themes[num - 1]],
parent_themes: [1, 2, 3, 4, 5],
})
);
2018-08-31 03:23:15 +08:00
this.setProperties({
themes: this.themes,
components: this.components,
2018-08-31 03:23:15 +08:00
currentTab: COMPONENTS,
});
},
test(assert) {
assert.equal(
find(".components-tab").hasClass("active"),
2018-08-31 03:23:15 +08:00
true,
"components tab is active"
);
assert.equal(
find(".themes-tab").hasClass("active"),
2018-08-31 03:23:15 +08:00
false,
"themes tab is not active"
);
assert.equal(
find(".inactive-indicator").index(),
2018-08-31 03:23:15 +08:00
-1,
"there is no separator"
);
assert.equal(
find(".themes-list-item").length,
2018-08-31 03:23:15 +08:00
5,
"displays all components"
);
this.set("components", []);
assert.equal(
find(".themes-list-item").length,
2018-08-31 03:23:15 +08:00
1,
"shows one entry with a message when there is nothing to display"
);
assert.equal(
find(".themes-list-item span.empty").text().trim(),
2018-08-31 03:23:15 +08:00
I18n.t("admin.customize.theme.empty"),
"displays the right message"
);
},
});