discourse/plugins/chat/test/javascripts/components/chat-message-info-test.js
Joffrey JAFFEUX 6b0aeced7e
DEV: rework the chat-live-pane (#20519)
This PR is introducing glimmer usage in the chat-live-pane, for components but also for models. RestModel usage has been dropped in favor of native classes.

Other changes/additions in this PR:

sticky dates, scrolling will now keep the date separator of the current section at the top of the screen
better unread management, marking a channel as unread will correctly mark the correct message and not mark the whole channel as read. Tracking state will also now correctly return unread count and unread mentions.
adds an animation on bottom arrow
better scrolling behavior, we should now always correctly keep the scroll position while loading more
reactions are now more reactive, and will update their tooltip without needed to close/reopen it
skeleton has been improved with placeholder images and reactions
when making a reaction on the desktop message actions, the menu won't move anymore
simplify logic and stop maintaining a list of unloaded messages
2023-03-03 13:09:25 +01:00

155 lines
5.0 KiB
JavaScript

import Bookmark from "discourse/models/bookmark";
import { setupRenderingTest } from "discourse/tests/helpers/component-test";
import hbs from "htmlbars-inline-precompile";
import { exists, query } from "discourse/tests/helpers/qunit-helpers";
import I18n from "I18n";
import { module, test } from "qunit";
import { render } from "@ember/test-helpers";
import ChatMessage from "discourse/plugins/chat/discourse/models/chat-message";
import fabricators from "../helpers/fabricators";
module("Discourse Chat | Component | chat-message-info", function (hooks) {
setupRenderingTest(hooks);
test("chat_webhook_event", async function (assert) {
this.message = ChatMessage.create(fabricators.chatChannel(), {
chat_webhook_event: { username: "discobot" },
});
await render(hbs`<ChatMessageInfo @message={{this.message}} />`);
assert.strictEqual(
query(".chat-message-info__username").innerText.trim(),
this.message.chatWebhookEvent.username
);
assert.strictEqual(
query(".chat-message-info__bot-indicator").textContent.trim(),
I18n.t("chat.bot")
);
});
test("user", async function (assert) {
this.message = ChatMessage.create(fabricators.chatChannel(), {
user: { username: "discobot" },
});
await render(hbs`<ChatMessageInfo @message={{this.message}} />`);
assert.strictEqual(
query(".chat-message-info__username").innerText.trim(),
this.message.user.username
);
});
test("date", async function (assert) {
this.message = ChatMessage.create(fabricators.chatChannel(), {
user: { username: "discobot" },
created_at: moment(),
});
await render(hbs`<ChatMessageInfo @message={{this.message}} />`);
assert.true(exists(".chat-message-info__date"));
});
test("bookmark (with reminder)", async function (assert) {
this.message = ChatMessage.create(fabricators.chatChannel(), {
user: { username: "discobot" },
bookmark: Bookmark.create({
reminder_at: moment(),
name: "some name",
}),
});
await render(hbs`<ChatMessageInfo @message={{this.message}} />`);
assert.true(
exists(".chat-message-info__bookmark .d-icon-discourse-bookmark-clock")
);
});
test("bookmark (no reminder)", async function (assert) {
this.message = ChatMessage.create(fabricators.chatChannel(), {
user: { username: "discobot" },
bookmark: Bookmark.create({
name: "some name",
}),
});
await render(hbs`<ChatMessageInfo @message={{this.message}} />`);
assert.true(exists(".chat-message-info__bookmark .d-icon-bookmark"));
});
test("user status", async function (assert) {
const status = { description: "off to dentist", emoji: "tooth" };
this.message = ChatMessage.create(fabricators.chatChannel(), {
user: { status },
});
await render(hbs`<ChatMessageInfo @message={{this.message}} />`);
assert.true(exists(".chat-message-info__status .user-status-message"));
});
test("reviewable", async function (assert) {
this.message = ChatMessage.create(fabricators.chatChannel(), {
user: { username: "discobot" },
user_flag_status: 0,
});
await render(hbs`<ChatMessageInfo @message={{this.message}} />`);
assert.strictEqual(
query(".chat-message-info__flag > .svg-icon-title").title,
I18n.t("chat.you_flagged")
);
this.message = ChatMessage.create(fabricators.chatChannel(), {
user: { username: "discobot" },
reviewable_id: 1,
});
await render(hbs`<ChatMessageInfo @message={{this.message}} />`);
assert.strictEqual(
query(".chat-message-info__flag a .svg-icon-title").title,
I18n.t("chat.flagged")
);
});
test("with username classes", async function (assert) {
this.message = ChatMessage.create(fabricators.chatChannel(), {
user: {
username: "discobot",
admin: true,
moderator: true,
new_user: true,
primary_group_name: "foo",
},
});
await render(hbs`<ChatMessageInfo @message={{this.message}} />`);
assert.dom(".chat-message-info__username.is-staff").exists();
assert.dom(".chat-message-info__username.is-admin").exists();
assert.dom(".chat-message-info__username.is-moderator").exists();
assert.dom(".chat-message-info__username.is-new-user").exists();
assert.dom(".chat-message-info__username.group--foo").exists();
});
test("without username classes", async function (assert) {
this.message = ChatMessage.create(fabricators.chatChannel(), {
user: { username: "discobot" },
});
await render(hbs`<ChatMessageInfo @message={{this.message}} />`);
assert.dom(".chat-message-info__username.is-staff").doesNotExist();
assert.dom(".chat-message-info__username.is-admin").doesNotExist();
assert.dom(".chat-message-info__username.is-moderator").doesNotExist();
assert.dom(".chat-message-info__username.is-new-user").doesNotExist();
assert.dom(".chat-message-info__username.group--foo").doesNotExist();
});
});