From 6fa52a64999f124a98c9841ec3eb0196df5c288d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9rgio=20Saquetim?=
<1108771+megothss@users.noreply.github.com>
Date: Thu, 12 Dec 2024 15:36:05 -0300
Subject: [PATCH] DEV: Improve tests and fixes small issues in the Glimmer Post
Menu (#30234)
This commit improves some tests to using both the glimmer post menu and the widget version.
It also addresses some small issues in the Glimmer Post Menu:
- Deprecated Font Awesome icon in the Edit button
- Set correctly `aria-pressed` in the Like Count when the list of people who liked is visible
- Display the user tip for the Show More button
---
.../discourse/app/components/post/menu.gjs | 7 +-
.../app/components/post/menu/buttons/edit.gjs | 2 +-
.../app/components/post/menu/buttons/like.gjs | 2 +-
.../tests/acceptance/post-controls-test.js | 167 ++++----
.../discourse/tests/acceptance/topic-test.js | 379 +++++++++---------
.../tests/acceptance/user-tips-test.js | 26 +-
.../components/widgets/post-stream-test.gjs | 235 +++++++++++
.../components/widgets/post-stream-test.js | 196 ---------
8 files changed, 543 insertions(+), 471 deletions(-)
create mode 100644 app/assets/javascripts/discourse/tests/integration/components/widgets/post-stream-test.gjs
delete mode 100644 app/assets/javascripts/discourse/tests/integration/components/widgets/post-stream-test.js
diff --git a/app/assets/javascripts/discourse/app/components/post/menu.gjs b/app/assets/javascripts/discourse/app/components/post/menu.gjs
index 41b49650405..5a64d3b4ea3 100644
--- a/app/assets/javascripts/discourse/app/components/post/menu.gjs
+++ b/app/assets/javascripts/discourse/app/components/post/menu.gjs
@@ -583,6 +583,7 @@ export default class PostMenu extends Component {
@outletArgs={{hash post=@post state=this.state}}
>
{{/if}}
- {{#if this.collapsedButtons}}
+ {{#if
+ (this.showMoreButton.shouldRender
+ (hash post=this.post state=this.state)
+ )
+ }}
diff --git a/app/assets/javascripts/discourse/app/components/post/menu/buttons/like.gjs b/app/assets/javascripts/discourse/app/components/post/menu/buttons/like.gjs
index b85983bbfb8..6bb0960ad14 100644
--- a/app/assets/javascripts/discourse/app/components/post/menu/buttons/like.gjs
+++ b/app/assets/javascripts/discourse/app/components/post/menu/buttons/like.gjs
@@ -130,7 +130,7 @@ class LikeCount extends Component {
(if @post.yours "my-likes" "regular-likes")
}}
...attributes
- @ariaPressed={{@state.isWhoReadVisible}}
+ @ariaPressed={{@state.isWhoLikedVisible}}
@translatedAriaLabel={{i18n
"post.sr_post_like_count_button"
count=@post.likeCount
diff --git a/app/assets/javascripts/discourse/tests/acceptance/post-controls-test.js b/app/assets/javascripts/discourse/tests/acceptance/post-controls-test.js
index 6b90712499c..cc4355726a8 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/post-controls-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/post-controls-test.js
@@ -3,93 +3,102 @@ import { test } from "qunit";
import { acceptance } from "discourse/tests/helpers/qunit-helpers";
import { i18n } from "discourse-i18n";
-acceptance("Post controls", function () {
- test("accessibility of the likes list below the post", async function (assert) {
- await visit("/t/internationalization-localization/280");
+["enabled", "disabled"].forEach((postMenuMode) => {
+ acceptance(
+ `Post controls (glimmer_post_menu_mode = ${postMenuMode})`,
+ function (needs) {
+ needs.settings({
+ glimmer_post_menu_mode: postMenuMode,
+ });
- assert
- .dom("#post_2 button.like-count")
- .hasAria("pressed", "false", "show likes button isn't pressed");
- assert
- .dom("#post_2 button.like-count")
- .hasAria(
- "label",
- i18n("post.sr_post_like_count_button", { count: 4 }),
- "show likes button has aria-label"
- );
+ test("accessibility of the likes list below the post", async function (assert) {
+ await visit("/t/internationalization-localization/280");
- await click("#post_2 button.like-count");
- assert
- .dom("#post_2 button.like-count")
- .hasAria("pressed", "true", "show likes button is now pressed");
+ assert
+ .dom("#post_2 button.like-count")
+ .hasAria("pressed", "false", "show likes button isn't pressed");
+ assert
+ .dom("#post_2 button.like-count")
+ .hasAria(
+ "label",
+ i18n("post.sr_post_like_count_button", { count: 4 }),
+ "show likes button has aria-label"
+ );
- assert
- .dom("#post_2 .small-user-list.who-liked .small-user-list-content")
- .hasAttribute("role", "list", "likes container has list role");
- assert
- .dom("#post_2 .small-user-list.who-liked .small-user-list-content")
- .hasAria(
- "label",
- i18n("post.actions.people.sr_post_likers_list_description"),
- "likes container has aria-label"
- );
- assert
- .dom("#post_2 .small-user-list.who-liked .list-description")
- .hasAria("hidden", "true", "list description is aria-hidden");
+ await click("#post_2 button.like-count");
+ assert
+ .dom("#post_2 button.like-count")
+ .hasAria("pressed", "true", "show likes button is now pressed");
- assert
- .dom("#post_2 .small-user-list.who-liked a.trigger-user-card")
- .exists("avatars are rendered");
+ assert
+ .dom("#post_2 .small-user-list.who-liked .small-user-list-content")
+ .hasAttribute("role", "list", "likes container has list role");
+ assert
+ .dom("#post_2 .small-user-list.who-liked .small-user-list-content")
+ .hasAria(
+ "label",
+ i18n("post.actions.people.sr_post_likers_list_description"),
+ "likes container has aria-label"
+ );
+ assert
+ .dom("#post_2 .small-user-list.who-liked .list-description")
+ .hasAria("hidden", "true", "list description is aria-hidden");
- assert
- .dom("#post_2 .small-user-list.who-liked a.trigger-user-card")
- .hasAria("hidden", "false", "avatars are not aria-hidden");
- assert
- .dom("#post_2 .small-user-list.who-liked a.trigger-user-card")
- .hasAttribute("role", "listitem", "avatars have listitem role");
- });
+ assert
+ .dom("#post_2 .small-user-list.who-liked a.trigger-user-card")
+ .exists("avatars are rendered");
- test("accessibility of the embedded replies below the post", async function (assert) {
- await visit("/t/internationalization-localization/280");
+ assert
+ .dom("#post_2 .small-user-list.who-liked a.trigger-user-card")
+ .hasAria("hidden", "false", "avatars are not aria-hidden");
+ assert
+ .dom("#post_2 .small-user-list.who-liked a.trigger-user-card")
+ .hasAttribute("role", "listitem", "avatars have listitem role");
+ });
- assert
- .dom("#post_1 button.show-replies")
- .hasAria("pressed", "false", "show replies button isn't pressed");
- assert
- .dom("#post_1 button.show-replies")
- .hasAria(
- "label",
- i18n("post.sr_expand_replies", { count: 1 }),
- "show replies button has aria-label"
- );
+ test("accessibility of the embedded replies below the post", async function (assert) {
+ await visit("/t/internationalization-localization/280");
- await click("#post_1 button.show-replies");
- assert
- .dom("#post_1 button.show-replies")
- .hasAria("pressed", "true", "show replies button is now pressed");
+ assert
+ .dom("#post_1 button.show-replies")
+ .hasAria("pressed", "false", "show replies button isn't pressed");
+ assert
+ .dom("#post_1 button.show-replies")
+ .hasAria(
+ "label",
+ i18n("post.sr_expand_replies", { count: 1 }),
+ "show replies button has aria-label"
+ );
- // const replies = Array.from(queryAll("#post_1 .embedded-posts .reply"));
- assert
- .dom("#post_1 .embedded-posts .reply")
- .exists({ count: 1 }, "replies are rendered");
+ await click("#post_1 button.show-replies");
+ assert
+ .dom("#post_1 button.show-replies")
+ .hasAria("pressed", "true", "show replies button is now pressed");
- assert
- .dom("#post_1 .embedded-posts .reply")
- .hasAttribute("role", "region", "replies have region role");
- assert.dom("#post_1 .embedded-posts .reply").hasAria(
- "label",
- i18n("post.sr_embedded_reply_description", {
- post_number: 1,
- username: "somebody",
- }),
- "replies have aria-label"
- );
- assert
- .dom("#post_1 .embedded-posts .btn.collapse-up")
- .hasAria(
- "label",
- i18n("post.sr_collapse_replies"),
- "collapse button has aria-label"
- );
- });
+ // const replies = Array.from(queryAll("#post_1 .embedded-posts .reply"));
+ assert
+ .dom("#post_1 .embedded-posts .reply")
+ .exists({ count: 1 }, "replies are rendered");
+
+ assert
+ .dom("#post_1 .embedded-posts .reply")
+ .hasAttribute("role", "region", "replies have region role");
+ assert.dom("#post_1 .embedded-posts .reply").hasAria(
+ "label",
+ i18n("post.sr_embedded_reply_description", {
+ post_number: 1,
+ username: "somebody",
+ }),
+ "replies have aria-label"
+ );
+ assert
+ .dom("#post_1 .embedded-posts .btn.collapse-up")
+ .hasAria(
+ "label",
+ i18n("post.sr_collapse_replies"),
+ "collapse button has aria-label"
+ );
+ });
+ }
+ );
});
diff --git a/app/assets/javascripts/discourse/tests/acceptance/topic-test.js b/app/assets/javascripts/discourse/tests/acceptance/topic-test.js
index 5465ee7b5b9..2bcd418d903 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/topic-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/topic-test.js
@@ -20,240 +20,249 @@ import { withSilencedDeprecations } from "discourse-common/lib/deprecated";
import { cloneJSON } from "discourse-common/lib/object";
import { i18n } from "discourse-i18n";
-acceptance("Topic", function (needs) {
- needs.user();
- needs.settings({
- post_menu: "read|like|share|flag|edit|bookmark|delete|admin|reply|copyLink",
- });
- needs.pretender((server, helper) => {
- server.get("/c/2/visible_groups.json", () =>
- helper.response(200, {
- groups: [],
- })
- );
+["enabled", "disabled"].forEach((postMenuMode) => {
+ acceptance(
+ `Topic (glimmer_post_menu_mode = ${postMenuMode})`,
+ function (needs) {
+ needs.user();
+ needs.settings({
+ post_menu:
+ "read|like|share|flag|edit|bookmark|delete|admin|reply|copyLink",
+ glimmer_post_menu_mode: postMenuMode,
+ });
+ needs.pretender((server, helper) => {
+ server.get("/c/2/visible_groups.json", () =>
+ helper.response(200, {
+ groups: [],
+ })
+ );
- server.get("/c/feature/find_by_slug.json", () => {
- return helper.response(200, CategoryFixtures["/c/1/show.json"]);
- });
- server.put("/posts/398/wiki", () => {
- return helper.response({});
- });
- });
+ server.get("/c/feature/find_by_slug.json", () => {
+ return helper.response(200, CategoryFixtures["/c/1/show.json"]);
+ });
+ server.put("/posts/398/wiki", () => {
+ return helper.response({});
+ });
+ });
- test("Reply as new topic", async function (assert) {
- await visit("/t/internationalization-localization/280");
- await click("button.share:nth-of-type(1)");
- await click("button.new-topic");
+ test("Reply as new topic", async function (assert) {
+ await visit("/t/internationalization-localization/280");
+ await click("button.share:nth-of-type(1)");
+ await click("button.new-topic");
- assert.dom(".d-editor-input").exists("the composer input is visible");
+ assert.dom(".d-editor-input").exists("the composer input is visible");
- assert
- .dom(".d-editor-input")
- .hasValue(
- `Continuing the discussion from [Internationalization / localization](${window.location.origin}/t/internationalization-localization/280):\n\n`,
- "fills composer with the ring string"
- );
- assert.strictEqual(
- selectKit(".category-chooser").header().value(),
- "2",
- "fills category selector with the right category"
- );
- });
+ assert
+ .dom(".d-editor-input")
+ .hasValue(
+ `Continuing the discussion from [Internationalization / localization](${window.location.origin}/t/internationalization-localization/280):\n\n`,
+ "fills composer with the ring string"
+ );
+ assert.strictEqual(
+ selectKit(".category-chooser").header().value(),
+ "2",
+ "fills category selector with the right category"
+ );
+ });
- test("Reply as new message", async function (assert) {
- await visit("/t/pm-for-testing/12");
- await click("button.share:nth-of-type(1)");
- await click("button.new-topic");
+ test("Reply as new message", async function (assert) {
+ await visit("/t/pm-for-testing/12");
+ await click("button.share:nth-of-type(1)");
+ await click("button.new-topic");
- assert.dom(".d-editor-input").exists("the composer input is visible");
+ assert.dom(".d-editor-input").exists("the composer input is visible");
- assert
- .dom(".d-editor-input")
- .hasValue(
- `Continuing the discussion from [PM for testing](${window.location.origin}/t/pm-for-testing/12):\n\n`,
- "fills composer with the ring string"
- );
+ assert
+ .dom(".d-editor-input")
+ .hasValue(
+ `Continuing the discussion from [PM for testing](${window.location.origin}/t/pm-for-testing/12):\n\n`,
+ "fills composer with the ring string"
+ );
- const privateMessageUsers = selectKit("#private-message-users");
- assert.strictEqual(
- privateMessageUsers.header().value(),
- "someguy,test,Group",
- "fills up the composer correctly"
- );
- });
+ const privateMessageUsers = selectKit("#private-message-users");
+ assert.strictEqual(
+ privateMessageUsers.header().value(),
+ "someguy,test,Group",
+ "fills up the composer correctly"
+ );
+ });
- test("Share Modal", async function (assert) {
- await visit("/t/internationalization-localization/280");
- await click(".topic-post:first-child button.share");
+ test("Share Modal", async function (assert) {
+ await visit("/t/internationalization-localization/280");
+ await click(".topic-post:first-child button.share");
- assert.dom(".share-topic-modal").exists("shows the share modal");
- });
+ assert.dom(".share-topic-modal").exists("shows the share modal");
+ });
- test("Copy Link Button", async function (assert) {
- await visit("/t/internationalization-localization/280");
- await click(".topic-post:first-child button.post-action-menu__copy-link");
+ test("Copy Link Button", async function (assert) {
+ await visit("/t/internationalization-localization/280");
+ await click(
+ ".topic-post:first-child button.post-action-menu__copy-link"
+ );
- assert
- .dom(".post-action-menu__copy-link-checkmark")
- .exists("shows the Link Copied! message");
- });
+ assert
+ .dom(".post-action-menu__copy-link-checkmark")
+ .exists("shows the Link Copied! message");
+ });
- test("Showing and hiding the edit controls", async function (assert) {
- await visit("/t/internationalization-localization/280");
+ test("Showing and hiding the edit controls", async function (assert) {
+ await visit("/t/internationalization-localization/280");
- await click("#topic-title .d-icon-pencil");
+ await click("#topic-title .d-icon-pencil");
- assert.dom("#edit-title").exists("shows the editing controls");
- assert
- .dom(".title-wrapper .remove-featured-link")
- .doesNotExist("link to remove featured link is not shown");
+ assert.dom("#edit-title").exists("shows the editing controls");
+ assert
+ .dom(".title-wrapper .remove-featured-link")
+ .doesNotExist("link to remove featured link is not shown");
- await fillIn("#edit-title", "this is the new title");
- await click("#topic-title .cancel-edit");
- assert.dom("#edit-title").doesNotExist("hides the editing controls");
- });
+ await fillIn("#edit-title", "this is the new title");
+ await click("#topic-title .cancel-edit");
+ assert.dom("#edit-title").doesNotExist("hides the editing controls");
+ });
- test("Updating the topic title and category", async function (assert) {
- const categoryChooser = selectKit(".title-wrapper .category-chooser");
+ test("Updating the topic title and category", async function (assert) {
+ const categoryChooser = selectKit(".title-wrapper .category-chooser");
- await visit("/t/internationalization-localization/280");
+ await visit("/t/internationalization-localization/280");
- await click("#topic-title .d-icon-pencil");
- await fillIn("#edit-title", "this is the new title");
- await categoryChooser.expand();
- await categoryChooser.selectRowByValue(4);
- await click("#topic-title .submit-edit");
+ await click("#topic-title .d-icon-pencil");
+ await fillIn("#edit-title", "this is the new title");
+ await categoryChooser.expand();
+ await categoryChooser.selectRowByValue(4);
+ await click("#topic-title .submit-edit");
- assert
- .dom("#topic-title .badge-category")
- .hasText("faq", "displays the new category");
- assert
- .dom(".fancy-title")
- .hasText("this is the new title", "displays the new title");
- });
+ assert
+ .dom("#topic-title .badge-category")
+ .hasText("faq", "displays the new category");
+ assert
+ .dom(".fancy-title")
+ .hasText("this is the new title", "displays the new title");
+ });
- test("Marking a topic as wiki", async function (assert) {
- await visit("/t/internationalization-localization/280");
+ test("Marking a topic as wiki", async function (assert) {
+ await visit("/t/internationalization-localization/280");
- assert.dom("a.wiki").doesNotExist("does not show the wiki icon");
+ assert.dom("a.wiki").doesNotExist("does not show the wiki icon");
- await click(".topic-post:nth-of-type(1) button.show-more-actions");
- await click(".topic-post:nth-of-type(1) button.show-post-admin-menu");
- await click(".btn.wiki");
+ await click(".topic-post:nth-of-type(1) button.show-more-actions");
+ await click(".topic-post:nth-of-type(1) button.show-post-admin-menu");
+ await click(".btn.wiki");
- assert.dom("button.wiki").exists("shows the wiki icon");
- });
+ assert.dom("button.wiki").exists("shows the wiki icon");
+ });
- test("Visit topic routes", async function (assert) {
- await visit("/t/12");
+ test("Visit topic routes", async function (assert) {
+ await visit("/t/12");
- assert
- .dom(".fancy-title")
- .hasText("PM for testing", "routes to the right topic");
+ assert
+ .dom(".fancy-title")
+ .hasText("PM for testing", "routes to the right topic");
- await visit("/t/280/20");
+ await visit("/t/280/20");
- assert
- .dom(".fancy-title")
- .hasText(
- "Internationalization / localization",
- "routes to the right topic"
- );
- });
+ assert
+ .dom(".fancy-title")
+ .hasText(
+ "Internationalization / localization",
+ "routes to the right topic"
+ );
+ });
- test("Updating the topic title with emojis", async function (assert) {
- await visit("/t/internationalization-localization/280");
- await click("#topic-title .d-icon-pencil");
+ test("Updating the topic title with emojis", async function (assert) {
+ await visit("/t/internationalization-localization/280");
+ await click("#topic-title .d-icon-pencil");
- await fillIn("#edit-title", "emojis title :bike: :blonde_woman:t6:");
+ await fillIn("#edit-title", "emojis title :bike: :blonde_woman:t6:");
- await click("#topic-title .submit-edit");
+ await click("#topic-title .submit-edit");
- assert
- .dom(".fancy-title")
- .includesHtml("bike.png", "displays the new title with emojis");
- });
+ assert
+ .dom(".fancy-title")
+ .includesHtml("bike.png", "displays the new title with emojis");
+ });
- test("Updating the topic title with unicode emojis", async function (assert) {
- await visit("/t/internationalization-localization/280");
- await click("#topic-title .d-icon-pencil");
+ test("Updating the topic title with unicode emojis", async function (assert) {
+ await visit("/t/internationalization-localization/280");
+ await click("#topic-title .d-icon-pencil");
- await fillIn("#edit-title", "emojis title 👨🌾🙏");
+ await fillIn("#edit-title", "emojis title 👨🌾🙏");
- await click("#topic-title .submit-edit");
+ await click("#topic-title .submit-edit");
- assert
- .dom(".fancy-title")
- .includesHtml("man_farmer.png", "displays the new title with emojis");
- });
+ assert
+ .dom(".fancy-title")
+ .includesHtml("man_farmer.png", "displays the new title with emojis");
+ });
- test("Updating the topic title with unicode emojis without whitespace", async function (assert) {
- this.siteSettings.enable_inline_emoji_translation = true;
- await visit("/t/internationalization-localization/280");
- await click("#topic-title .d-icon-pencil");
+ test("Updating the topic title with unicode emojis without whitespace", async function (assert) {
+ this.siteSettings.enable_inline_emoji_translation = true;
+ await visit("/t/internationalization-localization/280");
+ await click("#topic-title .d-icon-pencil");
- await fillIn("#edit-title", "Test🙂Title");
+ await fillIn("#edit-title", "Test🙂Title");
- await click("#topic-title .submit-edit");
+ await click("#topic-title .submit-edit");
- assert
- .dom(".fancy-title")
- .includesHtml(
- "slightly_smiling_face.png",
- "displays the new title with emojis"
- );
- });
+ assert
+ .dom(".fancy-title")
+ .includesHtml(
+ "slightly_smiling_face.png",
+ "displays the new title with emojis"
+ );
+ });
- test("Suggested topics", async function (assert) {
- await visit("/t/internationalization-localization/280");
+ test("Suggested topics", async function (assert) {
+ await visit("/t/internationalization-localization/280");
- assert
- .dom("#suggested-topics-title")
- .hasText(i18n("suggested_topics.title"));
- });
+ assert
+ .dom("#suggested-topics-title")
+ .hasText(i18n("suggested_topics.title"));
+ });
- test("Deleting a topic", async function (assert) {
- this.siteSettings.min_topic_views_for_delete_confirm = 10000;
- await visit("/t/internationalization-localization/280");
- await click(".topic-post:nth-of-type(1) button.show-more-actions");
- await click(".widget-button.delete");
- await click(".toggle-admin-menu");
- assert.dom(".topic-admin-recover").exists("shows the recover button");
- });
+ test("Deleting a topic", async function (assert) {
+ this.siteSettings.min_topic_views_for_delete_confirm = 10000;
+ await visit("/t/internationalization-localization/280");
+ await click(".topic-post:nth-of-type(1) button.show-more-actions");
+ await click(".topic-post:nth-of-type(1) button.delete");
+ await click(".toggle-admin-menu");
+ assert.dom(".topic-admin-recover").exists("shows the recover button");
+ });
- test("Deleting a popular topic displays confirmation modal", async function (assert) {
- this.siteSettings.min_topic_views_for_delete_confirm = 10;
- await visit("/t/internationalization-localization/280");
- await click(".topic-post:nth-of-type(1) button.show-more-actions");
- await click(".widget-button.delete");
- assert
- .dom(".delete-topic-confirm-modal")
- .exists("shows the delete confirmation modal");
+ test("Deleting a popular topic displays confirmation modal", async function (assert) {
+ this.siteSettings.min_topic_views_for_delete_confirm = 10;
+ await visit("/t/internationalization-localization/280");
+ await click(".topic-post:nth-of-type(1) button.show-more-actions");
+ await click(".topic-post:nth-of-type(1) button.delete");
+ assert
+ .dom(".delete-topic-confirm-modal")
+ .exists("shows the delete confirmation modal");
- await click(".delete-topic-confirm-modal .btn-primary");
- assert
- .dom(".delete-topic-confirm-modal")
- .doesNotExist("hides the delete confirmation modal");
- await click(".widget-button.delete");
- await click(".delete-topic-confirm-modal .btn-danger");
- await click(".toggle-admin-menu");
- assert.dom(".topic-admin-recover").exists("shows the recover button");
- });
+ await click(".delete-topic-confirm-modal .btn-primary");
+ assert
+ .dom(".delete-topic-confirm-modal")
+ .doesNotExist("hides the delete confirmation modal");
+ await click(".topic-post:nth-of-type(1) button.delete");
+ await click(".delete-topic-confirm-modal .btn-danger");
+ await click(".toggle-admin-menu");
+ assert.dom(".topic-admin-recover").exists("shows the recover button");
+ });
- test("Group category moderator posts", async function (assert) {
- await visit("/t/topic-for-group-moderators/2480");
+ test("Group category moderator posts", async function (assert) {
+ await visit("/t/topic-for-group-moderators/2480");
- assert.dom(".category-moderator").exists("has a class applied");
- assert.dom(".d-icon-shield-halved").exists("shows an icon");
- });
+ assert.dom(".category-moderator").exists("has a class applied");
+ assert.dom(".d-icon-shield-halved").exists("shows an icon");
+ });
- test("Suspended user posts", async function (assert) {
- await visit("/t/topic-from-suspended-user/54077");
+ test("Suspended user posts", async function (assert) {
+ await visit("/t/topic-from-suspended-user/54077");
- assert
- .dom(".topic-post.user-suspended > #post_1")
- .exists("has a class applied");
- });
+ assert
+ .dom(".topic-post.user-suspended > #post_1")
+ .exists("has a class applied");
+ });
+ }
+ );
});
acceptance("Topic featured links", function (needs) {
diff --git a/app/assets/javascripts/discourse/tests/acceptance/user-tips-test.js b/app/assets/javascripts/discourse/tests/acceptance/user-tips-test.js
index 4fbdc6d2eb0..ddf57857aed 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/user-tips-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/user-tips-test.js
@@ -49,16 +49,26 @@ acceptance("User Tips - topic_timeline", function (needs) {
});
});
-acceptance("User Tips - post_menu", function (needs) {
- needs.user();
- needs.site({ user_tips: { post_menu: 3 } });
+["enabled", "disabled"].forEach((postMenuMode) => {
+ acceptance(
+ `User Tips - post_menu (glimmer_post_menu_mode = ${postMenuMode})`,
+ function (needs) {
+ needs.user();
+ needs.site({ user_tips: { post_menu: 3 } });
+ needs.settings({
+ glimmer_post_menu_mode: postMenuMode,
+ });
- test("Shows post menu user tip", async function (assert) {
- this.siteSettings.enable_user_tips = true;
+ test("Shows post menu user tip", async function (assert) {
+ this.siteSettings.enable_user_tips = true;
- await visit("/t/internationalization-localization/280");
- assert.dom(".user-tip__title").hasText(i18n("user_tips.post_menu.title"));
- });
+ await visit("/t/internationalization-localization/280");
+ assert
+ .dom(".user-tip__title")
+ .hasText(i18n("user_tips.post_menu.title"));
+ });
+ }
+ );
});
acceptance("User Tips - topic_notification_levels", function (needs) {
diff --git a/app/assets/javascripts/discourse/tests/integration/components/widgets/post-stream-test.gjs b/app/assets/javascripts/discourse/tests/integration/components/widgets/post-stream-test.gjs
new file mode 100644
index 00000000000..a853d53213c
--- /dev/null
+++ b/app/assets/javascripts/discourse/tests/integration/components/widgets/post-stream-test.gjs
@@ -0,0 +1,235 @@
+import { getOwner } from "@ember/owner";
+import { render } from "@ember/test-helpers";
+import { hbs } from "ember-cli-htmlbars";
+import { module, test } from "qunit";
+import DButton from "discourse/components/d-button";
+import { withPluginApi } from "discourse/lib/plugin-api";
+import { setupRenderingTest } from "discourse/tests/helpers/component-test";
+import { resetPostMenuExtraButtons } from "discourse/widgets/post-menu";
+import { withSilencedDeprecations } from "discourse-common/lib/deprecated";
+
+function postStreamTest(name, attrs) {
+ test(name, async function (assert) {
+ this.set("posts", attrs.posts.call(this));
+
+ await render(
+ hbs`
+ `
+ );
+
+ attrs.test.call(this, assert);
+ });
+}
+
+["enabled", "disabled"].forEach((postMenuMode) => {
+ let lastTransformedPost = null;
+
+ module(
+ `Integration | Component | Widget | post-stream (glimmer_post_menu_mode = ${postMenuMode})`,
+ function (hooks) {
+ setupRenderingTest(hooks);
+
+ hooks.beforeEach(function () {
+ this.siteSettings.glimmer_post_menu_mode = postMenuMode;
+ });
+
+ hooks.afterEach(function () {
+ resetPostMenuExtraButtons();
+ });
+
+ const CustomPostMenuButton =
+
+ ;
+
+ postStreamTest("extensibility", {
+ posts() {
+ withPluginApi("1.34.0", (api) => {
+ api.registerValueTransformer(
+ "post-menu-buttons",
+ ({ value: dag, context: { post, firstButtonKey } }) => {
+ dag.add("coffee", CustomPostMenuButton, {
+ before: firstButtonKey,
+ });
+
+ // value transformers shouldn't have side effects
+ // we are only doing it below for testing purposes. Do not use strategies like this in the app code
+ lastTransformedPost = post;
+ }
+ );
+
+ withSilencedDeprecations(
+ "discourse.post-menu-widget-overrides",
+ () => {
+ api.addPostMenuButton("coffee", (transformedPost) => {
+ lastTransformedPost = transformedPost;
+
+ return {
+ action: "drinkCoffee",
+ icon: "mug-saucer",
+ className: "hot-coffee",
+ title: "coffee.title",
+ position: "first",
+ };
+ });
+ }
+ );
+ });
+
+ const store = getOwner(this).lookup("service:store");
+ const topic = store.createRecord("topic");
+ topic.set("details.created_by", { id: 123 });
+ topic.set("id", 1234);
+
+ return [
+ store.createRecord("post", {
+ topic,
+ id: 1,
+ post_number: 1,
+ user_id: 123,
+ primary_group_name: "trout",
+ avatar_template: "/images/avatar.png",
+ }),
+ ];
+ },
+
+ test(assert) {
+ assert.dom(".post-stream").exists({ count: 1 });
+ assert.dom(".topic-post").exists({ count: 1 }, "renders all posts");
+ assert
+ .dom(".topic-post:nth-of-type(1) button.hot-coffee")
+ .exists("it transforms posts");
+ assert.strictEqual(
+ lastTransformedPost.topic.id,
+ 1234,
+ "it also transforms the topic"
+ );
+ assert
+ .dom(".actions .hot-coffee")
+ .exists({ count: 1 }, "has the extended button");
+ },
+ });
+
+ postStreamTest("basics", {
+ posts() {
+ const site = getOwner(this).lookup("service:site");
+ const store = getOwner(this).lookup("service:store");
+ const topic = store.createRecord("topic");
+ topic.set("details.created_by", { id: 123 });
+
+ return [
+ store.createRecord("post", {
+ topic,
+ id: 1,
+ post_number: 1,
+ user_id: 123,
+ primary_group_name: "trout",
+ avatar_template: "/images/avatar.png",
+ }),
+ store.createRecord("post", {
+ topic,
+ id: 2,
+ post_number: 2,
+ post_type: site.get("post_types.moderator_action"),
+ }),
+ store.createRecord("post", {
+ topic,
+ id: 3,
+ post_number: 3,
+ hidden: true,
+ }),
+ store.createRecord("post", {
+ topic,
+ id: 4,
+ post_number: 4,
+ post_type: site.get("post_types.whisper"),
+ }),
+ store.createRecord("post", {
+ topic,
+ id: 5,
+ post_number: 5,
+ wiki: true,
+ via_email: true,
+ }),
+ store.createRecord("post", {
+ topic,
+ id: 6,
+ post_number: 6,
+ via_email: true,
+ is_auto_generated: true,
+ }),
+ ];
+ },
+
+ test(assert) {
+ assert.dom(".post-stream").exists({ count: 1 });
+ assert.dom(".topic-post").exists({ count: 6 }, "renders all posts");
+
+ // look for special class bindings
+ assert
+ .dom(".topic-post:nth-of-type(1).topic-owner")
+ .exists({ count: 1 }, "applies the topic owner class");
+ assert
+ .dom(".topic-post:nth-of-type(1).group-trout")
+ .exists({ count: 1 }, "applies the primary group class");
+ assert
+ .dom(".topic-post:nth-of-type(1).regular")
+ .exists({ count: 1 }, "applies the regular class");
+ assert
+ .dom(".topic-post:nth-of-type(2).moderator")
+ .exists({ count: 1 }, "applies the moderator class");
+ assert
+ .dom(".topic-post:nth-of-type(3).post-hidden")
+ .exists({ count: 1 }, "applies the hidden class");
+ assert
+ .dom(".topic-post:nth-of-type(4).whisper")
+ .exists({ count: 1 }, "applies the whisper class");
+ assert
+ .dom(".topic-post:nth-of-type(5).wiki")
+ .exists({ count: 1 }, "applies the wiki class");
+
+ // it renders an article for the body with appropriate attributes
+ assert.dom("article#post_2").exists({ count: 1 });
+ assert.dom('article[data-user-id="123"]').exists({ count: 1 });
+ assert.dom('article[data-post-id="3"]').exists({ count: 1 });
+ assert.dom("article#post_5.via-email").exists({ count: 1 });
+ assert.dom("article#post_6.is-auto-generated").exists({ count: 1 });
+
+ assert
+ .dom("article:nth-of-type(1) .main-avatar")
+ .exists({ count: 1 }, "renders the main avatar");
+ },
+ });
+
+ postStreamTest("deleted posts", {
+ posts() {
+ const store = getOwner(this).lookup("service:store");
+ const topic = store.createRecord("topic");
+ topic.set("details.created_by", { id: 123 });
+
+ return [
+ store.createRecord("post", {
+ topic,
+ id: 1,
+ post_number: 1,
+ deleted_at: new Date().toString(),
+ }),
+ ];
+ },
+
+ test(assert) {
+ assert
+ .dom(".topic-post.deleted")
+ .exists({ count: 1 }, "applies the deleted class");
+ assert
+ .dom(".deleted-user-avatar")
+ .exists({ count: 1 }, "has the trash avatar");
+ },
+ });
+ }
+ );
+});
diff --git a/app/assets/javascripts/discourse/tests/integration/components/widgets/post-stream-test.js b/app/assets/javascripts/discourse/tests/integration/components/widgets/post-stream-test.js
deleted file mode 100644
index 30c7d65df51..00000000000
--- a/app/assets/javascripts/discourse/tests/integration/components/widgets/post-stream-test.js
+++ /dev/null
@@ -1,196 +0,0 @@
-import { getOwner } from "@ember/owner";
-import { render } from "@ember/test-helpers";
-import { hbs } from "ember-cli-htmlbars";
-import { module, test } from "qunit";
-import { withPluginApi } from "discourse/lib/plugin-api";
-import { setupRenderingTest } from "discourse/tests/helpers/component-test";
-import { resetPostMenuExtraButtons } from "discourse/widgets/post-menu";
-import { withSilencedDeprecations } from "discourse-common/lib/deprecated";
-
-function postStreamTest(name, attrs) {
- test(name, async function (assert) {
- this.set("posts", attrs.posts.call(this));
-
- await render(
- hbs``
- );
-
- attrs.test.call(this, assert);
- });
-}
-
-let lastTransformedPost = null;
-
-module("Integration | Component | Widget | post-stream", function (hooks) {
- setupRenderingTest(hooks);
-
- hooks.afterEach(function () {
- resetPostMenuExtraButtons();
- });
-
- postStreamTest("extensibility", {
- posts() {
- withPluginApi("0.14.0", (api) => {
- withSilencedDeprecations("discourse.post-menu-widget-overrides", () => {
- api.addPostMenuButton("coffee", (transformedPost) => {
- lastTransformedPost = transformedPost;
- return {
- action: "drinkCoffee",
- icon: "mug-saucer",
- className: "hot-coffee",
- title: "coffee.title",
- position: "first",
- };
- });
- });
- });
-
- const store = getOwner(this).lookup("service:store");
- const topic = store.createRecord("topic");
- topic.set("details.created_by", { id: 123 });
- topic.set("id", 1234);
-
- return [
- store.createRecord("post", {
- topic,
- id: 1,
- post_number: 1,
- user_id: 123,
- primary_group_name: "trout",
- avatar_template: "/images/avatar.png",
- }),
- ];
- },
-
- test(assert) {
- assert.dom(".post-stream").exists({ count: 1 });
- assert.dom(".topic-post").exists({ count: 1 }, "renders all posts");
- assert.notStrictEqual(lastTransformedPost, null, "it transforms posts");
- assert.strictEqual(
- lastTransformedPost.topic.id,
- 1234,
- "it also transforms the topic"
- );
- assert
- .dom(".actions .extra-buttons .hot-coffee")
- .exists({ count: 1 }, "has the extended button");
- },
- });
-
- postStreamTest("basics", {
- posts() {
- const site = getOwner(this).lookup("service:site");
- const store = getOwner(this).lookup("service:store");
- const topic = store.createRecord("topic");
- topic.set("details.created_by", { id: 123 });
-
- return [
- store.createRecord("post", {
- topic,
- id: 1,
- post_number: 1,
- user_id: 123,
- primary_group_name: "trout",
- avatar_template: "/images/avatar.png",
- }),
- store.createRecord("post", {
- topic,
- id: 2,
- post_number: 2,
- post_type: site.get("post_types.moderator_action"),
- }),
- store.createRecord("post", {
- topic,
- id: 3,
- post_number: 3,
- hidden: true,
- }),
- store.createRecord("post", {
- topic,
- id: 4,
- post_number: 4,
- post_type: site.get("post_types.whisper"),
- }),
- store.createRecord("post", {
- topic,
- id: 5,
- post_number: 5,
- wiki: true,
- via_email: true,
- }),
- store.createRecord("post", {
- topic,
- id: 6,
- post_number: 6,
- via_email: true,
- is_auto_generated: true,
- }),
- ];
- },
-
- test(assert) {
- assert.dom(".post-stream").exists({ count: 1 });
- assert.dom(".topic-post").exists({ count: 6 }, "renders all posts");
-
- // look for special class bindings
- assert
- .dom(".topic-post:nth-of-type(1).topic-owner")
- .exists({ count: 1 }, "applies the topic owner class");
- assert
- .dom(".topic-post:nth-of-type(1).group-trout")
- .exists({ count: 1 }, "applies the primary group class");
- assert
- .dom(".topic-post:nth-of-type(1).regular")
- .exists({ count: 1 }, "applies the regular class");
- assert
- .dom(".topic-post:nth-of-type(2).moderator")
- .exists({ count: 1 }, "applies the moderator class");
- assert
- .dom(".topic-post:nth-of-type(3).post-hidden")
- .exists({ count: 1 }, "applies the hidden class");
- assert
- .dom(".topic-post:nth-of-type(4).whisper")
- .exists({ count: 1 }, "applies the whisper class");
- assert
- .dom(".topic-post:nth-of-type(5).wiki")
- .exists({ count: 1 }, "applies the wiki class");
-
- // it renders an article for the body with appropriate attributes
- assert.dom("article#post_2").exists({ count: 1 });
- assert.dom('article[data-user-id="123"]').exists({ count: 1 });
- assert.dom('article[data-post-id="3"]').exists({ count: 1 });
- assert.dom("article#post_5.via-email").exists({ count: 1 });
- assert.dom("article#post_6.is-auto-generated").exists({ count: 1 });
-
- assert
- .dom("article:nth-of-type(1) .main-avatar")
- .exists({ count: 1 }, "renders the main avatar");
- },
- });
-
- postStreamTest("deleted posts", {
- posts() {
- const store = getOwner(this).lookup("service:store");
- const topic = store.createRecord("topic");
- topic.set("details.created_by", { id: 123 });
-
- return [
- store.createRecord("post", {
- topic,
- id: 1,
- post_number: 1,
- deleted_at: new Date().toString(),
- }),
- ];
- },
-
- test(assert) {
- assert
- .dom(".topic-post.deleted")
- .exists({ count: 1 }, "applies the deleted class");
- assert
- .dom(".deleted-user-avatar")
- .exists({ count: 1 }, "has the trash avatar");
- },
- });
-});