paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-02 13:03:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

compose_validate test: Use FakeComposeBox for size limits.

Browse Source 
This commit simplifies a compose_validate test by
using FakeComposeBox.

It also exposes $send_message_form to the callers.
(The general idea here is that for any individual
test, we don't want the developer to have to
switch between thinking about low-level zjquery
idioms and higher-level abstractions.)

This commit also removes the use of mock_template,
since the template in question generates trivially
easy html to deal with (and we verify the actual
effects to the DOM).
This commit is contained in:
Steve Howell
2025-01-08 11:46:13 +00:00
committed by Tim Abbott
parent a3c76646b2
commit a1217fbc5a
2 changed files with 52 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
web/tests/compose_validate.test.cjs
View File

@@ -553,42 +553,31 @@ test_ui("test_stream_posting_permission", ({mock_template, override}) => {
assert.ok(!banner_rendered);
});
test_ui("test_check_overflow_text", ({mock_template, override}) => {
test_ui("test_check_overflow_text", ({override}) => {
const fake_compose_box = new FakeComposeBox();
override(realm, "max_message_length", 10000);
const $elem = $("#send_message_form");
const $textarea = $(".message-textarea");
const $indicator = $(".message-limit-indicator");
stub_message_row($textarea);
$elem.set_find_results(".message-textarea", $textarea);
$elem.set_find_results(".message-limit-indicator", $indicator);
// RED
{
fake_compose_box.set_textarea_val("a".repeat(10005));
compose_validate.check_overflow_text(fake_compose_box.$send_message_form);
fake_compose_box.assert_message_size_is_over_the_limit("-5\n");
}
// Indicator should show red colored text
let limit_indicator_html;
mock_template("compose_limit_indicator.hbs", true, (_data, html) => {
limit_indicator_html = html;
});
$textarea.val("a".repeat(10000 + 1));
compose_validate.check_overflow_text($elem);
assert.ok($indicator.hasClass("textarea-over-limit"));
assert.equal(limit_indicator_html, "-1\n");
assert.ok($textarea.hasClass("textarea-over-limit"));
assert.ok($(".message-send-controls").hasClass("disabled-message-send-controls"));
// ORANGE
{
fake_compose_box.set_textarea_val("a".repeat(9100));
compose_validate.check_overflow_text(fake_compose_box.$send_message_form);
fake_compose_box.assert_message_size_is_under_the_limit("900\n");
}
// Indicator should show orange colored text
$textarea.val("a".repeat(9100));
compose_validate.check_overflow_text($elem);
assert.ok(!$indicator.hasClass("textarea-over-limit"));
assert.equal(limit_indicator_html, "900\n");
assert.ok(!$textarea.hasClass("textarea-over-limit"));
assert.ok(!$(".message-send-controls").hasClass("disabled-message-send-controls"));
// Indicator must be empty
$textarea.val("a".repeat(9100 - 1));
compose_validate.check_overflow_text($elem);
assert.ok(!$indicator.hasClass("textarea-over-limit"));
assert.equal($indicator.text(), "");
assert.ok(!$textarea.hasClass("textarea-over-limit"));
// ALL CLEAR
{
fake_compose_box.set_textarea_val("a".repeat(9100 - 1));
compose_validate.check_overflow_text(fake_compose_box.$send_message_form);
fake_compose_box.assert_message_size_is_under_the_limit();
}
});
test_ui("needs_subscribe_warning", () => {

34
web/tests/lib/compose_helpers.cjs
View File

@@ -7,15 +7,16 @@ const $ = require("./zjquery.cjs");
class FakeComposeBox {
constructor() {
this.$send_message_form = $("#send_message_form");
this.$content_textarea = $("textarea#compose-textarea");
this.$preview_message_area = $("#compose .preview_message_area");
// Simulate DOM relationships
$("#send_message_form").set_find_results(".message-textarea", this.$content_textarea);
this.$send_message_form.set_find_results(".message-textarea", this.$content_textarea);
$("#send_message_form").set_find_results(
this.$send_message_form.set_find_results(
".message-limit-indicator",
$.create("limit-indicator-stub"),
$(".message-limit-indicator"),
);
const $message_row_stub = $.create("message_row_stub");
@@ -29,6 +30,9 @@ class FakeComposeBox {
}
reset() {
$(".message-limit-indicator").html("");
$(".message-limit-indicator").text("");
$("#compose_banners .user_not_subscribed").length = 0;
this.$content_textarea.toggleClass = noop;
@@ -135,6 +139,30 @@ class FakeComposeBox {
assert.ok($("#compose .undo_markdown_preview").visible());
assert.ok($("#compose").hasClass("preview_mode"));
}
assert_message_size_is_over_the_limit(desired_html) {
// Indicator should show red colored text
assert.equal($(".message-limit-indicator").html(), desired_html);
assert.ok(this.$content_textarea.hasClass("textarea-over-limit"));
assert.ok($(".message-limit-indicator").hasClass("textarea-over-limit"));
assert.ok($(".message-send-controls").hasClass("disabled-message-send-controls"));
}
assert_message_size_is_under_the_limit(desired_html) {
// Work around the quirk that our validation code
// arbitrarily switches between html() and text(),
// and zjquery doesn't unify text and html.
if (desired_html) {
assert.equal($(".message-limit-indicator").html(), desired_html);
} else {
assert.equal($(".message-limit-indicator").text(), "");
}
assert.ok(!this.$content_textarea.hasClass("textarea-over-limit"));
assert.ok(!$(".message-limit-indicator").hasClass("textarea-over-limit"));
assert.ok(!$(".message-send-controls").hasClass("disabled-message-send-controls"));
}
}
module.exports = {FakeComposeBox};