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

DEV: Switch to data attributes to represent sidebar section name (#20771) 

Data attributes are less restrictive than the class attribute.
This commit is contained in:
Alan Guo Xiang Tan 2023-03-23 13:09:45 +08:00 committed by GitHub
parent d87e78616d
commit 2d46824a87
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
15 changed files with 455 additions and 244 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/assets/javascripts/discourse/app/components/sidebar/section.hbs
View File

@ -1,9 +1,7 @@
{{#if this.displaySection}} {{#if this.displaySection}}
<div <div
class={{concat-class class={{concat "sidebar-section-wrapper sidebar-section" @class}}
(concat "sidebar-section-wrapper sidebar-section-" @sectionName) data-section-name={{@sectionName}}
@class
}}
> >
<div class="sidebar-section-header-wrapper sidebar-row"> <div class="sidebar-section-header-wrapper sidebar-row">
<Sidebar::SectionHeader <Sidebar::SectionHeader

8
app/assets/javascripts/discourse/tests/acceptance/sidebar-anonymous-categories-section-test.js
View File

@ -18,7 +18,7 @@ acceptance("Sidebar - Anonymous - Categories Section", function (needs) {
await visit("/"); await visit("/");
const categorySectionLinks = queryAll( const categorySectionLinks = queryAll(
".sidebar-section-categories .sidebar-section-link-wrapper" ".sidebar-section[data-section-name='categories'] .sidebar-section-link-wrapper"
); );
const sidebarCategories = Site.current() const sidebarCategories = Site.current()
@ -64,7 +64,7 @@ acceptance("Sidebar - Anonymous - Categories Section", function (needs) {
await visit("/"); await visit("/");
const categories = queryAll( const categories = queryAll(
".sidebar-section-categories .sidebar-section-link-wrapper" ".sidebar-section[data-section-name='categories'] .sidebar-section-link-wrapper"
); );
const siteCategories = Site.current().categories; const siteCategories = Site.current().categories;
@ -109,7 +109,7 @@ acceptance("Sidebar - Anonymous - Categories Section", function (needs) {
await visit("/"); await visit("/");
const categories = queryAll( const categories = queryAll(
".sidebar-section-categories .sidebar-section-link-wrapper" ".sidebar-section[data-section-name='categories'] .sidebar-section-link-wrapper"
); );
assert.strictEqual(categories.length, 4); assert.strictEqual(categories.length, 4);
@ -138,7 +138,7 @@ acceptance("Sidebar - Anonymous - Categories Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
`.sidebar-section-categories .sidebar-section-link-${firstCategory.slug}` `.sidebar-section[data-section-name='categories'] .sidebar-section-link-${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"
); );

12
app/assets/javascripts/discourse/tests/acceptance/sidebar-anonymous-community-section-test.js
View File

@ -24,14 +24,14 @@ acceptance("Sidebar - Anonymous user - Community Section", function (needs) {
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-community .sidebar-section-message" ".sidebar-section[data-section-name='community'] .sidebar-section-message"
).textContent.trim(), ).textContent.trim(),
this.siteSettings.short_site_description, this.siteSettings.short_site_description,
"displays the short site description under the community section" "displays the short site description under the community section"
); );
const sectionLinks = queryAll( const sectionLinks = queryAll(
".sidebar-section-community .sidebar-section-link" ".sidebar-section[data-section-name='community'] .sidebar-section-link"
); );
assert.strictEqual( assert.strictEqual(
@ -45,7 +45,7 @@ acceptance("Sidebar - Anonymous user - Community Section", function (needs) {
await visit("/"); await visit("/");
const sectionLinks = queryAll( const sectionLinks = queryAll(
".sidebar-section-community .sidebar-section-link" ".sidebar-section[data-section-name='community'] .sidebar-section-link"
); );
assert.strictEqual( assert.strictEqual(
@ -79,7 +79,9 @@ acceptance("Sidebar - Anonymous user - Community Section", function (needs) {
await visit("/"); await visit("/");
assert.notOk( assert.notOk(
exists(".sidebar-section-community .sidebar-section-link-users"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-users"
),
"users section link is not shown in sidebar" "users section link is not shown in sidebar"
); );
}); });
@ -88,7 +90,7 @@ acceptance("Sidebar - Anonymous user - Community Section", function (needs) {
await visit("/"); await visit("/");
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
const sectionLinks = queryAll( const sectionLinks = queryAll(

14
app/assets/javascripts/discourse/tests/acceptance/sidebar-anonymous-tags-section-test.js
View File

@ -22,7 +22,7 @@ acceptance("Sidebar - Anonymous Tags Section", function (needs) {
await visit("/"); await visit("/");
const categories = queryAll( const categories = queryAll(
".sidebar-section-tags .sidebar-section-link-wrapper" ".sidebar-section[data-section-name='tags'] .sidebar-section-link-wrapper"
); );
assert.strictEqual(categories.length, 4); assert.strictEqual(categories.length, 4);
@ -43,7 +43,7 @@ acceptance("Sidebar - Anonymous Tags Section", function (needs) {
await visit("/"); await visit("/");
const categories = queryAll( const categories = queryAll(
".sidebar-section-tags .sidebar-section-link-wrapper" ".sidebar-section[data-section-name='tags'] .sidebar-section-link-wrapper"
); );
assert.strictEqual(categories.length, 3); assert.strictEqual(categories.length, 3);
assert.strictEqual(categories[0].textContent.trim(), "random"); assert.strictEqual(categories[0].textContent.trim(), "random");
@ -60,7 +60,10 @@ acceptance("Sidebar - Anonymous Tags Section", function (needs) {
await visit("/"); await visit("/");
assert.ok(!exists(".sidebar-section-tags"), "section is not visible"); assert.ok(
!exists(".sidebar-section[data-section-name='tags']"),
"section is not visible"
);
}); });
test("tag section is hidden when anonymous has no visible top tags and site has not default sidebar tags configured", async function (assert) { test("tag section is hidden when anonymous has no visible top tags and site has not default sidebar tags configured", async function (assert) {
@ -73,6 +76,9 @@ acceptance("Sidebar - Anonymous Tags Section", function (needs) {
await visit("/"); await visit("/");
assert.ok(!exists(".sidebar-section-tags"), "section is not visible"); assert.ok(
!exists(".sidebar-section[data-section-name='tags']"),
"section is not visible"
);
}); });
}); });

38
app/assets/javascripts/discourse/tests/acceptance/sidebar-plugin-api-test.js
View File

@ -218,26 +218,26 @@ acceptance("Sidebar - Plugin API", function (needs) {
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-test-chat-channels .sidebar-section-header-text" ".sidebar-section[data-section-name='test-chat-channels'] .sidebar-section-header-text"
).textContent.trim(), ).textContent.trim(),
"chat channels text", "chat channels text",
"displays header with correct text" "displays header with correct text"
); );
await click( await click(
".sidebar-section-test-chat-channels .sidebar-section-header-dropdown summary" ".sidebar-section[data-section-name='test-chat-channels'] .sidebar-section-header-dropdown summary"
); );
assert.strictEqual( assert.strictEqual(
queryAll( queryAll(
".sidebar-section-test-chat-channels .sidebar-section-header-dropdown .select-kit-collection li" ".sidebar-section[data-section-name='test-chat-channels'] .sidebar-section-header-dropdown .select-kit-collection li"
).length, ).length,
2, 2,
"displays two actions" "displays two actions"
); );
const actions = queryAll( const actions = queryAll(
".sidebar-section-test-chat-channels .sidebar-section-header-dropdown .select-kit-collection li" ".sidebar-section[data-section-name='test-chat-channels'] .sidebar-section-header-dropdown .select-kit-collection li"
); );
assert.strictEqual( assert.strictEqual(
@ -253,7 +253,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
); );
const links = queryAll( const links = queryAll(
".sidebar-section-test-chat-channels .sidebar-section-link" ".sidebar-section[data-section-name='test-chat-channels'] .sidebar-section-link"
); );
assert.strictEqual( assert.strictEqual(
@ -402,7 +402,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-test-chat-channels .sidebar-section-header-text" ".sidebar-section[data-section-name='test-chat-channels'] .sidebar-section-header-text"
).textContent.trim(), ).textContent.trim(),
"chat channels text", "chat channels text",
"displays header with correct text" "displays header with correct text"
@ -414,7 +414,9 @@ acceptance("Sidebar - Plugin API", function (needs) {
); );
assert.ok( assert.ok(
!exists(".sidebar-section-test-chat-channels .sidebar-section-content a"), !exists(
".sidebar-section[data-section-name='test-chat-channels'] .sidebar-section-content a"
),
"displays no links" "displays no links"
); );
}); });
@ -433,11 +435,11 @@ acceptance("Sidebar - Plugin API", function (needs) {
await visit("/"); await visit("/");
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
const myCustomTopSectionLink = query( const myCustomTopSectionLink = query(
".sidebar-section-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-my-custom-top"
); );
assert.ok( assert.ok(
@ -499,7 +501,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
await visit("/"); await visit("/");
const customLatestSectionLink = query( const customLatestSectionLink = query(
".sidebar-section-community .sidebar-section-link-latest" ".sidebar-section[data-section-name='community'] .sidebar-section-link-latest"
); );
assert.ok( assert.ok(
@ -519,11 +521,11 @@ acceptance("Sidebar - Plugin API", function (needs) {
); );
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
const customUnreadSectionLink = query( const customUnreadSectionLink = query(
".sidebar-section-community .sidebar-section-link-my-unreads" ".sidebar-section[data-section-name='community'] .sidebar-section-link-my-unreads"
); );
assert.ok( assert.ok(
@ -543,7 +545,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
); );
const customTopSectionLInk = query( const customTopSectionLInk = query(
".sidebar-section-community .sidebar-section-link-my-custom-top" ".sidebar-section[data-section-name='community'] .sidebar-section-link-my-custom-top"
); );
assert.ok( assert.ok(
@ -552,7 +554,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
); );
const openBugsSectionLink = query( const openBugsSectionLink = query(
".sidebar-section-community .sidebar-section-link-open-bugs" ".sidebar-section[data-section-name='community'] .sidebar-section-link-open-bugs"
); );
assert.ok( assert.ok(
@ -567,14 +569,14 @@ acceptance("Sidebar - Plugin API", function (needs) {
// close more links // close more links
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
await visit("/t/internationalization-localization/280"); await visit("/t/internationalization-localization/280");
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-section-link-my-favourite-topic.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
); );
@ -583,7 +585,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section-community .sidebar-section-link-my-favourite-topic.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link-my-favourite-topic.active"
), ),
"does not display my favourite topic custom section link when current route does not match the link's route" "does not display my favourite topic custom section link when current route does not match the link's route"
); );
@ -629,7 +631,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
await visit("/"); await visit("/");
assert.notOk( assert.notOk(
exists(".sidebar-section-test-chat-channels"), exists(".sidebar-section[data-section-name='test-chat-channels']"),
"does not display the section" "does not display the section"
); );
}); });

70
app/assets/javascripts/discourse/tests/acceptance/sidebar-user-categories-section-test.js
View File

@ -43,7 +43,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
count( count(
".sidebar-section-categories .sidebar-section-link:not(.sidebar-section-link-all-categories)" ".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link-all-categories)"
), ),
1, 1,
"there should only be one section link under the section" "there should only be one section link under the section"
@ -113,10 +113,14 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
setupUserSidebarCategories(); setupUserSidebarCategories();
await visit("/t/280"); await visit("/t/280");
await click(".sidebar-section-categories .sidebar-section-header"); await click(
".sidebar-section[data-section-name='categories'] .sidebar-section-header"
);
assert.notOk( assert.notOk(
exists(".sidebar-section-categories .sidebar-section-content"), exists(
".sidebar-section[data-section-name='categories'] .sidebar-section-content"
),
"hides the content of the section" "hides the content of the section"
); );
}); });
@ -125,7 +129,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
setupUserSidebarCategories(); setupUserSidebarCategories();
await visit("/"); await visit("/");
await click(".sidebar-section-categories .sidebar-section-header-button"); await click(
".sidebar-section[data-section-name='categories'] .sidebar-section-header-button"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -140,7 +146,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit("/"); await visit("/");
assert.notOk( assert.notOk(
exists(".sidebar-section-categories"), exists(".sidebar-section[data-section-name='categories']"),
"categories section is not shown" "categories section is not shown"
); );
}); });
@ -153,19 +159,19 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit("/"); await visit("/");
assert.ok( assert.ok(
exists(".sidebar-section-categories"), exists(".sidebar-section[data-section-name='categories']"),
"categories section is shown" "categories section is shown"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-categories .sidebar-section-link-configure-categories" ".sidebar-section[data-section-name='categories'] .sidebar-section-link-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-categories .sidebar-section-link-configure-categories" ".sidebar-section[data-section-name='categories'] .sidebar-section-link-configure-categories"
); );
assert.strictEqual( assert.strictEqual(
@ -237,7 +243,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit("/"); await visit("/");
const categorySectionLinks = queryAll( const categorySectionLinks = queryAll(
".sidebar-section-categories .sidebar-section-link:not(.sidebar-section-link-all-categories)" ".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link-all-categories)"
); );
const categoryNames = [...categorySectionLinks].map((categorySectionLink) => const categoryNames = [...categorySectionLinks].map((categorySectionLink) =>
@ -300,7 +306,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit("/"); await visit("/");
const categorySectionLinks = queryAll( const categorySectionLinks = queryAll(
".sidebar-section-categories .sidebar-section-link:not(.sidebar-section-link-all-categories)" ".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link-all-categories)"
); );
const categoryNames = [...categorySectionLinks].map((categorySectionLink) => const categoryNames = [...categorySectionLinks].map((categorySectionLink) =>
@ -363,7 +369,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit("/"); await visit("/");
const categorySectionLinks = queryAll( const categorySectionLinks = queryAll(
".sidebar-section-categories .sidebar-section-link:not(.sidebar-section-link-all-categories)" ".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link-all-categories)"
); );
const categoryNames = [...categorySectionLinks].map((categorySectionLink) => const categoryNames = [...categorySectionLinks].map((categorySectionLink) =>
@ -391,7 +397,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.strictEqual( assert.strictEqual(
count( count(
".sidebar-section-categories .sidebar-section-link:not(.sidebar-section-link-all-categories)" ".sidebar-section[data-section-name='categories'] .sidebar-section-link:not(.sidebar-section-link-all-categories)"
), ),
4, 4,
"there should only be 4 section link under the section" "there should only be 4 section link under the section"
@ -421,7 +427,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-categories .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='categories'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -442,7 +450,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-categories .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='categories'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -486,7 +496,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-categories .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='categories'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -526,7 +538,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-categories .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='categories'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -574,7 +588,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-categories .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='categories'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -626,7 +642,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit(`/c/${category1.slug}/${category1.id}/l/new`); await visit(`/c/${category1.slug}/${category1.id}/l/new`);
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-categories .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='categories'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -645,7 +663,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit(`/c/${category1.slug}/${category1.id}/l/unread`); await visit(`/c/${category1.slug}/${category1.id}/l/unread`);
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-categories .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='categories'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -664,7 +684,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit(`/c/${category1.slug}/${category1.id}/l/top`); await visit(`/c/${category1.slug}/${category1.id}/l/top`);
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-categories .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='categories'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -683,7 +705,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit(`/c/${category1.slug}/${category1.id}/none`); await visit(`/c/${category1.slug}/${category1.id}/none`);
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-categories .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='categories'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -702,7 +726,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit(`/c/${category1.slug}/${category1.id}/all`); await visit(`/c/${category1.slug}/${category1.id}/all`);
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-categories .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='categories'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );

274
app/assets/javascripts/discourse/tests/acceptance/sidebar-user-community-section-test.js
View File

@ -47,14 +47,18 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
test("clicking on section header button", async function (assert) { test("clicking on section header button", async function (assert) {
await visit("/"); await visit("/");
await click(".sidebar-section-community .sidebar-section-header-button"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-header-button"
);
assert.ok(exists("#reply-control"), "it opens the composer"); assert.ok(exists("#reply-control"), "it opens the composer");
}); });
test("clicking on section header button while viewing a category", async function (assert) { test("clicking on section header button while viewing a category", async function (assert) {
await visit("/c/bug"); await visit("/c/bug");
await click(".sidebar-section-community .sidebar-section-header-button"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-header-button"
);
assert.ok(exists("#reply-control"), "it opens the composer"); assert.ok(exists("#reply-control"), "it opens the composer");
@ -69,27 +73,39 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/t/280"); await visit("/t/280");
assert.ok( assert.ok(
exists(".sidebar-section-community .sidebar-section-content"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-content"
),
"shows content section" "shows content section"
); );
assert.strictEqual( assert.strictEqual(
query(".sidebar-section-community .sidebar-section-header").title, query(
".sidebar-section[data-section-name='community'] .sidebar-section-header"
).title,
I18n.t("sidebar.toggle_section"), I18n.t("sidebar.toggle_section"),
"caret has the right title" "caret has the right title"
); );
await click(".sidebar-section-community .sidebar-section-header"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-header"
);
assert.notOk( assert.notOk(
exists(".sidebar-section-community .sidebar-section-content"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-content"
),
"hides the content of the section" "hides the content of the section"
); );
await click(".sidebar-section-community .sidebar-section-header"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-header"
);
assert.ok( assert.ok(
exists(".sidebar-section-community .sidebar-section-content"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-content"
),
"shows content section" "shows content section"
); );
}); });
@ -99,36 +115,36 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-more-section-links-details-content" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-content"
), ),
"additional section links are displayed" "additional section links are displayed"
); );
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section-community .sidebar-more-section-links-details-content" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-content"
), ),
"additional section links are hidden" "additional section links are hidden"
); );
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
await click("#main-outlet"); await click("#main-outlet");
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section-community .sidebar-more-section-links-details-content" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-content"
), ),
"additional section links are hidden when clicking outside" "additional section links are hidden when clicking outside"
); );
@ -136,7 +152,9 @@ 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(".sidebar-section-community .sidebar-section-link-everything"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -145,14 +163,16 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-community .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='community'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -164,7 +184,9 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
}); });
await visit("/t/280"); await visit("/t/280");
await click(".sidebar-section-community .sidebar-section-link-everything"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
"/latest", "/latest",
@ -172,14 +194,16 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-community .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='community'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -200,7 +224,9 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
sidebar_list_destination: "unread_new", sidebar_list_destination: "unread_new",
}); });
await visit("/t/280"); await visit("/t/280");
await click(".sidebar-section-community .sidebar-section-link-everything"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -209,14 +235,16 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-community .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='community'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -245,7 +273,9 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
sidebar_list_destination: "unread_new", sidebar_list_destination: "unread_new",
}); });
await visit("/t/280"); await visit("/t/280");
await click(".sidebar-section-community .sidebar-section-link-everything"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-everything"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -254,14 +284,16 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-community .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='community'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -271,15 +303,19 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/t/280"); await visit("/t/280");
assert.notOk( assert.notOk(
exists(".sidebar-section-community .sidebar-section-link-users"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
); );
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
await click(".sidebar-section-community .sidebar-section-link-users"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-users"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -288,19 +324,23 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-community .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='community'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
assert.ok( assert.ok(
exists(".sidebar-section-community .sidebar-section-link-users.active"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-users.active"
),
"the users link is marked as active" "the users link is marked as active"
); );
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
).textContent.trim(), ).textContent.trim(),
I18n.t("sidebar.more"), I18n.t("sidebar.more"),
"displays the right count as users link is currently active" "displays the right count as users link is currently active"
@ -309,7 +349,9 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/u"); await visit("/u");
assert.ok( assert.ok(
exists(".sidebar-section-community .sidebar-section-link-users.active"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
); );
}); });
@ -320,11 +362,13 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
assert.notOk( assert.notOk(
exists(".sidebar-section-community .sidebar-section-link-users"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-users"
),
"users section link is not displayed in sidebar" "users section link is not displayed in sidebar"
); );
}); });
@ -333,10 +377,12 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
await click(".sidebar-section-community .sidebar-section-link-badges"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-badges"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -351,11 +397,13 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
assert.notOk( assert.notOk(
exists(".sidebar-section-community .sidebar-section-link-badges"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-badges"
),
"badges section link is not shown in sidebar" "badges section link is not shown in sidebar"
); );
}); });
@ -364,15 +412,19 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/t/280"); await visit("/t/280");
assert.notOk( assert.notOk(
exists(".sidebar-section-community .sidebar-section-link-groups"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
); );
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
await click(".sidebar-section-community .sidebar-section-link-groups"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-groups"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -381,19 +433,23 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-community .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='community'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
assert.ok( assert.ok(
exists(".sidebar-section-community .sidebar-section-link-groups.active"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-groups.active"
),
"the groups link is marked as active" "the groups link is marked as active"
); );
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
).textContent.trim(), ).textContent.trim(),
I18n.t("sidebar.more"), I18n.t("sidebar.more"),
"displays the right count as groups link is currently active" "displays the right count as groups link is currently active"
@ -402,7 +458,9 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/g"); await visit("/g");
assert.ok( assert.ok(
exists(".sidebar-section-community .sidebar-section-link-groups.active"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
); );
}); });
@ -413,11 +471,13 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
assert.notOk( assert.notOk(
exists(".sidebar-section-community .sidebar-section-link-groups"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-groups"
),
"groups section link is not shown in sidebar" "groups section link is not shown in sidebar"
); );
}); });
@ -426,10 +486,12 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
await click(".sidebar-section-community .sidebar-section-link-about"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-about"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -438,7 +500,9 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
assert.ok( assert.ok(
exists(".sidebar-section-community .sidebar-section-link-about.active"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
); );
}); });
@ -447,10 +511,12 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
await click(".sidebar-section-community .sidebar-section-link-faq"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-faq"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -465,11 +531,13 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
assert.strictEqual( assert.strictEqual(
query(".sidebar-section-community .sidebar-section-link-faq").href, query(
".sidebar-section[data-section-name='community'] .sidebar-section-link-faq"
).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"
); );
@ -477,7 +545,9 @@ 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(".sidebar-section-community .sidebar-section-link-admin"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-admin"
);
assert.strictEqual(currentRouteName(), "admin.dashboard.general"); assert.strictEqual(currentRouteName(), "admin.dashboard.general");
}); });
@ -488,13 +558,17 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
assert.notOk( assert.notOk(
exists(".sidebar-section-community .sidebar-section-link-admin") exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-admin"
)
); );
}); });
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(".sidebar-section-community .sidebar-section-link-my-posts"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-my-posts"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -503,14 +577,16 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-community .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='community'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-section-link-my-posts.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link-my-posts.active"
), ),
"the my posts link is marked as active" "the my posts link is marked as active"
); );
@ -519,7 +595,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section-community .sidebar-section-link-my-posts.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
); );
@ -532,7 +608,9 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
draft_count: 1, draft_count: 1,
}); });
await click(".sidebar-section-community .sidebar-section-link-my-posts"); await click(
".sidebar-section[data-section-name='community'] .sidebar-section-link-my-posts"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -541,14 +619,16 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-community .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='community'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-section-link-my-posts.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link-my-posts.active"
), ),
"the my posts link is marked as active" "the my posts link is marked as active"
); );
@ -557,7 +637,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-section-link-my-posts.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link-my-posts.active"
), ),
"the my posts link is marked as active" "the my posts link is marked as active"
); );
@ -620,14 +700,16 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/top"); await visit("/top");
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-community .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='community'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -637,14 +719,16 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/unread"); await visit("/unread");
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-community .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='community'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -654,14 +738,16 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/new"); await visit("/new");
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-community .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='community'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-section-link-everything.active" ".sidebar-section[data-section-name='community'] .sidebar-section-link-everything.active"
), ),
"the everything link is marked as active" "the everything link is marked as active"
); );
@ -866,16 +952,20 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
assert.notOk( assert.notOk(
exists(".sidebar-section-community .sidebar-section-link-review"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-review"
),
"review link is not shown" "review link is not shown"
); );
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
assert.notOk( assert.notOk(
exists(".sidebar-section-community .sidebar-section-link-review"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-review"
),
"review link is not shown" "review link is not shown"
); );
}); });
@ -889,24 +979,28 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/reivew"); await visit("/reivew");
assert.notOk( assert.notOk(
exists(".sidebar-section-community .sidebar-section-link-review.active"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
); );
await visit("/"); await visit("/");
assert.notOk( assert.notOk(
exists(".sidebar-section-community .sidebar-section-link-review"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
); );
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-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-review"
), ),
"review link is displayed in the more drawer" "review link is displayed in the more drawer"
); );
@ -916,25 +1010,27 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
}); });
assert.ok( assert.ok(
exists(".sidebar-section-community .sidebar-section-link-review"), exists(
".sidebar-section[data-section-name='community'] .sidebar-section-link-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-community .sidebar-section-link-review .sidebar-section-link-content-badge" ".sidebar-section[data-section-name='community'] .sidebar-section-link-review .sidebar-section-link-content-badge"
).textContent.trim(), ).textContent.trim(),
"34 pending", "34 pending",
"displays the pending reviewable count" "displays the pending reviewable count"
); );
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
assert.notOk( assert.notOk(
exists( exists(
".sidebar-section-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-review"
), ),
"review link is not displayed in the more drawer" "review link is not displayed in the more drawer"
); );
@ -953,7 +1049,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
await click( await click(
".sidebar-section-community .sidebar-more-section-links-details-summary" ".sidebar-section[data-section-name='community'] .sidebar-more-section-links-details-summary"
); );
assert.strictEqual( assert.strictEqual(
@ -1009,7 +1105,7 @@ acceptance("Sidebar - Logged on user - Community Section", function (needs) {
await visit("/"); await visit("/");
await click( await click(
".sidebar-section-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-user-summary");
@ -1087,7 +1183,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-community .sidebar-section-link-everything .sidebar-section-link-content-badge" ".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
@ -1122,7 +1218,7 @@ acceptance(
assert.true( assert.true(
query( query(
".sidebar-section-community .sidebar-section-link-everything" ".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
); );
@ -1138,7 +1234,7 @@ acceptance(
assert.true( assert.true(
query( query(
".sidebar-section-community .sidebar-section-link-everything" ".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
); );
@ -1154,7 +1250,7 @@ acceptance(
assert.true( assert.true(
query( query(
".sidebar-section-community .sidebar-section-link-everything" ".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
); );
@ -1170,7 +1266,7 @@ acceptance(
assert.true( assert.true(
query( query(
".sidebar-section-community .sidebar-section-link-everything" ".sidebar-section[data-section-name='community'] .sidebar-section-link-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"
); );

112
app/assets/javascripts/discourse/tests/acceptance/sidebar-user-messages-section-test.js
View File

@ -29,7 +29,7 @@ acceptance(
await visit("/"); await visit("/");
assert.ok( assert.ok(
!exists(".sidebar-section-messages"), !exists(".sidebar-section[data-section-name='messages']"),
"does not display messages section in sidebar" "does not display messages section in sidebar"
); );
}); });
@ -74,7 +74,9 @@ acceptance(
test("clicking on section header button", async function (assert) { test("clicking on section header button", async function (assert) {
await visit("/"); await visit("/");
await click(".sidebar-section-messages .sidebar-section-header-button"); await click(
".sidebar-section[data-section-name='messages'] .sidebar-section-header-button"
);
assert.ok( assert.ok(
exists("#reply-control.private-message"), exists("#reply-control.private-message"),
@ -84,10 +86,14 @@ acceptance(
test("clicking on section header link", async function (assert) { test("clicking on section header link", async function (assert) {
await visit("/"); await visit("/");
await click(".sidebar-section-messages .sidebar-section-header"); await click(
".sidebar-section[data-section-name='messages'] .sidebar-section-header"
);
assert.notOk( assert.notOk(
exists(".sidebar-section-messages .sidebar-section-content"), exists(
".sidebar-section[data-section-name='messages'] .sidebar-section-content"
),
"hides the content of the section" "hides the content of the section"
); );
}); });
@ -97,30 +103,34 @@ acceptance(
assert.ok( assert.ok(
exists( exists(
".sidebar-section-messages .sidebar-section-link-personal-messages-inbox" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-inbox"
), ),
"displays the personal message inbox link" "displays the personal message inbox link"
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-messages .sidebar-section-link"), count(
".sidebar-section[data-section-name='messages'] .sidebar-section-link"
),
1, 1,
"only displays the personal message inbox link" "only displays the personal message inbox link"
); );
await click( await click(
".sidebar-section-messages .sidebar-section-link-personal-messages-inbox" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-inbox"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-messages .sidebar-section-link-personal-messages-inbox.active" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-inbox.active"
), ),
"personal message inbox link is marked as active" "personal message inbox link is marked as active"
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-messages .sidebar-section-link"), count(
".sidebar-section[data-section-name='messages'] .sidebar-section-link"
),
5, 5,
"expands and displays the links for personal messages" "expands and displays the links for personal messages"
); );
@ -131,11 +141,11 @@ acceptance(
await visit("/"); await visit("/");
await click( await click(
".sidebar-section-messages .sidebar-section-link-personal-messages-inbox" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-inbox"
); );
await click( await click(
`.sidebar-section-messages .sidebar-section-link-personal-messages-${type}` `.sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-${type}`
); );
assert.strictEqual( assert.strictEqual(
@ -145,28 +155,30 @@ acceptance(
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-messages .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='messages'] .sidebar-section-link.active"
),
2, 2,
"only two links are marked as active in the sidebar" "only two links are marked as active in the sidebar"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-messages .sidebar-section-link-personal-messages-inbox.active" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-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-messages .sidebar-section-link-personal-messages-${type}.active` `.sidebar-section[data-section-name='messages'] .sidebar-section-link-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-messages .sidebar-section-link-personal-messages-${type} .sidebar-section-link-prefix` `.sidebar-section[data-section-name='messages'] .sidebar-section-link-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`
); );
@ -194,7 +206,7 @@ acceptance(
await visit("/"); await visit("/");
const groupSectionLinks = queryAll( const groupSectionLinks = queryAll(
".sidebar-section-messages .sidebar-section-link" ".sidebar-section[data-section-name='messages'] .sidebar-section-link"
); );
assert.deepEqual( assert.deepEqual(
@ -208,29 +220,37 @@ acceptance(
await visit("/u/eviltrout/messages/group/GrOuP1"); await visit("/u/eviltrout/messages/group/GrOuP1");
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-messages .sidebar-section-link"), count(
".sidebar-section[data-section-name='messages'] .sidebar-section-link"
),
6, 6,
"expands and displays the links for group1 group messages" "expands and displays the links for group1 group messages"
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-messages .sidebar-section-link.group1"), count(
".sidebar-section[data-section-name='messages'] .sidebar-section-link.group1"
),
4, 4,
"expands the links for group1 group messages" "expands the links for group1 group messages"
); );
await click( await click(
".sidebar-section-messages .sidebar-section-link-group-messages-inbox.group3" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-inbox.group3"
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-messages .sidebar-section-link.group1"), count(
".sidebar-section[data-section-name='messages'] .sidebar-section-link.group1"
),
1, 1,
"collapses the links for group1 group messages" "collapses the links for group1 group messages"
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-messages .sidebar-section-link.group3"), count(
".sidebar-section[data-section-name='messages'] .sidebar-section-link.group3"
),
4, 4,
"expands the links for group3 group messages" "expands the links for group3 group messages"
); );
@ -258,11 +278,11 @@ acceptance(
await visit("/"); await visit("/");
await click( await click(
`.sidebar-section-messages .sidebar-section-link-group-messages-inbox.group1` `.sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-inbox.group1`
); );
await click( await click(
`.sidebar-section-messages .sidebar-section-link-group-messages-${type}.group1` `.sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-${type}.group1`
); );
assert.strictEqual( assert.strictEqual(
@ -272,21 +292,23 @@ acceptance(
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-messages .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='messages'] .sidebar-section-link.active"
),
2, 2,
"only two links are marked as active in the sidebar" "only two links are marked as active in the sidebar"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-messages .sidebar-section-link-group-messages-inbox.group1.active" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-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-messages .sidebar-section-link-group-messages-${type}.group1.active` `.sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-${type}.group1.active`
), ),
`group1 group message ${type} link is marked as active` `group1 group message ${type} link is marked as active`
); );
@ -306,21 +328,25 @@ acceptance(
await visit("/t/130"); await visit("/t/130");
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-messages .sidebar-section-link"), count(
".sidebar-section[data-section-name='messages'] .sidebar-section-link"
),
5, 5,
"5 section links are displayed" "5 section links are displayed"
); );
assert.strictEqual( assert.strictEqual(
count( count(
".sidebar-section-messages .sidebar-section-link.personal-messages" ".sidebar-section[data-section-name='messages'] .sidebar-section-link.personal-messages"
), ),
1, 1,
"personal messages inbox filter links are not shown" "personal messages inbox filter links are not shown"
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-messages .sidebar-section-link.foo_group"), count(
".sidebar-section[data-section-name='messages'] .sidebar-section-link.foo_group"
),
4, 4,
"foo_group messages inbox filter links are shown" "foo_group messages inbox filter links are shown"
); );
@ -339,21 +365,25 @@ acceptance(
await visit("/t/34"); await visit("/t/34");
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-messages .sidebar-section-link"), count(
".sidebar-section[data-section-name='messages'] .sidebar-section-link"
),
6, 6,
"6 section links are displayed" "6 section links are displayed"
); );
assert.strictEqual( assert.strictEqual(
count( count(
".sidebar-section-messages .sidebar-section-link.personal-messages" ".sidebar-section[data-section-name='messages'] .sidebar-section-link.personal-messages"
), ),
5, 5,
"personal messages inbox filter links are shown" "personal messages inbox filter links are shown"
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-messages .sidebar-section-link.foo_group"), count(
".sidebar-section[data-section-name='messages'] .sidebar-section-link.foo_group"
),
1, 1,
"foo_group messages inbox filter links are not shown" "foo_group messages inbox filter links are not shown"
); );
@ -377,7 +407,7 @@ acceptance(
); );
await click( await click(
".sidebar-section-messages .sidebar-section-link-group-messages-inbox.group1" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-group-messages-inbox.group1"
); );
await publishToMessageBus(pmTopicTrackingState.groupChannel(1), { await publishToMessageBus(pmTopicTrackingState.groupChannel(1), {
@ -404,7 +434,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-messages .sidebar-section-link-group-messages-unread.group1" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-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,
@ -414,7 +444,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-messages .sidebar-section-link-group-messages-new.group1" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-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,
@ -435,7 +465,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-messages .sidebar-section-link-group-messages-new.group1" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-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"
@ -450,7 +480,7 @@ acceptance(
); );
await click( await click(
".sidebar-section-messages .sidebar-section-link-personal-messages-inbox" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-personal-messages-inbox"
); );
await publishToMessageBus(pmTopicTrackingState.userChannel(), { await publishToMessageBus(pmTopicTrackingState.userChannel(), {
@ -466,7 +496,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-messages .sidebar-section-link-personal-messages-unread" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-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,
@ -487,7 +517,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-messages .sidebar-section-link-personal-messages-unread" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-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,
@ -508,7 +538,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-messages .sidebar-section-link-personal-messages-new" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-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,
@ -529,7 +559,7 @@ acceptance(
assert.strictEqual( assert.strictEqual(
query( query(
".sidebar-section-messages .sidebar-section-link-personal-messages-new" ".sidebar-section[data-section-name='messages'] .sidebar-section-link-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"

63
app/assets/javascripts/discourse/tests/acceptance/sidebar-user-tags-section-test.js
View File

@ -28,7 +28,7 @@ acceptance(
await visit("/"); await visit("/");
assert.ok( assert.ok(
!exists(".sidebar-section-tags"), !exists(".sidebar-section[data-section-name='tags']"),
"does not display the tags section" "does not display the tags section"
); );
}); });
@ -97,14 +97,16 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
await visit("/"); await visit("/");
assert.notOk( assert.notOk(
exists(".sidebar-section-tags"), exists(".sidebar-section[data-section-name='tags']"),
"tags section is not displayed" "tags section is not displayed"
); );
}); });
test("clicking on section header button", async function (assert) { test("clicking on section header button", async function (assert) {
await visit("/"); await visit("/");
await click(".sidebar-section-tags .sidebar-section-header-button"); await click(
".sidebar-section[data-section-name='tags'] .sidebar-section-header-button"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -121,7 +123,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
await visit("/"); await visit("/");
assert.notOk( assert.notOk(
exists(".sidebar-section-tags"), exists(".sidebar-section[data-section-name='tags']"),
"tags section is not displayed" "tags section is not displayed"
); );
}); });
@ -135,14 +137,21 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
await visit("/"); await visit("/");
assert.ok(exists(".sidebar-section-tags"), "tags section is shown"); assert.ok(
exists(".sidebar-section[data-section-name='tags']"),
"tags section is shown"
);
assert.ok( assert.ok(
exists(".sidebar-section-tags .sidebar-section-link-configure-tags"), exists(
".sidebar-section[data-section-name='tags'] .sidebar-section-link-configure-tags"
),
"section link to add tags to sidebar is displayed" "section link to add tags to sidebar is displayed"
); );
await click(".sidebar-section-tags .sidebar-section-link-configure-tags"); await click(
".sidebar-section[data-section-name='tags'] .sidebar-section-link-configure-tags"
);
assert.strictEqual( assert.strictEqual(
currentURL(), currentURL(),
@ -155,7 +164,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
await visit("/"); await visit("/");
const tagSectionLinks = queryAll( const tagSectionLinks = queryAll(
".sidebar-section-tags .sidebar-section-link:not(.sidebar-section-link-all-tags)" ".sidebar-section[data-section-name='tags'] .sidebar-section-link:not(.sidebar-section-link-all-tags)"
); );
const tagNames = [...tagSectionLinks].map((tagSectionLink) => const tagNames = [...tagSectionLinks].map((tagSectionLink) =>
@ -174,7 +183,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
assert.strictEqual( assert.strictEqual(
count( count(
".sidebar-section-tags .sidebar-section-link:not(.sidebar-section-link-all-tags)" ".sidebar-section[data-section-name='tags'] .sidebar-section-link:not(.sidebar-section-link-all-tags)"
), ),
4, 4,
"4 section links under the section" "4 section links under the section"
@ -207,7 +216,9 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-tags .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='tags'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -226,7 +237,9 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-tags .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='tags'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -252,7 +265,9 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-tags .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='tags'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -292,7 +307,9 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-tags .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='tags'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -332,7 +349,9 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-tags .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='tags'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -355,7 +374,9 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
); );
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-tags .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='tags'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -370,7 +391,9 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
await visit(`/tag/tag1/l/top`); await visit(`/tag/tag1/l/top`);
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-tags .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='tags'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -385,7 +408,9 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
await visit(`/tag/tag1/l/new`); await visit(`/tag/tag1/l/new`);
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-tags .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='tags'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );
@ -400,7 +425,9 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
await visit(`/tag/tag1/l/unread`); await visit(`/tag/tag1/l/unread`);
assert.strictEqual( assert.strictEqual(
count(".sidebar-section-tags .sidebar-section-link.active"), count(
".sidebar-section[data-section-name='tags'] .sidebar-section-link.active"
),
1, 1,
"only one link is marked as active" "only one link is marked as active"
); );

4
app/assets/javascripts/discourse/tests/acceptance/sidebar-user-test.js
View File

@ -161,7 +161,7 @@ acceptance(
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-section-header[aria-expanded='true'][aria-controls='sidebar-section-content-community']" ".sidebar-section[data-section-name='community'] .sidebar-section-header[aria-expanded='true'][aria-controls='sidebar-section-content-community']"
), ),
"accessibility attributes are set correctly on sidebar section header when section is expanded" "accessibility attributes are set correctly on sidebar section header when section is expanded"
); );
@ -170,7 +170,7 @@ acceptance(
assert.ok( assert.ok(
exists( exists(
".sidebar-section-community .sidebar-section-header[aria-expanded='false'][aria-controls='sidebar-section-content-community']" ".sidebar-section[data-section-name='community'] .sidebar-section-header[aria-expanded='false'][aria-controls='sidebar-section-content-community']"
), ),
"accessibility attributes are set correctly on sidebar section header when section is collapsed" "accessibility attributes are set correctly on sidebar section header when section is collapsed"
); );

44
app/assets/javascripts/discourse/tests/acceptance/user-preferences-sidebar-test.js
View File

@ -67,12 +67,14 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section-categories .sidebar-section-link[data-category-id=6]" ".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=6]"
), ),
"support category is present in sidebar" "support category is present in sidebar"
); );
await click(".sidebar-section-categories .sidebar-section-header-button"); await click(
".sidebar-section[data-section-name='categories'] .sidebar-section-header-button"
);
const categorySelector = selectKit(".category-selector"); const categorySelector = selectKit(".category-selector");
await categorySelector.expand(); await categorySelector.expand();
@ -93,14 +95,14 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok( assert.ok(
!exists( !exists(
".sidebar-section-categories .sidebar-section-link[data-category-id=10]" ".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=10]"
), ),
"howto category is not displayed in sidebar" "howto category is not displayed in sidebar"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-categories .sidebar-section-link[data-category-id=6]" ".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=6]"
), ),
"support category is displayed in sidebar" "support category is displayed in sidebar"
); );
@ -109,7 +111,7 @@ acceptance("User Preferences - Sidebar", function (needs) {
test("user adding categories to sidebar when default sidebar categories have not been configured", async function (assert) { test("user adding categories to sidebar when default sidebar categories have not been configured", async function (assert) {
await visit("/u/eviltrout/preferences/sidebar"); await visit("/u/eviltrout/preferences/sidebar");
assert.notOk(exists(".sidebar-section-categories")); assert.notOk(exists(".sidebar-section[data-section-name='categories']"));
const categorySelector = selectKit(".category-selector"); const categorySelector = selectKit(".category-selector");
await categorySelector.expand(); await categorySelector.expand();
@ -120,14 +122,14 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section-categories .sidebar-section-link[data-category-id=6]" ".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=6]"
), ),
"support category has been added to sidebar" "support category has been added to sidebar"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-categories .sidebar-section-link[data-category-id=1]" ".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=1]"
), ),
"bug category has been added to sidebar" "bug category has been added to sidebar"
); );
@ -137,7 +139,9 @@ acceptance("User Preferences - Sidebar", function (needs) {
this.siteSettings.default_sidebar_categories = "5"; this.siteSettings.default_sidebar_categories = "5";
await visit("/"); await visit("/");
await click(".sidebar-section-categories .sidebar-section-header-button"); await click(
".sidebar-section[data-section-name='categories'] .sidebar-section-header-button"
);
const categorySelector = selectKit(".category-selector"); const categorySelector = selectKit(".category-selector");
await categorySelector.expand(); await categorySelector.expand();
@ -148,14 +152,14 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section-categories .sidebar-section-link[data-category-id=6]" ".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=6]"
), ),
"support category has been added to sidebar" "support category has been added to sidebar"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-categories .sidebar-section-link[data-category-id=1]" ".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=1]"
), ),
"bug category has been added to sidebar" "bug category has been added to sidebar"
); );
@ -174,12 +178,14 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section-tags .sidebar-section-link[data-tag-name=monkey]" ".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-tag-name=monkey]"
), ),
"monkey tag is displayed in sidebar" "monkey tag is displayed in sidebar"
); );
await click(".sidebar-section-tags .sidebar-section-header-button"); await click(
".sidebar-section[data-section-name='tags'] .sidebar-section-header-button"
);
const tagChooser = selectKit(".tag-chooser"); const tagChooser = selectKit(".tag-chooser");
await tagChooser.expand(); await tagChooser.expand();
@ -200,14 +206,14 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok( assert.ok(
!exists( !exists(
".sidebar-section-tags .sidebar-section-link[data-tag-name=gazelle]" ".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-tag-name=gazelle]"
), ),
"gazelle tag is not displayed in sidebar" "gazelle tag is not displayed in sidebar"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-tags .sidebar-section-link[data-tag-name=monkey]" ".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-tag-name=monkey]"
), ),
"monkey tag is displayed in sidebar" "monkey tag is displayed in sidebar"
); );
@ -232,7 +238,7 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section-tags .sidebar-section-link[data-tag-name=monkey]" ".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-tag-name=monkey]"
), ),
"monkey tag has been added to sidebar" "monkey tag has been added to sidebar"
); );
@ -242,7 +248,9 @@ acceptance("User Preferences - Sidebar", function (needs) {
this.siteSettings.default_sidebar_tags = "tag1|tag2"; this.siteSettings.default_sidebar_tags = "tag1|tag2";
await visit("/"); await visit("/");
await click(".sidebar-section-tags .sidebar-section-header-button"); await click(
".sidebar-section[data-section-name='tags'] .sidebar-section-header-button"
);
const tagChooser = selectKit(".tag-chooser"); const tagChooser = selectKit(".tag-chooser");
await tagChooser.expand(); await tagChooser.expand();
@ -253,14 +261,14 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok( assert.ok(
exists( exists(
".sidebar-section-tags .sidebar-section-link[data-tag-name=monkey]" ".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-tag-name=monkey]"
), ),
"monkey tag has been added to sidebar" "monkey tag has been added to sidebar"
); );
assert.ok( assert.ok(
exists( exists(
".sidebar-section-tags .sidebar-section-link[data-tag-name=gazelle]" ".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-tag-name=gazelle]"
), ),
"gazelle tag has been added to sidebar" "gazelle tag has been added to sidebar"
); );

20
plugins/chat/spec/system/list_channels/sidebar_spec.rb
View File

@ -22,7 +22,7 @@ RSpec.describe "List channels | sidebar", type: :system, js: true do
end end
it "shows the channel in the correct section" do it "shows the channel in the correct section" do
expect(page.find(".sidebar-section-chat-channels")).to have_content( expect(page.find(".sidebar-section[data-section-name='chat-channels']")).to have_content(
category_channel_1.name, category_channel_1.name,
) )
end end
@ -70,7 +70,9 @@ RSpec.describe "List channels | sidebar", type: :system, js: true do
before { visit("/") } before { visit("/") }
it "shows the channel in the correct section" do it "shows the channel in the correct section" do
expect(page.find(".sidebar-section-chat-dms")).to have_content(current_user.username) expect(page.find(".sidebar-section[data-section-name='chat-dms']")).to have_content(
current_user.username,
)
end end
end end
@ -87,7 +89,7 @@ RSpec.describe "List channels | sidebar", type: :system, js: true do
context "when no category channels" do context "when no category channels" do
it "doesn’t show the section" do it "doesn’t show the section" do
visit("/") visit("/")
expect(page).to have_no_css(".sidebar-section-chat-channels") expect(page).to have_no_css(".sidebar-section[data-section-name='chat-channels']")
end end
context "when user can create channels" do context "when user can create channels" do
@ -95,7 +97,7 @@ RSpec.describe "List channels | sidebar", type: :system, js: true do
it "shows the section" do it "shows the section" do
visit("/") visit("/")
expect(page).to have_css(".sidebar-section-chat-channels") expect(page).to have_css(".sidebar-section[data-section-name='chat-channels']")
end end
end end
end end
@ -104,7 +106,7 @@ RSpec.describe "List channels | sidebar", type: :system, js: true do
before { visit("/") } before { visit("/") }
it "shows the section" do it "shows the section" do
expect(page).to have_css(".sidebar-section-chat-dms") expect(page).to have_css(".sidebar-section[data-section-name='chat-dms']")
end end
end end
@ -115,8 +117,8 @@ RSpec.describe "List channels | sidebar", type: :system, js: true do
end end
it "doesn’t show the sections" do it "doesn’t show the sections" do
expect(page).to have_no_css(".sidebar-section-chat-channels") expect(page).to have_no_css(".sidebar-section[data-section-name='chat-channels']")
expect(page).to have_no_css(".sidebar-section-chat-dms") expect(page).to have_no_css(".sidebar-section[data-section-name='chat-dms']")
end end
end end
@ -128,8 +130,8 @@ RSpec.describe "List channels | sidebar", type: :system, js: true do
end end
it "doesn’t show the sections" do it "doesn’t show the sections" do
expect(page).to have_no_css(".sidebar-section-chat-channels") expect(page).to have_no_css(".sidebar-section[data-section-name='chat-channels']")
expect(page).to have_no_css(".sidebar-section-chat-dms") expect(page).to have_no_css(".sidebar-section[data-section-name='chat-dms']")
end end
end end

14
plugins/chat/spec/system/page_objects/sidebar/sidebar.rb
View File

@ -4,19 +4,25 @@ module PageObjects
module Pages module Pages
class Sidebar < PageObjects::Pages::Base class Sidebar < PageObjects::Pages::Base
def channels_section def channels_section
find(".sidebar-section-chat-channels") find(".sidebar-section[data-section-name='chat-channels']")
end end
def dms_section def dms_section
find(".sidebar-section-chat-dms") find(".sidebar-section[data-section-name='chat-dms']")
end end
def open_draft_channel def open_draft_channel
find(".sidebar-section-chat-dms .sidebar-section-header-button", visible: false).click find(
".sidebar-section[data-section-name='chat-dms'] .sidebar-section-header-button",
visible: false,
).click
end end
def open_browse def open_browse
find(".sidebar-section-chat-channels .sidebar-section-header-button", visible: false).click find(
".sidebar-section[data-section-name='chat-channels'] .sidebar-section-header-button",
visible: false,
).click
end end
def open_channel(channel) def open_channel(channel)

13
spec/system/custom_sidebar_sections_spec.rb
View File

@ -136,11 +136,16 @@ describe "Custom sidebar sections", type: :system, js: true do
visit("/latest") visit("/latest")
expect(page).to have_button("Public section") expect(page).to have_button("Public section")
find(".sidebar-section-public-section").hover
find(".sidebar-section[data-section-name='public-section']").hover
expect(page).not_to have_css( expect(page).not_to have_css(
".sidebar-section-public-section button.sidebar-section-header-button", ".sidebar-section[data-section-name='public-section'] button.sidebar-section-header-button",
)
expect(page).not_to have_css(
".sidebar-section[data-section-name='public-section'] .d-icon-globe",
) )
expect(page).not_to have_css(".sidebar-section-public-section .d-icon-globe")
end end
it "allows the user to delete custom section" do it "allows the user to delete custom section" do
@ -170,7 +175,7 @@ describe "Custom sidebar sections", type: :system, js: true do
expect(page).to have_button("Public section") expect(page).to have_button("Public section")
expect(sidebar).to have_link("Sidebar Tags") expect(sidebar).to have_link("Sidebar Tags")
expect(page).to have_css(".sidebar-section-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")
section_modal.fill_name("Edited public section") section_modal.fill_name("Edited public section")

7
spec/system/page_objects/components/sidebar.rb
View File

@ -20,8 +20,11 @@ module PageObjects
end end
def edit_custom_section(name) def edit_custom_section(name)
find(".sidebar-section-#{name.parameterize}").hover find(".sidebar-section[data-section-name='#{name.parameterize}']").hover
find(".sidebar-section-#{name.parameterize} button.sidebar-section-header-button").click
find(
".sidebar-section[data-section-name='#{name.parameterize}'] button.sidebar-section-header-button",
).click
end end
def has_link?(name, href: nil) def has_link?(name, href: nil)