Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

DEV: Add component tests for admin page header components (#28837) 

These components will be used in many places and are quite
independent, adding component tests is sensible.
This commit is contained in:
Martin Brennan 2024-09-11 13:27:58 +10:00 committed by GitHub
parent 279ffb3351
commit 894f146b3a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 316 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/assets/javascripts/admin/addon/components/admin-page-header.gjs
View File

@ -55,7 +55,9 @@ export default class AdminPageHeader extends Component {
<p class="admin-page-header__description">
{{htmlSafe this.description}}
{{#if @learnMoreUrl}}
{{htmlSafe (i18n "learn_more_with_link" url=@learnMoreUrl)}}
<span class="admin-page-header__learn-more">{{htmlSafe
(i18n "learn_more_with_link" url=@learnMoreUrl)
}}</span>
{{/if}}
</p>
{{/if}}

5
app/assets/javascripts/admin/addon/components/admin-page-subheader.gjs
View File

@ -43,7 +43,10 @@ export default class AdminPageSubheader extends Component {
<p class="admin-page-subheader__description">
{{htmlSafe this.description}}
{{#if @learnMoreUrl}}
{{htmlSafe (i18n "learn_more_with_link" url=@learnMoreUrl)}}
<span class="admin-page-subheader__learn-more">
{{htmlSafe
(i18n "learn_more_with_link" url=@learnMoreUrl)
}}</span>
{{/if}}
</p>
{{/if}}

2
app/assets/javascripts/admin/addon/templates/admin-badges.hbs
View File

@ -16,6 +16,7 @@
@routeModels="new"
@icon="plus"
@label="admin.badges.new"
class="new-badge"
/>
<actions.Default
@ -23,6 +24,7 @@
@routeModels="new"
@icon="upload"
@label="admin.badges.mass_award.title"
class="award-badge"
/>
<actions.Default

2
app/assets/javascripts/discourse/app/components/nav-item.gjs
View File

@ -20,7 +20,7 @@ export default class NavItem extends Component {
}
get active() {
if (!this.args.route) {
if (!this.args.route || !this.router.currentRoute) {
return;
}

177
app/assets/javascripts/discourse/tests/integration/components/admin-page-header-test.gjs Normal file
View File

@ -0,0 +1,177 @@
import { click, render } from "@ember/test-helpers";
import { module, test } from "qunit";
import DBreadcrumbsItem from "discourse/components/d-breadcrumbs-item";
import NavItem from "discourse/components/nav-item";
import { setupRenderingTest } from "discourse/tests/helpers/component-test";
import i18n from "discourse-common/helpers/i18n";
import AdminPageHeader from "admin/components/admin-page-header";
module("Integration | Component | AdminPageHeader", function (hooks) {
setupRenderingTest(hooks);
test("no @titleLabel or @titleLabelTranslated", async function (assert) {
await render(<template><AdminPageHeader /></template>);
assert.dom(".admin-page-header__title").doesNotExist();
});
test("@titleLabel", async function (assert) {
await render(<template>
<AdminPageHeader @titleLabel="admin.title" />
</template>);
assert
.dom(".admin-page-header__title")
.exists()
.hasText(i18n("admin.title"));
});
test("@titleLabelTranslated", async function (assert) {
await render(<template>
<AdminPageHeader @titleLabelTranslated="Wow so cool" />
</template>);
assert.dom(".admin-page-header__title").exists().hasText("Wow so cool");
});
test("renders base breadcrumbs and yielded <:breadcrumbs>", async function (assert) {
await render(<template>
<AdminPageHeader @titleLabel="admin.titile">
<:breadcrumbs>
<DBreadcrumbsItem
@path="/admin/badges"
@label={{i18n "admin.badges.title"}}
/>
</:breadcrumbs>
</AdminPageHeader>
</template>);
assert
.dom(".admin-page-header__breadcrumbs .d-breadcrumbs__item")
.exists({ count: 2 });
assert
.dom(".admin-page-header__breadcrumbs .d-breadcrumbs__item")
.hasText(i18n("admin_title"));
assert
.dom(".admin-page-header__breadcrumbs .d-breadcrumbs__item:last-child")
.hasText(i18n("admin.badges.title"));
});
test("no @descriptionLabel and no @descriptionLabelTranslated", async function (assert) {
await render(<template><AdminPageHeader /></template>);
assert.dom(".admin-page-header__description").doesNotExist();
});
test("@descriptionLabel", async function (assert) {
await render(<template>
<AdminPageHeader @descriptionLabel="admin.badges.description" />
</template>);
assert
.dom(".admin-page-header__description")
.exists()
.hasText(i18n("admin.badges.description"));
});
test("@descriptionLabelTranslated", async function (assert) {
await render(<template>
<AdminPageHeader
@descriptionLabelTranslated="Some description which supports <strong>HTML</strong>"
/>
</template>);
assert
.dom(".admin-page-header__description")
.exists()
.hasText("Some description which supports HTML");
assert.dom(".admin-page-header__description strong").exists();
});
test("no @learnMoreUrl", async function (assert) {
await render(<template><AdminPageHeader /></template>);
assert.dom(".admin-page-header__learn-more").doesNotExist();
});
test("@learnMoreUrl", async function (assert) {
await render(<template>
<AdminPageHeader
@descriptionLabel="admin.badges.description"
@learnMoreUrl="https://meta.discourse.org/t/96331"
/>
</template>);
assert.dom(".admin-page-header__learn-more").exists();
assert
.dom(".admin-page-header__learn-more a")
.hasText("Learn more…")
.hasAttribute("href", "https://meta.discourse.org/t/96331");
});
test("renders nav tabs in yielded <:tabs>", async function (assert) {
await render(<template>
<AdminPageHeader>
<:tabs>
<NavItem
@route="admin.backups.settings"
@label="settings"
class="admin-backups-tabs__settings"
/>
</:tabs>
</AdminPageHeader>
</template>);
assert
.dom(".admin-nav-submenu__tabs .admin-backups-tabs__settings")
.exists()
.hasText(i18n("settings"));
});
test("renders all types of action buttons in yielded <:actions>", async function (assert) {
let actionCalled = false;
const someAction = () => {
actionCalled = true;
};
await render(<template>
<AdminPageHeader>
<:actions as |actions|>
<actions.Primary
@route="adminBadges.show"
@routeModels="new"
@icon="plus"
@label="admin.badges.new"
class="new-badge"
/>
<actions.Default
@route="adminBadges.award"
@routeModels="new"
@icon="upload"
@label="admin.badges.mass_award.title"
class="award-badge"
/>
<actions.Danger
@action={{someAction}}
@title="admin.badges.group_settings"
@label="admin.badges.group_settings"
@icon="cog"
class="edit-groupings-btn"
/>
</:actions>
</AdminPageHeader>
</template>);
assert
.dom(
".admin-page-header__actions .admin-page-action-button.new-badge.btn.btn-small.btn-primary"
)
.exists();
assert
.dom(
".admin-page-header__actions .admin-page-action-button.award-badge.btn.btn-small.btn-default"
)
.exists();
assert
.dom(
".admin-page-header__actions .admin-page-action-button.edit-groupings-btn.btn.btn-small.btn-danger"
)
.exists();
await click(".edit-groupings-btn");
assert.true(actionCalled);
});
});

129
app/assets/javascripts/discourse/tests/integration/components/admin-page-subheader-test.gjs Normal file
View File

@ -0,0 +1,129 @@
import { click, render } from "@ember/test-helpers";
import { module, test } from "qunit";
import { setupRenderingTest } from "discourse/tests/helpers/component-test";
import i18n from "discourse-common/helpers/i18n";
import AdminPageSubheader from "admin/components/admin-page-subheader";
module("Integration | Component | AdminPageSubheader", function (hooks) {
setupRenderingTest(hooks);
test("@titleLabel", async function (assert) {
await render(<template>
<AdminPageSubheader @titleLabel="admin.title" />
</template>);
assert
.dom(".admin-page-subheader__title")
.exists()
.hasText(i18n("admin.title"));
});
test("@titleLabelTranslated", async function (assert) {
await render(<template>
<AdminPageSubheader @titleLabelTranslated="Wow so cool" />
</template>);
assert.dom(".admin-page-subheader__title").exists().hasText("Wow so cool");
});
test("no @descriptionLabel and no @descriptionLabelTranslated", async function (assert) {
await render(<template><AdminPageSubheader /></template>);
assert.dom(".admin-page-subheader__description").doesNotExist();
});
test("@descriptionLabel", async function (assert) {
await render(<template>
<AdminPageSubheader @descriptionLabel="admin.badges.description" />
</template>);
assert
.dom(".admin-page-subheader__description")
.exists()
.hasText(i18n("admin.badges.description"));
});
test("@descriptionLabelTranslated", async function (assert) {
await render(<template>
<AdminPageSubheader
@descriptionLabelTranslated="Some description which supports <strong>HTML</strong>"
/>
</template>);
assert
.dom(".admin-page-subheader__description")
.exists()
.hasText("Some description which supports HTML");
assert.dom(".admin-page-subheader__description strong").exists();
});
test("no @learnMoreUrl", async function (assert) {
await render(<template><AdminPageSubheader /></template>);
assert.dom(".admin-page-subheader__learn-more").doesNotExist();
});
test("@learnMoreUrl", async function (assert) {
await render(<template>
<AdminPageSubheader
@descriptionLabel="admin.badges.description"
@learnMoreUrl="https://meta.discourse.org/t/96331"
/>
</template>);
assert.dom(".admin-page-subheader__learn-more").exists();
assert
.dom(".admin-page-subheader__learn-more a")
.hasText("Learn more…")
.hasAttribute("href", "https://meta.discourse.org/t/96331");
});
test("renders all types of action buttons in yielded <:actions>", async function (assert) {
let actionCalled = false;
const someAction = () => {
actionCalled = true;
};
await render(<template>
<AdminPageSubheader>
<:actions as |actions|>
<actions.Primary
@route="adminBadges.show"
@routeModels="new"
@icon="plus"
@label="admin.badges.new"
class="new-badge"
/>
<actions.Default
@route="adminBadges.award"
@routeModels="new"
@icon="upload"
@label="admin.badges.mass_award.title"
class="award-badge"
/>
<actions.Danger
@action={{someAction}}
@title="admin.badges.group_settings"
@label="admin.badges.group_settings"
@icon="cog"
class="edit-groupings-btn"
/>
</:actions>
</AdminPageSubheader>
</template>);
assert
.dom(
".admin-page-subheader__actions .admin-page-action-button.new-badge.btn.btn-small.btn-primary"
)
.exists();
assert
.dom(
".admin-page-subheader__actions .admin-page-action-button.award-badge.btn.btn-small.btn-default"
)
.exists();
assert
.dom(
".admin-page-subheader__actions .admin-page-action-button.edit-groupings-btn.btn.btn-small.btn-danger"
)
.exists();
await click(".edit-groupings-btn");
assert.true(actionCalled);
});
});