mirror of
https://github.com/discourse/discourse.git
synced 2025-04-30 02:44:36 +08:00
67c0498f64
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
67 lines
2.2 KiB
JavaScript
67 lines
2.2 KiB
JavaScript
import { setupRenderingTest } from "discourse/tests/helpers/component-test";
|
|
import { click, render } from "@ember/test-helpers";
|
|
import { exists, query } from "discourse/tests/helpers/qunit-helpers";
|
|
import hbs from "htmlbars-inline-precompile";
|
|
import { module, test } from "qunit";
|
|
|
|
module("Discourse Chat | Component | chat-message-reaction", function (hooks) {
|
|
setupRenderingTest(hooks);
|
|
|
|
test("adds reacted class when user reacted", async function (assert) {
|
|
await render(hbs`
|
|
<ChatMessageReaction @reaction={{hash emoji="heart" reacted=true}} />
|
|
`);
|
|
|
|
assert.true(exists(".chat-message-reaction.reacted"));
|
|
});
|
|
|
|
test("adds reaction name as class", async function (assert) {
|
|
await render(hbs`<ChatMessageReaction @reaction={{hash emoji="heart"}} />`);
|
|
|
|
assert.true(exists(`.chat-message-reaction[data-emoji-name="heart"]`));
|
|
});
|
|
|
|
test("title/alt attributes", async function (assert) {
|
|
await render(hbs`<ChatMessageReaction @reaction={{hash emoji="heart"}} />`);
|
|
|
|
assert.strictEqual(query(".chat-message-reaction").title, ":heart:");
|
|
assert.strictEqual(query(".chat-message-reaction img").alt, ":heart:");
|
|
});
|
|
|
|
test("count of reactions", async function (assert) {
|
|
this.set("count", 0);
|
|
|
|
await render(hbs`
|
|
<ChatMessageReaction @reaction={{hash emoji="heart" count=this.count}} />
|
|
`);
|
|
|
|
assert.false(exists(".chat-message-reaction .count"));
|
|
|
|
this.set("count", 2);
|
|
assert.strictEqual(query(".chat-message-reaction .count").innerText, "2");
|
|
});
|
|
|
|
test("reaction’s image", async function (assert) {
|
|
await render(hbs`<ChatMessageReaction @reaction={{hash emoji="heart"}} />`);
|
|
|
|
const src = query(".chat-message-reaction img").src;
|
|
assert.true(/heart\.png/.test(src));
|
|
});
|
|
|
|
test("click action", async function (assert) {
|
|
this.set("count", 0);
|
|
this.set("react", () => {
|
|
this.set("count", 1);
|
|
});
|
|
|
|
await render(hbs`
|
|
<ChatMessageReaction class="show" @reaction={{hash emoji="heart" count=this.count}} @react={{this.react}} />
|
|
`);
|
|
|
|
assert.false(exists(".chat-message-reaction .count"));
|
|
|
|
await click(".chat-message-reaction");
|
|
assert.strictEqual(query(".chat-message-reaction .count").innerText, "1");
|
|
});
|
|
});
|