2022-12-22 21:35:18 +08:00
|
|
|
|
import { setupRenderingTest } from "discourse/tests/helpers/component-test";
|
2023-05-09 19:25:33 +08:00
|
|
|
|
import { query } from "discourse/tests/helpers/qunit-helpers";
|
2022-11-02 21:41:30 +08:00
|
|
|
|
import hbs from "htmlbars-inline-precompile";
|
2023-05-17 23:49:52 +08:00
|
|
|
|
import fabricators from "discourse/plugins/chat/discourse/lib/fabricators";
|
2022-12-22 21:35:18 +08:00
|
|
|
|
import { module, test } from "qunit";
|
2023-05-09 19:25:33 +08:00
|
|
|
|
import { render } from "@ember/test-helpers";
|
2023-05-11 14:02:04 +08:00
|
|
|
|
import {
|
|
|
|
|
joinChannel,
|
|
|
|
|
leaveChannel,
|
|
|
|
|
} from "discourse/tests/helpers/presence-pretender";
|
2022-11-02 21:41:30 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
async function addUser(id, username, channelName = "/chat-reply/1") {
|
|
|
|
|
await joinChannel(channelName, {
|
2023-05-09 19:25:33 +08:00
|
|
|
|
id,
|
|
|
|
|
avatar_template: "/images/avatar.png",
|
|
|
|
|
username,
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
async function removeUser(id, channelName = "/chat-reply/1") {
|
|
|
|
|
await leaveChannel(channelName, {
|
|
|
|
|
id,
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
2022-11-02 21:41:30 +08:00
|
|
|
|
module(
|
|
|
|
|
"Discourse Chat | Component | chat-replying-indicator",
|
|
|
|
|
function (hooks) {
|
|
|
|
|
setupRenderingTest(hooks);
|
|
|
|
|
|
2022-12-22 21:35:18 +08:00
|
|
|
|
test("not displayed when no one is replying", async function (assert) {
|
2023-05-11 14:02:04 +08:00
|
|
|
|
await render(
|
|
|
|
|
hbs`<ChatReplyingIndicator @presenceChannelName="/chat-reply/1" />`
|
|
|
|
|
);
|
2022-11-02 21:41:30 +08:00
|
|
|
|
|
2023-05-09 19:25:33 +08:00
|
|
|
|
assert.dom(".chat-replying-indicator__text").doesNotExist();
|
2022-11-02 21:41:30 +08:00
|
|
|
|
});
|
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
test("working for thread", async function (assert) {
|
|
|
|
|
await render(
|
|
|
|
|
hbs`<ChatReplyingIndicator @presenceChannelName="/chat-reply/1/thread/1" />`
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
await addUser(1, "sam", "/chat-reply/1/thread/1");
|
|
|
|
|
|
|
|
|
|
assert.strictEqual(
|
|
|
|
|
query(".chat-replying-indicator__text").innerText,
|
|
|
|
|
"sam is typing"
|
|
|
|
|
);
|
|
|
|
|
});
|
2022-12-22 21:35:18 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
test("doesn’t leak in other indicators", async function (assert) {
|
|
|
|
|
await render(
|
|
|
|
|
hbs`
|
|
|
|
|
<div class="channel"><ChatReplyingIndicator @presenceChannelName="/chat-reply/1" /></div>
|
|
|
|
|
<div class="thread"><ChatReplyingIndicator @presenceChannelName="/chat-reply/1/thread/1" /></div>
|
|
|
|
|
`
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
await addUser(1, "sam");
|
|
|
|
|
|
|
|
|
|
assert
|
|
|
|
|
.dom(".channel .chat-replying-indicator__text")
|
|
|
|
|
.hasText("sam is typing");
|
|
|
|
|
assert.dom(".thread .chat-replying-indicator__text").doesNotExist();
|
|
|
|
|
|
|
|
|
|
await addUser(2, "mark", "/chat-reply/1/thread/1");
|
|
|
|
|
await removeUser(1);
|
|
|
|
|
|
|
|
|
|
assert.dom(".channel .chat-replying-indicator__text").doesNotExist();
|
|
|
|
|
assert
|
|
|
|
|
.dom(".thread .chat-replying-indicator__text")
|
|
|
|
|
.hasText("mark is typing");
|
|
|
|
|
});
|
2022-12-22 21:35:18 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
test("displays indicator when user is replying", async function (assert) {
|
|
|
|
|
await render(
|
|
|
|
|
hbs`<ChatReplyingIndicator @presenceChannelName="/chat-reply/1" />`
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
await addUser(1, "sam");
|
2022-12-22 21:35:18 +08:00
|
|
|
|
|
|
|
|
|
assert.strictEqual(
|
|
|
|
|
query(".chat-replying-indicator__text").innerText,
|
2023-05-09 00:24:41 +08:00
|
|
|
|
`sam is typing`
|
2022-12-22 21:35:18 +08:00
|
|
|
|
);
|
2022-11-02 21:41:30 +08:00
|
|
|
|
});
|
|
|
|
|
|
2022-12-22 21:35:18 +08:00
|
|
|
|
test("displays indicator when 2 or 3 users are replying", async function (assert) {
|
2023-05-17 23:49:52 +08:00
|
|
|
|
this.channel = fabricators.channel();
|
2022-12-22 21:35:18 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
await render(
|
|
|
|
|
hbs`<ChatReplyingIndicator @presenceChannelName="/chat-reply/1" />`
|
|
|
|
|
);
|
2022-12-22 21:35:18 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
await addUser(1, "sam");
|
|
|
|
|
await addUser(2, "mark");
|
2022-12-22 21:35:18 +08:00
|
|
|
|
|
2023-05-09 19:25:33 +08:00
|
|
|
|
assert
|
|
|
|
|
.dom(".chat-replying-indicator__text")
|
|
|
|
|
.hasText("sam and mark are typing");
|
2022-11-02 21:41:30 +08:00
|
|
|
|
});
|
|
|
|
|
|
2022-12-22 21:35:18 +08:00
|
|
|
|
test("displays indicator when 3 users are replying", async function (assert) {
|
2023-05-17 23:49:52 +08:00
|
|
|
|
this.channel = fabricators.channel();
|
2022-12-22 21:35:18 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
await render(
|
|
|
|
|
hbs`<ChatReplyingIndicator @presenceChannelName="/chat-reply/1" />`
|
|
|
|
|
);
|
2023-05-09 00:24:41 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
await addUser(1, "sam");
|
|
|
|
|
await addUser(2, "mark");
|
|
|
|
|
await addUser(3, "joffrey");
|
2022-12-22 21:35:18 +08:00
|
|
|
|
|
2023-05-09 19:25:33 +08:00
|
|
|
|
assert
|
|
|
|
|
.dom(".chat-replying-indicator__text")
|
|
|
|
|
.hasText("sam, mark and joffrey are typing");
|
2022-11-02 21:41:30 +08:00
|
|
|
|
});
|
|
|
|
|
|
2022-12-22 21:35:18 +08:00
|
|
|
|
test("displays indicator when more than 3 users are replying", async function (assert) {
|
2023-05-17 23:49:52 +08:00
|
|
|
|
this.channel = fabricators.channel();
|
2023-05-09 00:24:41 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
await render(
|
|
|
|
|
hbs`<ChatReplyingIndicator @presenceChannelName="/chat-reply/1" />`
|
|
|
|
|
);
|
2023-05-09 00:24:41 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
await addUser(1, "sam");
|
|
|
|
|
await addUser(2, "mark");
|
|
|
|
|
await addUser(3, "joffrey");
|
|
|
|
|
await addUser(4, "taylor");
|
2022-12-22 21:35:18 +08:00
|
|
|
|
|
2023-05-09 19:25:33 +08:00
|
|
|
|
assert
|
|
|
|
|
.dom(".chat-replying-indicator__text")
|
|
|
|
|
.hasText("sam, mark and 2 others are typing");
|
2022-11-02 21:41:30 +08:00
|
|
|
|
});
|
|
|
|
|
|
2022-12-22 21:35:18 +08:00
|
|
|
|
test("filters current user from list of repliers", async function (assert) {
|
2023-05-17 23:49:52 +08:00
|
|
|
|
this.channel = fabricators.channel();
|
2022-12-22 21:35:18 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
await render(
|
|
|
|
|
hbs`<ChatReplyingIndicator @presenceChannelName="/chat-reply/1" />`
|
|
|
|
|
);
|
2022-12-22 21:35:18 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
await addUser(1, "sam");
|
|
|
|
|
await addUser(this.currentUser.id, this.currentUser.username);
|
2022-12-22 21:35:18 +08:00
|
|
|
|
|
2023-05-09 19:25:33 +08:00
|
|
|
|
assert.dom(".chat-replying-indicator__text").hasText("sam is typing");
|
2022-12-22 21:35:18 +08:00
|
|
|
|
});
|
2022-11-02 21:41:30 +08:00
|
|
|
|
|
2023-05-09 19:25:33 +08:00
|
|
|
|
test("resets presence when channel changes", async function (assert) {
|
2023-05-11 14:02:04 +08:00
|
|
|
|
this.set("presenceChannelName", "/chat-reply/1");
|
2022-11-02 21:41:30 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
await addUser(1, "sam");
|
2023-05-09 00:24:41 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
await render(
|
|
|
|
|
hbs`<ChatReplyingIndicator @presenceChannelName={{this.presenceChannelName}} />`
|
|
|
|
|
);
|
2023-05-09 00:24:41 +08:00
|
|
|
|
|
2023-05-09 19:25:33 +08:00
|
|
|
|
assert.dom(".chat-replying-indicator__text").hasText("sam is typing");
|
2022-11-02 21:41:30 +08:00
|
|
|
|
|
2023-05-11 14:02:04 +08:00
|
|
|
|
this.set("presenceChannelName", "/chat-reply/2");
|
2022-11-02 21:41:30 +08:00
|
|
|
|
|
2023-05-09 19:25:33 +08:00
|
|
|
|
assert.dom(".chat-replying-indicator__text").doesNotExist();
|
2022-11-02 21:41:30 +08:00
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
);
|