DEV: Switch sidebar section link identifier to data attribute (#21051)

Data attribute is less restrictive than relying on the class attribute
This commit is contained in:
Alan Guo Xiang Tan 2023-04-12 15:52:10 +08:00 committed by GitHub
parent 3b045a2016
commit 2eb60c9713
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
17 changed files with 207 additions and 198 deletions

View File

@ -10,6 +10,7 @@
target={{this.target}} target={{this.target}}
class={{this.classNames}} class={{this.classNames}}
title={{@title}} title={{@title}}
data-link-name={{@linkName}}
...attributes ...attributes
> >
<Sidebar::SectionLinkPrefix <Sidebar::SectionLinkPrefix
@ -33,6 +34,7 @@
@models={{this.models}} @models={{this.models}}
@current-when={{@currentWhen}} @current-when={{@currentWhen}}
title={{@title}} title={{@title}}
data-link-name={{@linkName}}
...attributes ...attributes
> >

View File

@ -27,16 +27,6 @@ export default class SectionLink extends Component {
get classNames() { get classNames() {
let classNames = ["sidebar-section-link", "sidebar-row"]; let classNames = ["sidebar-section-link", "sidebar-row"];
if (this.args.linkName) {
classNames.push(
`sidebar-section-link-${this.args.linkName
.split(" ")
.filter((s) => s)
.join("-")
.toLowerCase()}`
);
}
if (this.args.class) { if (this.args.class) {
classNames.push(this.args.class); classNames.push(this.args.class);
} }

View File

@ -53,7 +53,7 @@ acceptance("Sidebar - Anonymous - Categories Section", function (needs) {
); );
assert.ok( assert.ok(
exists("a.sidebar-section-link-all-categories"), exists("a.sidebar-section-link[data-link-name='all-categories']"),
"all categories link is visible" "all categories link is visible"
); );
}); });
@ -97,7 +97,7 @@ acceptance("Sidebar - Anonymous - Categories Section", function (needs) {
); );
assert.ok( assert.ok(
exists("a.sidebar-section-link-all-categories"), exists("a.sidebar-section-link[data-link-name='all-categories']"),
"all categories link is visible" "all categories link is visible"
); );
}); });
@ -118,7 +118,7 @@ acceptance("Sidebar - Anonymous - Categories Section", function (needs) {
assert.strictEqual(categories[2].textContent.trim(), "bug"); assert.strictEqual(categories[2].textContent.trim(), "bug");
assert.ok( assert.ok(
exists("a.sidebar-section-link-all-categories"), exists("a.sidebar-section-link[data-link-name='all-categories']"),
"all categories link is visible" "all categories link is visible"
); );
}); });
@ -138,7 +138,7 @@ acceptance("Sidebar - Anonymous - Categories Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
`.sidebar-section[data-section-name='categories'] .sidebar-section-link-${firstCategory.slug}` `.sidebar-section[data-section-name='categories'] .sidebar-section-link[data-link-name='${firstCategory.slug}']`
), ),
"category section link is not shown in sidebar after being marked as uncategorized" "category section link is not shown in sidebar after being marked as uncategorized"
); );

View File

@ -80,7 +80,7 @@ acceptance("Sidebar - Anonymous user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-users" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='users']"
), ),
"users section link is not shown in sidebar" "users section link is not shown in sidebar"
); );

View File

@ -31,7 +31,7 @@ acceptance("Sidebar - Anonymous Tags Section", function (needs) {
assert.strictEqual(categories[2].textContent.trim(), "fun"); assert.strictEqual(categories[2].textContent.trim(), "fun");
assert.ok( assert.ok(
exists("a.sidebar-section-link-all-tags"), exists("a.sidebar-section-link[data-link-name='all-tags']"),
"all tags link is visible" "all tags link is visible"
); );
}); });
@ -50,7 +50,7 @@ acceptance("Sidebar - Anonymous Tags Section", function (needs) {
assert.strictEqual(categories[1].textContent.trim(), "meta"); assert.strictEqual(categories[1].textContent.trim(), "meta");
assert.ok( assert.ok(
exists("a.sidebar-section-link-all-tags"), exists("a.sidebar-section-link[data-link-name='all-tags']"),
"all tags link is visible" "all tags link is visible"
); );
}); });

View File

@ -439,7 +439,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
); );
const myCustomTopSectionLink = query( const myCustomTopSectionLink = query(
".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-content-secondary .sidebar-section-link-my-custom-top" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-content-secondary .sidebar-section-link[data-link-name='my-custom-top']"
); );
assert.ok( assert.ok(
@ -501,7 +501,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
await visit("/"); await visit("/");
const customLatestSectionLink = query( const customLatestSectionLink = query(
".sidebar-section[data-section-name='community'] .sidebar-section-link-latest" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='latest']"
); );
assert.ok( assert.ok(
@ -525,7 +525,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
); );
const customUnreadSectionLink = query( const customUnreadSectionLink = query(
".sidebar-section[data-section-name='community'] .sidebar-section-link-my-unreads" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='my-unreads']"
); );
assert.ok( assert.ok(
@ -545,7 +545,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
); );
const customTopSectionLInk = query( const customTopSectionLInk = query(
".sidebar-section[data-section-name='community'] .sidebar-section-link-my-custom-top" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='my-custom-top']"
); );
assert.ok( assert.ok(
@ -554,7 +554,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
); );
const openBugsSectionLink = query( const openBugsSectionLink = query(
".sidebar-section[data-section-name='community'] .sidebar-section-link-open-bugs" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='open-bugs']"
); );
assert.ok( assert.ok(
@ -576,7 +576,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-my-favourite-topic.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='my-favourite-topic'].active"
), ),
"displays my favourite topic custom section link when current route matches the link's route" "displays my favourite topic custom section link when current route matches the link's route"
); );

