DEV: add sidebar list-item-name & move attributes (#21730)

This commit is contained in:
Kris 2023-05-25 11:36:44 -04:00 committed by GitHub
parent 442b5538bb
commit b2e13d1fdd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 131 additions and 108 deletions

View File

@ -2,6 +2,8 @@
<li
class="sidebar-section-link-wrapper"
{{did-insert this.didInsert this.args}}
data-list-item-name={{@linkName}}
...attributes
>
{{#if @href}}
<a
@ -11,7 +13,6 @@
class={{this.classNames}}
title={{@title}}
data-link-name={{@linkName}}
...attributes
>
<Sidebar::SectionLinkPrefix
@prefixType={{@prefixType}}
@ -34,7 +35,6 @@
@current-when={{@currentWhen}}
title={{@title}}
data-link-name={{@linkName}}
...attributes
>
<Sidebar::SectionLinkPrefix

View File

@ -692,21 +692,22 @@ acceptance("Sidebar - Plugin API", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"] .sidebar-section-link-suffix.unread`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .sidebar-section-link-suffix.unread`
),
"the right suffix is displayed when custom countable is active"
);
assert.strictEqual(
query(`.sidebar-section-link[data-category-id="${category1.id}"]`)
.pathname,
query(
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a`
).pathname,
`/c/${category1.name}/${category1.id}`,
"does not use route configured for custom countable when user has elected not to show any counts in sidebar"
);
assert.notOk(
exists(
`.sidebar-section-link[data-category-id="${category2.id}"] .sidebar-section-link-suffix.unread`
`.sidebar-section-link-wrapper[data-category-id="${category2.id}"] .sidebar-section-link-suffix.unread`
),
"does not display suffix when custom countable is not registered"
);
@ -717,7 +718,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
assert.strictEqual(
query(
`.sidebar-section-link[data-category-id="${category1.id}"] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .sidebar-section-link-content-badge`
).innerText.trim(),
I18n.t("sidebar.unread_count", { count: 1 }),
"displays the right badge text in section link when unread is present and custom countable is not prioritised over unread"
@ -731,22 +732,24 @@ acceptance("Sidebar - Plugin API", function (needs) {
assert.strictEqual(
query(
`.sidebar-section-link[data-category-id="${category1.id}"] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .sidebar-section-link-content-badge`
).innerText.trim(),
`some custom ${category1.topic_count}`,
"displays the right badge text in section link when unread is present but custom countable is prioritised over unread"
);
assert.strictEqual(
query(`.sidebar-section-link[data-category-id="${category1.id}"]`)
.pathname,
query(
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a`
).pathname,
`/c/${category1.name}/${category1.id}/l/latest`,
"has the right pathname for section link"
);
assert.strictEqual(
query(`.sidebar-section-link[data-category-id="${category1.id}"]`)
.search,
query(
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a`
).search,
"?status=open",
"has the right query params for section link"
);
@ -773,7 +776,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"] .prefix-badge.d-icon-wrench`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .prefix-badge.d-icon-wrench`
),
"wrench icon is displayed for the section link's prefix badge"
);
@ -805,14 +808,14 @@ acceptance("Sidebar - Plugin API", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"] .prefix-icon.d-icon-wrench`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .prefix-icon.d-icon-wrench`
),
"wrench icon is displayed for the section link's prefix icon"
);
assert.strictEqual(
query(
`.sidebar-section-link[data-category-id="${category1.id}"] .sidebar-section-link-prefix`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .sidebar-section-link-prefix`
).style.color,
"rgb(255, 0, 0)",
"section link's prefix icon has the right color"
@ -845,14 +848,14 @@ acceptance("Sidebar - Plugin API", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-tag-name="tag1"] .prefix-icon.d-icon-wrench`
`.sidebar-section-link-wrapper[data-tag-name="tag1"] .prefix-icon.d-icon-wrench`
),
"wrench icon is displayed for tag1 section link's prefix icon"
);
assert.strictEqual(
query(
`.sidebar-section-link[data-tag-name="tag1"] .sidebar-section-link-prefix`
`.sidebar-section-link-wrapper[data-tag-name="tag1"] .sidebar-section-link-prefix`
).style.color,
"rgb(255, 0, 0)",
"tag1 section link's prefix icon has the right color"
@ -860,7 +863,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-tag-name="tag2"] .prefix-icon.d-icon-tag`
`.sidebar-section-link-wrapper[data-tag-name="tag2"] .prefix-icon.d-icon-tag`
),
"default tag icon is displayed for tag2 section link's prefix icon"
);

View File

@ -50,7 +50,9 @@ acceptance(
);
assert.ok(
exists(`.sidebar-section-link[data-category-id="${category1.id}"]`),
exists(
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"]`
),
`only the ${category1.slug} section link is shown`
);
});
@ -194,7 +196,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${uncategorizedCategory.id}"]`
`.sidebar-section-link-wrapper[data-category-id="${uncategorizedCategory.id}"]`
),
`displays the section link for ${uncategorizedCategory.slug} category`
);
@ -405,20 +407,22 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"] .sidebar-section-link-prefix .prefix-span[style="background: linear-gradient(90deg, #${category1.color} 50%, #${category1.color} 50%)"]`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .sidebar-section-link-prefix .prefix-span[style="background: linear-gradient(90deg, #${category1.color} 50%, #${category1.color} 50%)"]`
),
"category1 section link is rendered with solid prefix icon color"
);
assert.strictEqual(
query(
`.sidebar-section-link[data-category-id="${category1.id}"]`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"]`
).textContent.trim(),
category1.name,
"displays category1's name for the link text"
);
await click(`.sidebar-section-link[data-category-id="${category1.id}"]`);
await click(
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a`
);
assert.strictEqual(
currentURL(),
@ -436,12 +440,14 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"].active`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a.active`
),
"the category1 section link is marked as active"
);
await click(`.sidebar-section-link[data-category-id="${category2.id}"]`);
await click(
`.sidebar-section-link-wrapper[data-category-id="${category2.id}"] a`
);
assert.strictEqual(
currentURL(),
@ -459,21 +465,21 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category2.id}"].active`
`.sidebar-section-link-wrapper[data-category-id="${category2.id}"] a.active`
),
"the category2 section link is marked as active"
);
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category3.id}"] .sidebar-section-link-prefix .prefix-badge.d-icon-lock`
`.sidebar-section-link-wrapper[data-category-id="${category3.id}"] .sidebar-section-link-prefix .prefix-badge.d-icon-lock`
),
"category3 section link is rendered with lock prefix badge icon as it is read restricted"
);
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category4.id}"] .sidebar-section-link-prefix .prefix-span[style="background: linear-gradient(90deg, #${category4.parentCategory.color} 50%, #${category4.color} 50%)"]`
`.sidebar-section-link-wrapper[data-category-id="${category4.id}"] .sidebar-section-link-prefix .prefix-span[style="background: linear-gradient(90deg, #${category4.parentCategory.color} 50%, #${category4.color} 50%)"]`
),
"sub category section link is rendered with double prefix color"
);
@ -487,7 +493,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit("/");
await click(`.sidebar-section-link[data-category-id="${category1.id}"]`);
await click(
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a`
);
assert.strictEqual(
currentURL(),
@ -505,7 +513,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"].active`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a.active`
),
"the category1 section link is marked as active"
);
@ -529,7 +537,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit("/");
await click(`.sidebar-section-link[data-category-id="${category1.id}"]`);
await click(
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a`
);
assert.strictEqual(
currentURL(),
@ -547,7 +557,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"].active`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a.active`
),
"the category1 section link is marked as active"
);
@ -579,7 +589,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit("/");
await click(`.sidebar-section-link[data-category-id="${category1.id}"]`);
await click(
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a`
);
assert.strictEqual(
currentURL(),
@ -597,7 +609,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"].active`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a.active`
),
"the category1 section link is marked as active"
);
@ -611,7 +623,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"] .sidebar-section-link-prefix .prefix-span[style="background: linear-gradient(90deg, #888 50%, #888 50%)"]`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .sidebar-section-link-prefix .prefix-span[style="background: linear-gradient(90deg, #888 50%, #888 50%)"]`
),
"category1 section link is rendered with the right solid prefix icon color"
);
@ -630,7 +642,9 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
await visit("/");
assert.strictEqual(
query(`.sidebar-section-link[data-category-id="${category.id}"]`).title,
query(
`.sidebar-section-link-wrapper[data-category-id="${category.id}"] a`
).title,
category.description_text,
"category description without HTML entity is used as the link's title"
);
@ -651,7 +665,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"].active`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a.active`
),
"the category1 section link is marked as active for the new route"
);
@ -672,7 +686,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"].active`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a.active`
),
"the category1 section link is marked as active for the unread route"
);
@ -693,7 +707,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"].active`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a.active`
),
"the category1 section link is marked as active for the top route"
);
@ -714,7 +728,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"].active`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a.active`
),
"the category1 section link is marked as active for the none route"
);
@ -735,7 +749,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"].active`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a.active`
),
"the category1 section link is marked as active for the all route"
);
@ -775,7 +789,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"] .sidebar-section-link-suffix`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .sidebar-section-link-suffix`
),
"shows suffix indicator for unread content on categories link"
);
@ -791,7 +805,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-category-id="${category1.id}"] .sidebar-section-link-suffix`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .sidebar-section-link-suffix`
),
"shows suffix indicator for new topics on categories link"
);
@ -807,7 +821,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
!exists(
`.sidebar-section-link[data-category-id="${category1.id}"] .sidebar-section-link-suffix`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .sidebar-section-link-suffix`
),
"hides suffix indicator when there's no new/unread content on category link"
);
@ -867,7 +881,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.strictEqual(
query(
`.sidebar-section-link[data-category-id="${category1.id}"] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .sidebar-section-link-content-badge`
).textContent.trim(),
I18n.t("sidebar.unread_count", { count: 1 }),
`displays 1 unread count for ${category1.slug} section link`
@ -875,7 +889,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.strictEqual(
query(
`.sidebar-section-link[data-category-id="${category2.id}"] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-category-id="${category2.id}"] .sidebar-section-link-content-badge`
).textContent.trim(),
I18n.t("sidebar.unread_count", { count: 2 }),
`displays 2 unread count for ${category2.slug} section link`
@ -892,7 +906,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.strictEqual(
query(
`.sidebar-section-link[data-category-id="${category1.id}"] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .sidebar-section-link-content-badge`
).textContent.trim(),
I18n.t("sidebar.new_count", { count: 1 }),
`displays 1 new count for ${category1.slug} section link`
@ -909,7 +923,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.ok(
!exists(
`.sidebar-section-link[data-category-id="${category1.id}"] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .sidebar-section-link-content-badge`
),
`does not display any badge ${category1.slug} section link`
);
@ -925,7 +939,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
assert.strictEqual(
query(
`.sidebar-section-link[data-category-id="${category2.id}"] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-category-id="${category2.id}"] .sidebar-section-link-content-badge`
).textContent.trim(),
I18n.t("sidebar.unread_count", { count: 1 }),
`displays 1 unread count for ${category2.slug} section link`
@ -1053,7 +1067,7 @@ acceptance(
assert.strictEqual(
query(
`.sidebar-section-link[data-category-id="${category1.id}"] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] .sidebar-section-link-content-badge`
).textContent.trim(),
"2",
"count for category1 is 2 because it has 1 unread topic and 1 new topic"
@ -1061,7 +1075,7 @@ acceptance(
assert.strictEqual(
query(
`.sidebar-section-link[data-category-id="${category2.id}"] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-category-id="${category2.id}"] .sidebar-section-link-content-badge`
).textContent.trim(),
"1",
"count for category2 is 1 because it has 1 new topic"
@ -1069,7 +1083,7 @@ acceptance(
assert.strictEqual(
query(
`.sidebar-section-link[data-category-id="${category3.id}"] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-category-id="${category3.id}"] .sidebar-section-link-content-badge`
).textContent.trim(),
"1",
"count for category3 is 1 because it has 1 unread topic"
@ -1123,21 +1137,21 @@ acceptance(
assert.true(
query(
`.sidebar-section-link[data-category-id="${category1.id}"]`
`.sidebar-section-link-wrapper[data-category-id="${category1.id}"] a`
).href.endsWith("/c/meta/3/l/new"),
"links to the new topics list for the category because there's 1 new topic"
);
assert.true(
query(
`.sidebar-section-link[data-category-id="${category2.id}"]`
`.sidebar-section-link-wrapper[data-category-id="${category2.id}"] a`
).href.endsWith("/c/howto/10/l/new"),
"links to the new topics list for the category because there's 1 unread topic"
);
assert.true(
query(
`.sidebar-section-link[data-category-id="${category3.id}"]`
`.sidebar-section-link-wrapper[data-category-id="${category3.id}"] a`
).href.endsWith("/c/feature/spec/26"),
"links to the latest topics list for the category because there are no unread or new topics"
);

View File

@ -190,24 +190,30 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
);
assert.strictEqual(
query(".sidebar-section-link[data-tag-name=tag1]").textContent.trim(),
query(
".sidebar-section-link-wrapper[data-tag-name=tag1]"
).textContent.trim(),
"tag1",
"displays the tag1 name for the link text"
);
assert.strictEqual(
query(".sidebar-section-link[data-tag-name=tag2]").textContent.trim(),
query(
".sidebar-section-link-wrapper[data-tag-name=tag2]"
).textContent.trim(),
"tag2",
"displays the tag2 name for the link text"
);
assert.strictEqual(
query(".sidebar-section-link[data-tag-name=tag3]").textContent.trim(),
query(
".sidebar-section-link-wrapper[data-tag-name=tag3]"
).textContent.trim(),
"tag3",
"displays the tag3 name for the link text"
);
await click(".sidebar-section-link[data-tag-name=tag1]");
await click(".sidebar-section-link-wrapper[data-tag-name=tag1] a");
assert.strictEqual(
currentURL(),
@ -224,11 +230,11 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
);
assert.ok(
exists(`.sidebar-section-link[data-tag-name=tag1].active`),
exists(`.sidebar-section-link-wrapper[data-tag-name=tag1] a.active`),
"the tag1 section link is marked as active"
);
await click(".sidebar-section-link[data-tag-name=tag2]");
await click(".sidebar-section-link-wrapper[data-tag-name=tag2] a");
assert.strictEqual(
currentURL(),
@ -245,7 +251,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
);
assert.ok(
exists(`.sidebar-section-link[data-tag-name=tag2].active`),
exists(`.sidebar-section-link-wrapper[data-tag-name=tag2] a.active`),
"the tag2 section link is marked as active"
);
});
@ -256,7 +262,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
});
await visit("/");
await click(".sidebar-section-link[data-tag-name=tag1]");
await click(".sidebar-section-link-wrapper[data-tag-name=tag1] a");
assert.strictEqual(
currentURL(),
@ -273,7 +279,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
);
assert.ok(
exists(`.sidebar-section-link[data-tag-name=tag1].active`),
exists(`.sidebar-section-link-wrapper[data-tag-name=tag1] a.active`),
"the tag1 section link is marked as active"
);
});
@ -298,7 +304,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
]);
await visit("/");
await click(".sidebar-section-link[data-tag-name=tag1]");
await click(".sidebar-section-link-wrapper[data-tag-name=tag1] a");
assert.strictEqual(
currentURL(),
@ -315,7 +321,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
);
assert.ok(
exists(`.sidebar-section-link[data-tag-name=tag1].active`),
exists(`.sidebar-section-link-wrapper[data-tag-name=tag1] a.active`),
"the tag1 section link is marked as active"
);
});
@ -340,7 +346,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
]);
await visit("/");
await click(".sidebar-section-link[data-tag-name=tag1]");
await click(".sidebar-section-link-wrapper[data-tag-name=tag1] a");
assert.strictEqual(
currentURL(),
@ -357,7 +363,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
);
assert.ok(
exists(`.sidebar-section-link[data-tag-name=tag1].active`),
exists(`.sidebar-section-link-wrapper[data-tag-name=tag1] a.active`),
"the tag1 section link is marked as active"
);
});
@ -365,7 +371,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
test("private message tag section links for user", async function (assert) {
await visit("/");
await click(".sidebar-section-link[data-tag-name=tag4]");
await click(".sidebar-section-link-wrapper[data-tag-name=tag4] a");
assert.strictEqual(
currentURL(),
@ -382,7 +388,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
);
assert.ok(
exists(`.sidebar-section-link[data-tag-name=tag4].active`),
exists(`.sidebar-section-link-wrapper[data-tag-name=tag4] a.active`),
"the tag4 section link is marked as active"
);
});
@ -399,7 +405,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
);
assert.ok(
exists(".sidebar-section-link[data-tag-name=tag1].active"),
exists(".sidebar-section-link-wrapper[data-tag-name=tag1] a.active"),
"the tag1 section link is marked as active for the top route"
);
});
@ -416,7 +422,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
);
assert.ok(
exists(".sidebar-section-link[data-tag-name=tag1].active"),
exists(".sidebar-section-link-wrapper[data-tag-name=tag1] a.active"),
"the tag1 section link is marked as active for the new route"
);
});
@ -433,7 +439,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
);
assert.ok(
exists(".sidebar-section-link[data-tag-name=tag1].active"),
exists(".sidebar-section-link-wrapper[data-tag-name=tag1] a.active"),
"the tag1 section link is marked as active for the unread route"
);
});
@ -483,21 +489,21 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-tag-name=tag1] .sidebar-section-link-suffix`
`.sidebar-section-link-wrapper[data-tag-name=tag1] .sidebar-section-link-suffix`
),
"shows suffix indicator for new content on tag1 link"
);
assert.ok(
exists(
`.sidebar-section-link[data-tag-name=tag2] .sidebar-section-link-suffix`
`.sidebar-section-link-wrapper[data-tag-name=tag2] .sidebar-section-link-suffix`
),
"shows suffix indicator for new content on tag2 link"
);
assert.ok(
!exists(
`.sidebar-section-link[data-tag-name=tag3] .sidebar-section-link-suffix`
`.sidebar-section-link-wrapper[data-tag-name=tag3] .sidebar-section-link-suffix`
),
"hides suffix indicator when there's no new content on tag3 link"
);
@ -513,7 +519,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
assert.ok(
exists(
`.sidebar-section-link[data-tag-name=tag1] .sidebar-section-link-suffix`
`.sidebar-section-link-wrapper[data-tag-name=tag1] .sidebar-section-link-suffix`
),
"shows suffix indicator for new topic on tag1 link"
);
@ -529,7 +535,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
assert.ok(
!exists(
`.sidebar-section-link[data-tag-name=tag1] .sidebar-section-link-suffix`
`.sidebar-section-link-wrapper[data-tag-name=tag1] .sidebar-section-link-suffix`
),
"hides suffix indicator for tag1 section link"
);
@ -591,7 +597,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
assert.strictEqual(
query(
`.sidebar-section-link[data-tag-name=tag1] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-tag-name=tag1] .sidebar-section-link-content-badge`
).textContent.trim(),
I18n.t("sidebar.unread_count", { count: 1 }),
`displays 1 unread count for tag1 section link`
@ -599,7 +605,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
assert.strictEqual(
query(
`.sidebar-section-link[data-tag-name=tag2] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-tag-name=tag2] .sidebar-section-link-content-badge`
).textContent.trim(),
I18n.t("sidebar.unread_count", { count: 1 }),
`displays 1 unread count for tag2 section link`
@ -607,7 +613,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
assert.ok(
!exists(
`.sidebar-section-link[data-tag-name=tag3] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-tag-name=tag3] .sidebar-section-link-content-badge`
),
"does not display any badge for tag3 section link"
);
@ -623,7 +629,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
assert.strictEqual(
query(
`.sidebar-section-link[data-tag-name=tag1] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-tag-name=tag1] .sidebar-section-link-content-badge`
).textContent.trim(),
I18n.t("sidebar.new_count", { count: 1 }),
`displays 1 new count for tag1 section link`
@ -640,7 +646,7 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) {
assert.ok(
!exists(
`.sidebar-section-link[data-tag-name=tag1] .sidebar-section-link-content-badge`
`.sidebar-section-link-wrapper[data-tag-name=tag1] .sidebar-section-link-content-badge`
),
`does not display any badge tag1 section link`
);
@ -752,7 +758,7 @@ acceptance(
assert.strictEqual(
query(
'.sidebar-section-link[data-tag-name="tag1"] .sidebar-section-link-content-badge'
'.sidebar-section-link-wrapper[data-tag-name="tag1"] .sidebar-section-link-content-badge'
).textContent.trim(),
"2",
"count for tag1 is 2 because it has 1 unread topic and 1 new topic"
@ -760,7 +766,7 @@ acceptance(
assert.strictEqual(
query(
'.sidebar-section-link[data-tag-name="tag2"] .sidebar-section-link-content-badge'
'.sidebar-section-link-wrapper[data-tag-name="tag2"] .sidebar-section-link-content-badge'
).textContent.trim(),
"1",
"count for tag2 is 1 because it has 1 unread topic"
@ -768,7 +774,7 @@ acceptance(
assert.strictEqual(
query(
'.sidebar-section-link[data-tag-name="tag3"] .sidebar-section-link-content-badge'
'.sidebar-section-link-wrapper[data-tag-name="tag3"] .sidebar-section-link-content-badge'
).textContent.trim(),
"1",
"count for tag3 is 1 because it has 1 new topic"
@ -815,23 +821,23 @@ acceptance(
await visit("/");
assert.true(
query('.sidebar-section-link[data-tag-name="tag1"]').href.endsWith(
"/tag/tag1/l/new"
),
query(
'.sidebar-section-link-wrapper[data-tag-name="tag1"] a'
).href.endsWith("/tag/tag1/l/new"),
"links to the new topics list for the tag because there's 1 new topic"
);
assert.true(
query('.sidebar-section-link[data-tag-name="tag2"]').href.endsWith(
"/tag/tag2/l/new"
),
query(
'.sidebar-section-link-wrapper[data-tag-name="tag2"] a'
).href.endsWith("/tag/tag2/l/new"),
"links to the new topics list for the tag because there's 1 unread topic"
);
assert.true(
query('.sidebar-section-link[data-tag-name="tag3"]').href.endsWith(
"/tag/tag3"
),
query(
'.sidebar-section-link-wrapper[data-tag-name="tag3"] a'
).href.endsWith("/tag/tag3"),
"links to the latest topics list for the tag because there are no unread or new topics"
);
});

View File

@ -67,7 +67,7 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok(
exists(
".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=6]"
".sidebar-section[data-section-name='categories'] .sidebar-section-link-wrapper[data-category-id=6] a"
),
"support category is present in sidebar"
);
@ -95,14 +95,14 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok(
!exists(
".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=10]"
".sidebar-section[data-section-name='categories'] .sidebar-section-link-wrapper[data-category-id=10] a"
),
"howto category is not displayed in sidebar"
);
assert.ok(
exists(
".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=6]"
".sidebar-section[data-section-name='categories'] .sidebar-section-link-wrapper[data-category-id=6] a"
),
"support category is displayed in sidebar"
);
@ -123,14 +123,14 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok(
exists(
".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=6]"
".sidebar-section[data-section-name='categories'] .sidebar-section-link-wrapper[data-category-id=6] a"
),
"support category has been added to sidebar"
);
assert.ok(
exists(
".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=1]"
".sidebar-section[data-section-name='categories'] .sidebar-section-link-wrapper[data-category-id=1] a"
),
"bug category has been added to sidebar"
);
@ -153,14 +153,14 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok(
exists(
".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=6]"
".sidebar-section[data-section-name='categories'] .sidebar-section-link-wrapper[data-category-id=6] a"
),
"support category has been added to sidebar"
);
assert.ok(
exists(
".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-category-id=1]"
".sidebar-section[data-section-name='categories'] .sidebar-section-link-wrapper[data-category-id=1] a"
),
"bug category has been added to sidebar"
);
@ -179,7 +179,7 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok(
exists(
".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-tag-name=monkey]"
".sidebar-section[data-section-name='tags'] .sidebar-section-link-wrapper[data-tag-name=monkey]"
),
"monkey tag is displayed in sidebar"
);
@ -207,14 +207,14 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok(
!exists(
".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-tag-name=gazelle]"
".sidebar-section[data-section-name='tags'] .sidebar-section-link-wrapper[data-tag-name=gazelle]"
),
"gazelle tag is not displayed in sidebar"
);
assert.ok(
exists(
".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-tag-name=monkey]"
".sidebar-section[data-section-name='tags'] .sidebar-section-link-wrapper[data-tag-name=monkey]"
),
"monkey tag is displayed in sidebar"
);
@ -239,7 +239,7 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok(
exists(
".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-tag-name=monkey]"
".sidebar-section[data-section-name='tags'] .sidebar-section-link-wrapper[data-tag-name=monkey]"
),
"monkey tag has been added to sidebar"
);
@ -262,14 +262,14 @@ acceptance("User Preferences - Sidebar", function (needs) {
assert.ok(
exists(
".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-tag-name=monkey]"
".sidebar-section[data-section-name='tags'] .sidebar-section-link-wrapper[data-tag-name=monkey]"
),
"monkey tag has been added to sidebar"
);
assert.ok(
exists(
".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-tag-name=gazelle]"
".sidebar-section[data-section-name='tags'] .sidebar-section-link-wrapper[data-tag-name=gazelle]"
),
"gazelle tag has been added to sidebar"
);