View File

@ -43,7 +43,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
count( count(
".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link-all-categories)" ".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link[data-link-name='all-categories'])"
), ),
1, 1,
"there should only be one section link under the section" "there should only be one section link under the section"
@ -165,13 +165,13 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='categories'] .sidebar-section-link-configure-categories" ".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-link-name='configure-categories']"
), ),
"section link to add categories to sidebar is displayed" "section link to add categories to sidebar is displayed"
); );
await click( await click(
".sidebar-section[data-section-name='categories'] .sidebar-section-link-configure-categories" ".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-link-name='configure-categories']"
); );
assert.strictEqual( assert.strictEqual(
@ -243,7 +243,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit("/"); await visit("/");
const categorySectionLinks = queryAll( const categorySectionLinks = queryAll(
".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link-all-categories)" ".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link[data-link-name='all-categories'])"
); );
const categoryNames = [...categorySectionLinks].map((categorySectionLink) => const categoryNames = [...categorySectionLinks].map((categorySectionLink) =>
@ -306,7 +306,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit("/"); await visit("/");
const categorySectionLinks = queryAll( const categorySectionLinks = queryAll(
".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link-all-categories)" ".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link[data-link-name='all-categories'])"
); );
const categoryNames = [...categorySectionLinks].map((categorySectionLink) => const categoryNames = [...categorySectionLinks].map((categorySectionLink) =>
@ -369,7 +369,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit("/"); await visit("/");
const categorySectionLinks = queryAll( const categorySectionLinks = queryAll(
".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link-all-categories)" ".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link[data-link-name='all-categories'])"
); );
const categoryNames = [...categorySectionLinks].map((categorySectionLink) => const categoryNames = [...categorySectionLinks].map((categorySectionLink) =>
@ -397,7 +397,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.strictEqual( assert.strictEqual(
count( count(
".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link-all-categories)" ".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link[data-link-name='all-categories'])"
), ),
4, 4,
"there should only be 4 section link under the section" "there should only be 4 section link under the section"
@ -959,11 +959,15 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit("/"); await visit("/");
assert.ok( assert.ok(
exists(".sidebar-section-link-configure-default-sidebar-categories"), exists(
".sidebar-section-link[data-link-name='configure-default-sidebar-categories']"
),
"section link to configure default sidebar categories is shown" "section link to configure default sidebar categories is shown"
); );
await click(".sidebar-section-link-configure-default-sidebar-categories"); await click(
".sidebar-section-link[data-link-name='configure-default-sidebar-categories']"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),

View File

@ -153,7 +153,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
test("clicking on everything link", async function (assert) { test("clicking on everything link", async function (assert) {
await visit("/t/280"); await visit("/t/280");
await click( await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything']"
); );
assert.strictEqual( assert.strictEqual(
@ -172,7 +172,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything'].active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -185,7 +185,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/t/280"); await visit("/t/280");
await click( await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything']"
); );
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -203,7 +203,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything'].active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -225,7 +225,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
}); });
await visit("/t/280"); await visit("/t/280");
await click( await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything']"
); );
assert.strictEqual( assert.strictEqual(
@ -244,7 +244,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything'].active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -274,7 +274,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
}); });
await visit("/t/280"); await visit("/t/280");
await click( await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything']"
); );
assert.strictEqual( assert.strictEqual(
@ -293,7 +293,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything'].active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -304,7 +304,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-users" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='users']"
), ),
"users link is not displayed in sidebar when it is not the active route" "users link is not displayed in sidebar when it is not the active route"
); );
@ -314,7 +314,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
await click( await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-users" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='users']"
); );
assert.strictEqual( assert.strictEqual(
@ -333,7 +333,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-users.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='users'].active"
), ),
"the users link is marked as active" "the users link is marked as active"
); );
@ -350,7 +350,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-users.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='users'].active"
), ),
"users link is displayed in sidebar when it is the active route" "users link is displayed in sidebar when it is the active route"
); );
@ -367,7 +367,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-users" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='users']"
), ),
"users section link is not displayed in sidebar" "users section link is not displayed in sidebar"
); );
@ -381,7 +381,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
await click( await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-badges" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='badges']"
); );
assert.strictEqual( assert.strictEqual(
@ -402,7 +402,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-badges" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='badges']"
), ),
"badges section link is not shown in sidebar" "badges section link is not shown in sidebar"
); );
@ -413,7 +413,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-groups" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='groups']"
), ),
"groups link is not displayed in sidebar when it is not the active route" "groups link is not displayed in sidebar when it is not the active route"
); );
@ -423,7 +423,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
await click( await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-groups" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='groups']"
); );
assert.strictEqual( assert.strictEqual(
@ -442,7 +442,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-groups.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='groups'].active"
), ),
"the groups link is marked as active" "the groups link is marked as active"
); );
@ -459,7 +459,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-groups.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='groups'].active"
), ),
"groups link is displayed in sidebar when it is the active route" "groups link is displayed in sidebar when it is the active route"
); );
@ -476,7 +476,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-groups" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='groups']"
), ),
"groups section link is not shown in sidebar" "groups section link is not shown in sidebar"
); );
@ -490,7 +490,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
await click( await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-about" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='about']"
); );
assert.strictEqual( assert.strictEqual(
@ -501,7 +501,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-about.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='about'].active"
), ),
"about section link link is displayed in the main section and marked as active" "about section link link is displayed in the main section and marked as active"
); );
@ -515,7 +515,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
await click( await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-faq" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='faq']"
); );
assert.strictEqual( assert.strictEqual(
@ -536,7 +536,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section[data-section-name='community'] .sidebar-section-link-faq" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='faq']"
).href, ).href,
"http://some.faq.url/", "http://some.faq.url/",
"href attribute is set to custom FAQ URL on the section link" "href attribute is set to custom FAQ URL on the section link"
@ -546,7 +546,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
test("navigating to admin from sidebar", async function (assert) { test("navigating to admin from sidebar", async function (assert) {
await visit("/"); await visit("/");
await click( await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-admin" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='admin']"
); );
assert.strictEqual(currentRouteName(), "admin.dashboard.general"); assert.strictEqual(currentRouteName(), "admin.dashboard.general");
@ -559,7 +559,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-admin" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='admin']"
) )
); );
}); });
@ -567,7 +567,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
test("clicking on my posts link", async function (assert) { test("clicking on my posts link", async function (assert) {
await visit("/t/280"); await visit("/t/280");
await click( await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-my-posts" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='my-posts']"
); );
assert.strictEqual( assert.strictEqual(
@ -586,7 +586,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-my-posts.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='my-posts'].active"
), ),
"the my posts link is marked as active" "the my posts link is marked as active"
); );
@ -595,7 +595,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-my-posts.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='my-posts'].active"
), ),
"the my posts link is not marked as active when user has no drafts and visiting the user activity drafts URL" "the my posts link is not marked as active when user has no drafts and visiting the user activity drafts URL"
); );
@ -609,7 +609,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
}); });
await click( await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-my-posts" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='my-posts']"
); );
assert.strictEqual( assert.strictEqual(
@ -628,7 +628,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-my-posts.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='my-posts'].active"
), ),
"the my posts link is marked as active" "the my posts link is marked as active"
); );
@ -637,7 +637,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-my-posts.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='my-posts'].active"
), ),
"the my posts link is marked as active" "the my posts link is marked as active"
); );
@ -647,7 +647,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
assert.strictEqual( assert.strictEqual(
query(".sidebar-section-link-my-posts").title, query(".sidebar-section-link[data-link-name='my-posts']").title,
I18n.t("sidebar.sections.community.links.my_posts.title"), I18n.t("sidebar.sections.community.links.my_posts.title"),
"displays the default title when no drafts are present" "displays the default title when no drafts are present"
); );
@ -657,7 +657,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
}); });
assert.strictEqual( assert.strictEqual(
query(".sidebar-section-link-my-posts").title, query(".sidebar-section-link[data-link-name='my-posts']").title,
I18n.t("sidebar.sections.community.links.my_posts.title_drafts"), I18n.t("sidebar.sections.community.links.my_posts.title_drafts"),
"displays the draft title when drafts are present" "displays the draft title when drafts are present"
); );
@ -671,7 +671,9 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
assert.strictEqual( assert.strictEqual(
query(".sidebar-section-link-my-posts").textContent.trim(), query(
".sidebar-section-link[data-link-name='my-posts']"
).textContent.trim(),
I18n.t("sidebar.sections.community.links.my_posts.content"), I18n.t("sidebar.sections.community.links.my_posts.content"),
"displays the default text when no drafts are present" "displays the default text when no drafts are present"
); );
@ -682,14 +684,14 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-link-my-posts .sidebar-section-link-content-text" ".sidebar-section-link[data-link-name='my-posts'] .sidebar-section-link-content-text"
).textContent.trim(), ).textContent.trim(),
I18n.t("sidebar.sections.community.links.my_posts.content_drafts"), I18n.t("sidebar.sections.community.links.my_posts.content_drafts"),
"displays the text that's appropriate for when drafts are present" "displays the text that's appropriate for when drafts are present"
); );
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-link-my-posts .sidebar-section-link-content-badge" ".sidebar-section-link[data-link-name='my-posts'] .sidebar-section-link-content-badge"
).textContent.trim(), ).textContent.trim(),
"1", "1",
"displays the draft count with no text" "displays the draft count with no text"
@ -709,7 +711,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything'].active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -728,7 +730,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything'].active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -747,7 +749,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything'].active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -784,7 +786,9 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
assert.ok( assert.ok(
exists(".sidebar-section-link-everything .sidebar-section-link-suffix"), exists(
".sidebar-section-link[data-link-name='everything'] .sidebar-section-link-suffix"
),
"shows suffix indicator for unread posts on everything link" "shows suffix indicator for unread posts on everything link"
); );
@ -800,7 +804,9 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
}); });
assert.ok( assert.ok(
exists(".sidebar-section-link-everything .sidebar-section-link-suffix"), exists(
".sidebar-section-link[data-link-name='everything'] .sidebar-section-link-suffix"
),
"shows suffix indicator for new topics on categories link" "shows suffix indicator for new topics on categories link"
); );
@ -816,7 +822,9 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
}); });
assert.ok( assert.ok(
!exists(".sidebar-section-link-everything .sidebar-section-link-suffix"), !exists(
".sidebar-section-link[data-link-name='everything'] .sidebar-section-link-suffix"
),
"it removes the suffix indicator when all topics are read" "it removes the suffix indicator when all topics are read"
); );
}); });
@ -873,7 +881,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-link-everything .sidebar-section-link-content-badge" ".sidebar-section-link[data-link-name='everything'] .sidebar-section-link-content-badge"
).textContent.trim(), ).textContent.trim(),
"3 unread", "3 unread",
"it displays the right unread count" "it displays the right unread count"
@ -892,7 +900,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-link-everything .sidebar-section-link-content-badge" ".sidebar-section-link[data-link-name='everything'] .sidebar-section-link-content-badge"
).textContent.trim(), ).textContent.trim(),
"2 unread", "2 unread",
"it updates the unread count" "it updates the unread count"
@ -922,7 +930,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-link-everything .sidebar-section-link-content-badge" ".sidebar-section-link[data-link-name='everything'] .sidebar-section-link-content-badge"
).textContent.trim(), ).textContent.trim(),
"1 new", "1 new",
"it displays the new count once there are no unread topics" "it displays the new count once there are no unread topics"
@ -940,7 +948,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
!exists( !exists(
".sidebar-section-link-everything .sidebar-section-link-content-badge" ".sidebar-section-link[data-link-name='everything'] .sidebar-section-link-content-badge"
), ),
"it removes new count once there are no new topics" "it removes new count once there are no new topics"
); );
@ -953,7 +961,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-review" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='review']"
), ),
"review link is not shown" "review link is not shown"
); );
@ -964,7 +972,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-review" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='review']"
), ),
"review link is not shown" "review link is not shown"
); );
@ -980,7 +988,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-review.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='review'].active"
), ),
"review link is shown as active when visiting the review route even if there are no pending reviewables" "review link is shown as active when visiting the review route even if there are no pending reviewables"
); );
@ -989,7 +997,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-review" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='review']"
), ),
"review link is not shown as part of the main section links" "review link is not shown as part of the main section links"
); );
@ -1000,7 +1008,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-content .sidebar-section-link-review" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-content .sidebar-section-link[data-link-name='review']"
), ),
"review link is displayed in the more drawer" "review link is displayed in the more drawer"
); );
@ -1011,14 +1019,14 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-review" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='review']"
), ),
"review link is shown as part of the main section links" "review link is shown as part of the main section links"
); );
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section[data-section-name='community'] .sidebar-section-link-review .sidebar-section-link-content-badge" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='review'] .sidebar-section-link-content-badge"
).textContent.trim(), ).textContent.trim(),
"34 pending", "34 pending",
"displays the pending reviewable count" "displays the pending reviewable count"
@ -1030,7 +1038,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-content .sidebar-section-link-review" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-content .sidebar-section-link[data-link-name='review']"
), ),
"review link is not displayed in the more drawer" "review link is not displayed in the more drawer"
); );
@ -1053,18 +1061,20 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
query(".sidebar-section-link-unread").textContent.trim(), query(
".sidebar-section-link[data-link-name='unread']"
).textContent.trim(),
"unread topics", "unread topics",
"displays the right text for the link" "displays the right text for the link"
); );
assert.strictEqual( assert.strictEqual(
query(".sidebar-section-link-unread").title, query(".sidebar-section-link[data-link-name='unread']").title,
"List of unread topics", "List of unread topics",
"displays the right title for the link" "displays the right title for the link"
); );
await click(".sidebar-section-link-unread"); await click(".sidebar-section-link[data-link-name='unread']");
assert.strictEqual(currentURL(), "/unread", "links to the right URL"); assert.strictEqual(currentURL(), "/unread", "links to the right URL");
}); });
@ -1108,7 +1118,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
await click(".sidebar-section-link-user-summary"); await click(".sidebar-section-link[data-link-name='user-summary']");
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -1117,13 +1127,15 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
query(".sidebar-section-link-user-summary").textContent.trim(), query(
".sidebar-section-link[data-link-name='user-summary']"
).textContent.trim(),
"my summary", "my summary",
"displays the right text for the link" "displays the right text for the link"
); );
assert.strictEqual( assert.strictEqual(
query(".sidebar-section-link-user-summary").title, query(".sidebar-section-link[data-link-name='user-summary']").title,
"eviltrout summary", "eviltrout summary",
"displays the right title for the link" "displays the right title for the link"
); );
@ -1183,7 +1195,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything .sidebar-section-link-content-badge" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything'] .sidebar-section-link-content-badge"
).textContent.trim(), ).textContent.trim(),
"2", "2",
"count is 2 because there's 1 unread topic and 1 new topic" "count is 2 because there's 1 unread topic and 1 new topic"
@ -1218,7 +1230,7 @@ acceptance(
assert.true( assert.true(
query( query(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything']"
).href.endsWith("/new"), ).href.endsWith("/new"),
"links to /new because there are 1 new and 1 unread topics" "links to /new because there are 1 new and 1 unread topics"
); );
@ -1234,7 +1246,7 @@ acceptance(
assert.true( assert.true(
query( query(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything']"
).href.endsWith("/new"), ).href.endsWith("/new"),
"links to /new because there is 1 unread topic" "links to /new because there is 1 unread topic"
); );
@ -1250,7 +1262,7 @@ acceptance(
assert.true( assert.true(
query( query(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything']"
).href.endsWith("/latest"), ).href.endsWith("/latest"),
"links to /latest because there are no unread or new topics" "links to /latest because there are no unread or new topics"
); );
@ -1266,7 +1278,7 @@ acceptance(
assert.true( assert.true(
query( query(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything" ".sidebar-section[data-section-name='community'] .sidebar-section-link[data-link-name='everything']"
).href.endsWith("/new"), ).href.endsWith("/new"),
"links to /new because there is 1 new topic" "links to /new because there is 1 new topic"
); );

View File

@ -103,7 +103,7 @@ acceptance(
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-inbox" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='personal-messages-inbox']"
), ),
"displays the personal message inbox link" "displays the personal message inbox link"
); );
@ -117,12 +117,12 @@ acceptance(
); );
await click( await click(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-inbox" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='personal-messages-inbox']"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-inbox.active" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='personal-messages-inbox'].active"
), ),
"personal message inbox link is marked as active" "personal message inbox link is marked as active"
); );
@ -141,11 +141,11 @@ acceptance(
await visit("/"); await visit("/");
await click( await click(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-inbox" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='personal-messages-inbox']"
); );
await click( await click(
`.sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-${type}` `.sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='personal-messages-${type}']`
); );
assert.strictEqual( assert.strictEqual(
@ -164,21 +164,21 @@ acceptance(
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-inbox.active" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='personal-messages-inbox'].active"
), ),
"personal message inbox link is marked as active" "personal message inbox link is marked as active"
); );
assert.ok( assert.ok(
exists( exists(
`.sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-${type}.active` `.sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='personal-messages-${type}'].active`
), ),
`personal message ${type} link is marked as active` `personal message ${type} link is marked as active`
); );
assert.notOk( assert.notOk(
exists( exists(
`.sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-${type} .sidebar-section-link-prefix` `.sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='personal-messages-${type}'] .sidebar-section-link-prefix`
), ),
`prefix is not displayed for ${type} personal message section link` `prefix is not displayed for ${type} personal message section link`
); );
@ -236,7 +236,7 @@ acceptance(
); );
await click( await click(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-inbox.group3" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='group-messages-inbox'].group3"
); );
assert.strictEqual( assert.strictEqual(
@ -278,11 +278,11 @@ acceptance(
await visit("/"); await visit("/");
await click( await click(
`.sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-inbox.group1` `.sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='group-messages-inbox'].group1`
); );
await click( await click(
`.sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-${type}.group1` `.sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='group-messages-${type}'].group1`
); );
assert.strictEqual( assert.strictEqual(
@ -301,14 +301,14 @@ acceptance(
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-inbox.group1.active" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='group-messages-inbox'].group1.active"
), ),
"group1 group message inbox link is marked as active" "group1 group message inbox link is marked as active"
); );
assert.ok( assert.ok(
exists( exists(
`.sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-${type}.group1.active` `.sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='group-messages-${type}'].group1.active`
), ),
`group1 group message ${type} link is marked as active` `group1 group message ${type} link is marked as active`
); );
@ -407,7 +407,7 @@ acceptance(
); );
await click( await click(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-inbox.group1" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='group-messages-inbox'].group1"
); );
await publishToMessageBus(pmTopicTrackingState.groupChannel(1), { await publishToMessageBus(pmTopicTrackingState.groupChannel(1), {
@ -434,7 +434,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-unread.group1" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='group-messages-unread'].group1"
).textContent.trim(), ).textContent.trim(),
I18n.t("sidebar.sections.messages.links.unread_with_count", { I18n.t("sidebar.sections.messages.links.unread_with_count", {
count: 1, count: 1,
@ -444,7 +444,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-new.group1" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='group-messages-new'].group1"
).textContent.trim(), ).textContent.trim(),
I18n.t("sidebar.sections.messages.links.new_with_count", { I18n.t("sidebar.sections.messages.links.new_with_count", {
count: 1, count: 1,
@ -465,7 +465,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-new.group1" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='group-messages-new'].group1"
).textContent.trim(), ).textContent.trim(),
I18n.t("sidebar.sections.messages.links.new"), I18n.t("sidebar.sections.messages.links.new"),
"removes count for group1 new inbox filter link" "removes count for group1 new inbox filter link"
@ -480,7 +480,7 @@ acceptance(
); );
await click( await click(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-inbox" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='personal-messages-inbox']"
); );
await publishToMessageBus(pmTopicTrackingState.userChannel(), { await publishToMessageBus(pmTopicTrackingState.userChannel(), {
@ -496,7 +496,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-unread" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='personal-messages-unread']"
).textContent.trim(), ).textContent.trim(),
I18n.t("sidebar.sections.messages.links.unread_with_count", { I18n.t("sidebar.sections.messages.links.unread_with_count", {
count: 1, count: 1,
@ -517,7 +517,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-unread" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='personal-messages-unread']"
).textContent.trim(), ).textContent.trim(),
I18n.t("sidebar.sections.messages.links.unread_with_count", { I18n.t("sidebar.sections.messages.links.unread_with_count", {
count: 2, count: 2,
@ -538,7 +538,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-new" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='personal-messages-new']"
).textContent.trim(), ).textContent.trim(),
I18n.t("sidebar.sections.messages.links.new_with_count", { I18n.t("sidebar.sections.messages.links.new_with_count", {
count: 1, count: 1,
@ -559,7 +559,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-new" ".sidebar-section[data-section-name='messages'] .sidebar-section-link[data-link-name='personal-messages-new']"
).textContent.trim(), ).textContent.trim(),
I18n.t("sidebar.sections.messages.links.new"), I18n.t("sidebar.sections.messages.links.new"),
"removes the count from the new inbox filter link" "removes the count from the new inbox filter link"

View File

@ -144,13 +144,13 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section[data-section-name='tags'] .sidebar-section-link-configure-tags" ".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-link-name='configure-tags']"
), ),
"section link to add tags to sidebar is displayed" "section link to add tags to sidebar is displayed"
); );
await click( await click(
".sidebar-section[data-section-name='tags'] .sidebar-section-link-configure-tags" ".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-link-name='configure-tags']"
); );
assert.strictEqual( assert.strictEqual(
@ -164,7 +164,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
await visit("/"); await visit("/");
const tagSectionLinks = queryAll( const tagSectionLinks = queryAll(
".sidebar-section[data-section-name='tags'] .sidebar-section-link:not(.sidebar-section-link-all-tags)" ".sidebar-section[data-section-name='tags'] .sidebar-section-link:not(.sidebar-section-link[data-link-name='all-tags'])"
); );
const tagNames = [...tagSectionLinks].map((tagSectionLink) => const tagNames = [...tagSectionLinks].map((tagSectionLink) =>
@ -183,7 +183,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
assert.strictEqual( assert.strictEqual(
count( count(
".sidebar-section[data-section-name='tags'] .sidebar-section-link:not(.sidebar-section-link-all-tags)" ".sidebar-section[data-section-name='tags'] .sidebar-section-link:not(.sidebar-section-link[data-link-name='all-tags'])"
), ),
4, 4,
"4 section links under the section" "4 section links under the section"
@ -675,11 +675,15 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
await visit("/"); await visit("/");
assert.ok( assert.ok(
exists(".sidebar-section-link-configure-default-sidebar-tags"), exists(
".sidebar-section-link[data-link-name='configure-default-sidebar-tags']"
),
"section link to configure default sidebar tags is shown" "section link to configure default sidebar tags is shown"
); );
await click(".sidebar-section-link-configure-default-sidebar-tags"); await click(
".sidebar-section-link[data-link-name='configure-default-sidebar-tags']"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),

View File

@ -25,12 +25,7 @@ module("Integration | Component | sidebar | section-link", function (hooks) {
containsExactly( containsExactly(
assert, assert,
query("a").classList, query("a").classList,
[ ["ember-view", "sidebar-row", "sidebar-section-link"],
"ember-view",
"sidebar-row",
"sidebar-section-link",
"sidebar-section-link-test-meta",
],
"has the right class attribute for the link" "has the right class attribute for the link"
); );
}); });
@ -43,14 +38,7 @@ module("Integration | Component | sidebar | section-link", function (hooks) {
containsExactly( containsExactly(
assert, assert,
query("a").classList, query("a").classList,
[ ["123", "abc", "ember-view", "sidebar-row", "sidebar-section-link"],
"123",
"abc",
"ember-view",
"sidebar-row",
"sidebar-section-link",
"sidebar-section-link-test-meta",
],
"has the right class attribute for the link" "has the right class attribute for the link"
); );
}); });

View File

@ -69,13 +69,13 @@
} }
} }
.sidebar-section-link-personal-messages-sent, .sidebar-section-link[data-link-name="personal-messages-sent"],
.sidebar-section-link-personal-messages-new, .sidebar-section-link[data-link-name="personal-messages-new"],
.sidebar-section-link-personal-messages-archive, .sidebar-section-link[data-link-name="personal-messages-archive"],
.sidebar-section-link-personal-messages-unread, .sidebar-section-link[data-link-name="personal-messages-unread"],
.sidebar-section-link-group-messages-new, .sidebar-section-link[data-link-name="group-messages-new"],
.sidebar-section-link-group-messages-unread, .sidebar-section-link[data-link-name="group-messages-unread"],
.sidebar-section-link-group-messages-archive { .sidebar-section-link[data-link-name="group-messages-archive"] {
.sidebar-section-link-content-text { .sidebar-section-link-content-text {
margin-left: calc( margin-left: calc(
var(--d-sidebar-section-link-prefix-margin-right) + var(--d-sidebar-section-link-prefix-margin-right) +

View File

@ -10,6 +10,7 @@ RSpec.describe "Navigation", type: :system, js: true do
fab!(:message) { Fabricate(:chat_message, chat_channel: category_channel) } fab!(:message) { Fabricate(:chat_message, chat_channel: category_channel) }
let(:chat_page) { PageObjects::Pages::Chat.new } let(:chat_page) { PageObjects::Pages::Chat.new }
let(:sidebar_page) { PageObjects::Pages::Sidebar.new } let(:sidebar_page) { PageObjects::Pages::Sidebar.new }
let(:sidebar_component) { PageObjects::Components::Sidebar.new }
let(:chat_drawer_page) { PageObjects::Pages::ChatDrawer.new } let(:chat_drawer_page) { PageObjects::Pages::ChatDrawer.new }
before do before do
@ -134,7 +135,7 @@ RSpec.describe "Navigation", type: :system, js: true do
visit("/t/-/#{topic.id}") visit("/t/-/#{topic.id}")
chat_page.open_from_header chat_page.open_from_header
chat_drawer_page.close chat_drawer_page.close
find("a[class*='sidebar-section-link-#{category_channel.slug}']").click sidebar_component.click_link(category_channel.name)
expect(page).to have_css(".chat-message-container[data-id='#{message.id}']") expect(page).to have_css(".chat-message-container[data-id='#{message.id}']")
end end
@ -146,7 +147,7 @@ RSpec.describe "Navigation", type: :system, js: true do
chat_page.open_from_header chat_page.open_from_header
chat_drawer_page.maximize chat_drawer_page.maximize
visit("/") visit("/")
find("a[class*='sidebar-section-link-#{category_channel.slug}']").click sidebar_component.click_link(category_channel.name)
expect(page).to have_current_path( expect(page).to have_current_path(
chat.channel_path(category_channel.slug, category_channel.id), chat.channel_path(category_channel.slug, category_channel.id),
@ -247,23 +248,19 @@ RSpec.describe "Navigation", type: :system, js: true do
it "activates the channel in the sidebar" do it "activates the channel in the sidebar" do
visit("/chat/c/#{category_channel.slug}/#{category_channel.id}") visit("/chat/c/#{category_channel.slug}/#{category_channel.id}")
expect(page).to have_css(
".sidebar-section-link-#{category_channel.slug}.sidebar-section-link--active", expect(sidebar_component).to have_section_link(category_channel.name, active: true)
)
end end
it "does not have multiple channels marked active in the sidebar" do it "does not have multiple channels marked active in the sidebar" do
chat_page.visit_channel(dm_channel) chat_page.visit_channel(dm_channel)
expect(page).to have_css(
".sidebar-section-link-#{other_user.username}.sidebar-section-link--active",
)
page.find(".sidebar-section-link-#{category_channel.slug}").click expect(sidebar_component).to have_section_link(other_user.username, active: true)
expect(page).to have_css(
".sidebar-section-link-#{category_channel.slug}.sidebar-section-link--active",
)
expect(page).to have_css(".sidebar-section-link--active", count: 1) sidebar_component.click_section_link(category_channel.name)
expect(sidebar_component).to have_section_link(category_channel.name, active: true)
expect(sidebar_component).to have_one_active_section_link
end end
end end
@ -280,9 +277,7 @@ RSpec.describe "Navigation", type: :system, js: true do
visit("/chat/c/#{category_channel.slug}/#{category_channel.id}") visit("/chat/c/#{category_channel.slug}/#{category_channel.id}")
find("#site-logo").click find("#site-logo").click
expect(page).not_to have_css( expect(sidebar_component).not_to have_section_link(category_channel.name, active: true)
".sidebar-section-link-#{category_channel.slug}.sidebar-section-link--active",
)
end end
end end
@ -290,11 +285,9 @@ RSpec.describe "Navigation", type: :system, js: true do
it "activates the channel in the sidebar" do it "activates the channel in the sidebar" do
visit("/") visit("/")
chat_page.open_from_header chat_page.open_from_header
find("a[class*='#{category_channel.slug}']").click sidebar_component.click_link(category_channel.name)
expect(page).to have_css( expect(sidebar_component).to have_section_link(category_channel.name, active: true)
".sidebar-section-link-#{category_channel.slug}.sidebar-section-link--active",
)
end end
end end
@ -302,12 +295,11 @@ RSpec.describe "Navigation", type: :system, js: true do
it "deactivates the channel in the sidebar" do it "deactivates the channel in the sidebar" do
visit("/") visit("/")
chat_page.open_from_header chat_page.open_from_header
find("a[class*='sidebar-section-link-#{category_channel.slug}']").click
sidebar_component.click_link(category_channel.name)
chat_drawer_page.close chat_drawer_page.close
expect(page).not_to have_css( expect(sidebar_component).not_to have_section_link(category_channel.name, active: true)
".sidebar-section-link-#{category_channel.slug}.sidebar-section-link--active",
)
end end
end end
end end

View File

@ -2,6 +2,7 @@
RSpec.describe "Sidebar navigation menu", type: :system, js: true do RSpec.describe "Sidebar navigation menu", type: :system, js: true do
let(:sidebar_page) { PageObjects::Pages::Sidebar.new } let(:sidebar_page) { PageObjects::Pages::Sidebar.new }
let(:sidebar_component) { PageObjects::Components::Sidebar.new }
fab!(:current_user) { Fabricate(:user) } fab!(:current_user) { Fabricate(:user) }
@ -30,7 +31,7 @@ RSpec.describe "Sidebar navigation menu", type: :system, js: true do
visit("/") visit("/")
expect(sidebar_page.channels_section).to have_css( expect(sidebar_page.channels_section).to have_css(
".sidebar-section-link-#{channel_1.slug} .sidebar-section-link-prefix svg.prefix-icon.d-icon-d-chat", ".sidebar-section-link[data-link-name='#{channel_1.slug}'] .sidebar-section-link-prefix svg.prefix-icon.d-icon-d-chat",
) )
end end
@ -53,7 +54,7 @@ RSpec.describe "Sidebar navigation menu", type: :system, js: true do
visit("/") visit("/")
expect(sidebar_page.channels_section).to have_css( expect(sidebar_page.channels_section).to have_css(
".sidebar-section-link-#{private_channel_1.slug} .sidebar-section-link-prefix svg.prefix-badge.d-icon-lock", ".sidebar-section-link[data-link-name='#{private_channel_1.slug}'] .sidebar-section-link-prefix svg.prefix-badge.d-icon-lock",
) )
end end
end end
@ -67,7 +68,7 @@ RSpec.describe "Sidebar navigation menu", type: :system, js: true do
visit("/") visit("/")
expect(sidebar_page.channels_section).to have_css( expect(sidebar_page.channels_section).to have_css(
".sidebar-section-link-#{channel_1.slug} .emoji", ".sidebar-section-link[data-link-name='#{channel_1.slug}'] .emoji",
) )
end end
end end
@ -88,7 +89,7 @@ RSpec.describe "Sidebar navigation menu", type: :system, js: true do
visit("/") visit("/")
expect(sidebar_page.channels_section).to have_css( expect(sidebar_page.channels_section).to have_css(
".sidebar-section-link-#{channel_2.slug}.sidebar-section-link--muted", ".sidebar-section-link[data-link-name='#{channel_2.slug}'].sidebar-section-link--muted",
) )
end end
end end
@ -100,7 +101,11 @@ RSpec.describe "Sidebar navigation menu", type: :system, js: true do
visit("/") visit("/")
expect( expect(
sidebar_page.channels_section.find(".sidebar-section-link-#{channel_1.slug}")["title"], sidebar_page.channels_section.find(
".sidebar-section-link[data-link-name='#{channel_1.slug}']",
)[
"title"
],
).to eq("&lt;script&gt;alert(&#x27;hello&#x27;)&lt;/script&gt;") ).to eq("&lt;script&gt;alert(&#x27;hello&#x27;)&lt;/script&gt;")
end end
end end

View File

@ -31,7 +31,7 @@ describe "Custom sidebar sections", type: :system, js: true do
section_modal.save section_modal.save
expect(sidebar).to have_section("My section") expect(sidebar).to have_section("My section")
expect(sidebar).to have_link("Sidebar Tags") expect(sidebar).to have_section_link("Sidebar Tags")
end end
it "allows the user to create custom section with /my link" do it "allows the user to create custom section with /my link" do
@ -51,7 +51,7 @@ describe "Custom sidebar sections", type: :system, js: true do
section_modal.save section_modal.save
expect(sidebar).to have_section("My section") expect(sidebar).to have_section("My section")
expect(sidebar).to have_link("My preferences") expect(sidebar).to have_section_link("My preferences")
end end
it "allows the user to create custom section with external link" do it "allows the user to create custom section with external link" do
@ -74,7 +74,7 @@ describe "Custom sidebar sections", type: :system, js: true do
section_modal.save section_modal.save
expect(sidebar).to have_section("My section") expect(sidebar).to have_section("My section")
expect(sidebar).to have_link("Discourse Homepage", href: "https://discourse.org") expect(sidebar).to have_section_link("Discourse Homepage", href: "https://discourse.org")
end end
it "allows the user to edit custom section" do it "allows the user to edit custom section" do
@ -97,9 +97,9 @@ describe "Custom sidebar sections", type: :system, js: true do
section_modal.save section_modal.save
expect(sidebar).to have_section("Edited section") expect(sidebar).to have_section("Edited section")
expect(sidebar).to have_link("Edited Tag") expect(sidebar).to have_section_link("Edited Tag")
expect(page).not_to have_link("Sidebar Categories") expect(sidebar).not_to have_section_link("Sidebar Categories")
end end
it "allows the user to reorder links in custom section" do it "allows the user to reorder links in custom section" do
@ -111,22 +111,25 @@ describe "Custom sidebar sections", type: :system, js: true do
sign_in user sign_in user
visit("/latest") visit("/latest")
within(".sidebar-custom-sections .sidebar-section-link-wrapper:nth-child(1)") do within(".sidebar-custom-sections .sidebar-section-link-wrapper:nth-child(1)") do
expect(page).to have_css(".sidebar-section-link-sidebar-tags") expect(sidebar).to have_section_link("Sidebar Tags")
end
within(".sidebar-custom-sections .sidebar-section-link-wrapper:nth-child(2)") do
expect(page).to have_css(".sidebar-section-link-sidebar-categories")
end end
tags_link = find(".sidebar-section-link-sidebar-tags") within(".sidebar-custom-sections .sidebar-section-link-wrapper:nth-child(2)") do
categories_link = find(".sidebar-section-link-sidebar-categories") expect(sidebar).to have_section_link("Sidebar Categories")
end
tags_link = find(".sidebar-section-link[data-link-name='Sidebar Tags']")
categories_link = find(".sidebar-section-link[data-link-name='Sidebar Categories']")
tags_link.drag_to(categories_link, html5: true, delay: 0.4) tags_link.drag_to(categories_link, html5: true, delay: 0.4)
within(".sidebar-custom-sections .sidebar-section-link-wrapper:nth-child(1)") do within(".sidebar-custom-sections .sidebar-section-link-wrapper:nth-child(1)") do
expect(page).to have_css(".sidebar-section-link-sidebar-categories") expect(sidebar).to have_section_link("Sidebar Categories")
end end
within(".sidebar-custom-sections .sidebar-section-link-wrapper:nth-child(2)") do within(".sidebar-custom-sections .sidebar-section-link-wrapper:nth-child(2)") do
expect(page).to have_css(".sidebar-section-link-sidebar-tags") expect(sidebar).to have_section_link("Sidebar Tags")
end end
end end
@ -180,7 +183,7 @@ describe "Custom sidebar sections", type: :system, js: true do
section_modal.save section_modal.save
expect(sidebar).to have_section("Public section") expect(sidebar).to have_section("Public section")
expect(sidebar).to have_link("Sidebar Tags") expect(sidebar).to have_section_link("Sidebar Tags")
expect(page).to have_css(".sidebar-section[data-section-name='public-section'] .d-icon-globe") expect(page).to have_css(".sidebar-section[data-section-name='public-section'] .d-icon-globe")
sidebar.edit_custom_section("Public section") sidebar.edit_custom_section("Public section")
@ -205,8 +208,8 @@ describe "Custom sidebar sections", type: :system, js: true do
visit("/latest") visit("/latest")
expect(sidebar).to have_section("Public section") expect(sidebar).to have_section("Public section")
expect(sidebar).to have_link("Sidebar Tags") expect(sidebar).to have_section_link("Sidebar Tags")
expect(sidebar).to have_link("Sidebar Categories") expect(sidebar).to have_section_link("Sidebar Categories")
end end
it "validates custom section fields" do it "validates custom section fields" do

View File

@ -27,10 +27,22 @@ module PageObjects
).click ).click
end end
def has_link?(name, href: nil) SIDEBAR_SECTION_LINK_SELECTOR = "sidebar-section-link"
def click_section_link(name)
find(".#{SIDEBAR_SECTION_LINK_SELECTOR}", text: name).click
end
def has_one_active_section_link?
has_css?(".#{SIDEBAR_SECTION_LINK_SELECTOR}--active", count: 1)
end
def has_section_link?(name, href: nil, active: false)
attributes = {} attributes = {}
attributes[:href] = href if href attributes[:href] = href if href
page.has_link?(name, attributes) attributes[:class] = SIDEBAR_SECTION_LINK_SELECTOR
attributes[:class] += "--active" if active
has_link?(name, **attributes)
end end
def custom_section_modal_title def custom_section_modal_title

View File

@ -31,10 +31,7 @@ module PageObjects
end end
def click_everything_link def click_everything_link
page.click_link( find(".sidebar-section-link[data-link-name='everything']").click
I18n.t("js.sidebar.sections.community.links.everything.content"),
class: "sidebar-section-link-everything",
)
end end
def click_toggle_to_desktop_view_button def click_toggle_to_desktop_view_button