drafts: Remove classes that had the same effect.

In commit 5edc8fc, abstract classes were added to the
drafts overlay, but the classes that were already there
were not removed. This resulted in the same styles being
applied twice.
This commit is contained in:
Satyam Bansal 2023-06-10 01:23:24 +05:30 committed by Tim Abbott
parent 28ba839857
commit 0f0c52e096
7 changed files with 44 additions and 41 deletions

View File

@ -13,7 +13,7 @@ async function wait_for_drafts_to_appear(page: Page): Promise<void> {
} }
async function get_drafts_count(page: Page): Promise<number> { async function get_drafts_count(page: Page): Promise<number> {
return await page.$$eval(".draft-row", (drafts) => drafts.length); return await page.$$eval("#drafts_table .overlay-message-row", (drafts) => drafts.length);
} }
const drafts_button = ".top_left_drafts"; const drafts_button = ".top_left_drafts";
@ -76,35 +76,35 @@ async function test_previously_created_drafts_rendered(page: Page): Promise<void
assert.strictEqual( assert.strictEqual(
await common.get_text_from_selector( await common.get_text_from_selector(
page, page,
".draft-row .message_header_stream .stream_label", "#drafts_table .overlay-message-row .message_header_stream .stream_label",
), ),
"Denmark", "Denmark",
); );
assert.strictEqual( assert.strictEqual(
await common.get_text_from_selector( await common.get_text_from_selector(
page, page,
".draft-row .message_header_stream .stream_topic", "#drafts_table .overlay-message-row .message_header_stream .stream_topic",
), ),
"tests", "tests",
); );
assert.strictEqual( assert.strictEqual(
await common.get_text_from_selector( await common.get_text_from_selector(
page, page,
".draft-row:nth-last-child(2) .rendered_markdown.restore-draft", "#drafts_table .overlay-message-row:nth-last-child(2) .rendered_markdown.restore-overlay-message",
), ),
"Test direct message.", "Test direct message.",
); );
assert.strictEqual( assert.strictEqual(
await common.get_text_from_selector( await common.get_text_from_selector(
page, page,
".draft-row .message_header_private_message .stream_label", "#drafts_table .overlay-message-row .message_header_private_message .stream_label",
), ),
"You and Cordelia, Lear's daughter, King Hamlet", "You and Cordelia, Lear's daughter, King Hamlet",
); );
assert.strictEqual( assert.strictEqual(
await common.get_text_from_selector( await common.get_text_from_selector(
page, page,
".draft-row:last-child .rendered_markdown.restore-draft", "#drafts_table .overlay-message-row:last-child .rendered_markdown.restore-overlay-message",
), ),
"Test stream message.", "Test stream message.",
); );
@ -112,7 +112,7 @@ async function test_previously_created_drafts_rendered(page: Page): Promise<void
async function test_restore_message_draft_via_draft_overlay(page: Page): Promise<void> { async function test_restore_message_draft_via_draft_overlay(page: Page): Promise<void> {
console.log("Restoring stream message draft"); console.log("Restoring stream message draft");
await page.click("#drafts_table .message_row:not(.private-message) .restore-draft"); await page.click("#drafts_table .message_row:not(.private-message) .restore-overlay-message");
await wait_for_drafts_to_disappear(page); await wait_for_drafts_to_disappear(page);
await page.waitForSelector("#stream_message_recipient_topic", {visible: true}); await page.waitForSelector("#stream_message_recipient_topic", {visible: true});
await page.waitForSelector("#preview_message_area", {hidden: true}); await page.waitForSelector("#preview_message_area", {hidden: true});
@ -145,21 +145,21 @@ async function test_edited_draft_message(page: Page): Promise<void> {
assert.strictEqual( assert.strictEqual(
await common.get_text_from_selector( await common.get_text_from_selector(
page, page,
".draft-row .message_header_stream .stream_label", "#drafts_table .overlay-message-row .message_header_stream .stream_label",
), ),
"Denmark", "Denmark",
); );
assert.strictEqual( assert.strictEqual(
await common.get_text_from_selector( await common.get_text_from_selector(
page, page,
".draft-row .message_header_stream .stream_topic", "#drafts_table .overlay-message-row .message_header_stream .stream_topic",
), ),
"tests", "tests",
); );
assert.strictEqual( assert.strictEqual(
await common.get_text_from_selector( await common.get_text_from_selector(
page, page,
".draft-row .message_row:not(.private-message) .rendered_markdown.restore-draft", "#drafts_table .overlay-message-row .message_row:not(.private-message) .rendered_markdown.restore-overlay-message",
), ),
"Updated stream message", "Updated stream message",
); );
@ -167,7 +167,7 @@ async function test_edited_draft_message(page: Page): Promise<void> {
async function test_restore_private_message_draft_via_draft_overlay(page: Page): Promise<void> { async function test_restore_private_message_draft_via_draft_overlay(page: Page): Promise<void> {
console.log("Restoring direct message draft."); console.log("Restoring direct message draft.");
await page.click(".message_row.private-message .restore-draft"); await page.click(".message_row.private-message .restore-overlay-message");
await wait_for_drafts_to_disappear(page); await wait_for_drafts_to_disappear(page);
await page.waitForSelector("#compose-direct-recipient", {visible: true}); await page.waitForSelector("#compose-direct-recipient", {visible: true});
await common.check_compose_state(page, { await common.check_compose_state(page, {
@ -189,7 +189,7 @@ async function test_delete_draft(page: Page): Promise<void> {
await page.waitForSelector(drafts_button, {visible: true}); await page.waitForSelector(drafts_button, {visible: true});
await page.click(drafts_button); await page.click(drafts_button);
await wait_for_drafts_to_appear(page); await wait_for_drafts_to_appear(page);
await page.click("#drafts_table .message_row.private-message .delete-draft"); await page.click("#drafts_table .message_row.private-message .delete-overlay-message");
const drafts_count = await get_drafts_count(page); const drafts_count = await get_drafts_count(page);
assert.strictEqual(drafts_count, 1, "Draft not deleted."); assert.strictEqual(drafts_count, 1, "Draft not deleted.");
await page.waitForSelector("#drafts_table .message_row.private-message", {hidden: true}); await page.waitForSelector("#drafts_table .message_row.private-message", {hidden: true});
@ -223,14 +223,14 @@ async function test_save_draft_by_reloading(page: Page): Promise<void> {
assert.strictEqual( assert.strictEqual(
await common.get_text_from_selector( await common.get_text_from_selector(
page, page,
".draft-row .message_header_private_message .stream_label", "#drafts_table .overlay-message-row .message_header_private_message .stream_label",
), ),
"You and Cordelia, Lear's daughter", "You and Cordelia, Lear's daughter",
); );
assert.strictEqual( assert.strictEqual(
await common.get_text_from_selector( await common.get_text_from_selector(
page, page,
".draft-row:nth-last-child(2) .rendered_markdown.restore-draft", "#drafts_table .overlay-message-row:nth-last-child(2) .rendered_markdown.restore-overlay-message",
), ),
"Test direct message draft.", "Test direct message draft.",
); );

View File

@ -427,12 +427,12 @@ function remove_draft($draft_row) {
$draft_row.remove(); $draft_row.remove();
if ($("#drafts_table .draft-row").length === 0) { if ($("#drafts_table .overlay-message-row").length === 0) {
$("#drafts_table .no-drafts").show(); $("#drafts_table .no-drafts").show();
} }
update_rendered_drafts( update_rendered_drafts(
$("#drafts-from-conversation .draft-row").length > 0, $("#drafts-from-conversation .overlay-message-row").length > 0,
$("#other-drafts .draft-row").length > 0, $("#other-drafts .overlay-message-row").length > 0,
); );
} }
@ -551,8 +551,8 @@ const keyboard_handling_context = {
}, },
items_container_selector: "drafts-container", items_container_selector: "drafts-container",
items_list_selector: "drafts-list", items_list_selector: "drafts-list",
row_item_selector: "draft-row", row_item_selector: "overlay-message-row",
box_item_selector: "draft-info-box", box_item_selector: "overlay-message-info-box",
id_attribute_name: "data-draft-id", id_attribute_name: "data-draft-id",
}; };
@ -606,11 +606,11 @@ export function launch() {
}); });
const $drafts_table = $("#drafts_table"); const $drafts_table = $("#drafts_table");
$drafts_table.append(rendered); $drafts_table.append(rendered);
if ($("#drafts_table .draft-row").length > 0) { if ($("#drafts_table .overlay-message-row").length > 0) {
$("#drafts_table .no-drafts").hide(); $("#drafts_table .no-drafts").hide();
// Update possible dynamic elements. // Update possible dynamic elements.
const $rendered_drafts = $drafts_table.find( const $rendered_drafts = $drafts_table.find(
".message_content.rendered_markdown.restore-draft", ".message_content.rendered_markdown.restore-overlay-message",
); );
$rendered_drafts.each(function () { $rendered_drafts.each(function () {
rendered_markdown.update_elements($(this)); rendered_markdown.update_elements($(this));
@ -620,23 +620,26 @@ export function launch() {
} }
function setup_event_handlers() { function setup_event_handlers() {
$(".restore-draft").on("click", function (e) { $("#drafts_table .restore-overlay-message").on("click", function (e) {
if (document.getSelection().type === "Range") { if (document.getSelection().type === "Range") {
return; return;
} }
e.stopPropagation(); e.stopPropagation();
const $draft_row = $(this).closest(".draft-row"); const $draft_row = $(this).closest(".overlay-message-row");
const $draft_id = $draft_row.data("draft-id"); const $draft_id = $draft_row.data("draft-id");
restore_draft($draft_id); restore_draft($draft_id);
}); });
$(".draft_controls .delete-draft").on("click", function () { $("#drafts_table .overlay_message_controls .delete-overlay-message").on(
const $draft_row = $(this).closest(".draft-row"); "click",
function () {
const $draft_row = $(this).closest(".overlay-message-row");
remove_draft($draft_row); remove_draft($draft_row);
}); },
);
} }
const drafts = draft_model.get(); const drafts = draft_model.get();
@ -685,7 +688,7 @@ export function initialize() {
set_count(Object.keys(draft_model.get()).length); set_count(Object.keys(draft_model.get()).length);
$("body").on("focus", ".draft-info-box", (e) => { $("body").on("focus", "#drafts_table .overlay-message-info-box", (e) => {
messages_overlay_ui.activate_element(e.target, keyboard_handling_context); messages_overlay_ui.activate_element(e.target, keyboard_handling_context);
}); });
} }

View File

@ -89,7 +89,7 @@ function row_before_focus(context: Context): JQuery {
$focused_row.parent().attr("id") === "other-drafts" && $focused_row.parent().attr("id") === "other-drafts" &&
$("#drafts-from-conversation").is(":visible") $("#drafts-from-conversation").is(":visible")
) { ) {
return $($("#drafts-from-conversation").children(".draft-row:visible").last()); return $($("#drafts-from-conversation").children(".overlay-message-row:visible").last());
} }
return $prev_row; return $prev_row;
@ -106,7 +106,7 @@ function row_after_focus(context: Context): JQuery {
$focused_row.parent().attr("id") === "drafts-from-conversation" && $focused_row.parent().attr("id") === "drafts-from-conversation" &&
$("#other-drafts").is(":visible") $("#other-drafts").is(":visible")
) { ) {
return $("#other-drafts").children(".draft-row:visible").first(); return $("#other-drafts").children(".overlay-message-row:visible").first();
} }
return $next_row; return $next_row;
} }

View File

@ -71,7 +71,7 @@ export function visible_range(start_id, end_id) {
} }
export function is_draft_row($row) { export function is_draft_row($row) {
return $row.find(".restore-draft").length >= 1; return $row.find("#drafts_table .restore-overlay-message").length >= 1;
} }
export function id($message_row) { export function id($message_row) {

View File

@ -612,7 +612,7 @@
#compose-content, #compose-content,
.message_list .recipient_row, .message_list .recipient_row,
.message_row, .message_row,
.draft-row .draft-info-box, .overlay-message-row .overlay-message-info-box,
.preview_message_area { .preview_message_area {
border-color: hsl(0deg 0% 0% / 40%); border-color: hsl(0deg 0% 0% / 40%);
} }

View File

@ -1,5 +1,5 @@
<div class="draft-row overlay-message-row" data-draft-id="{{draft_id}}"> <div class="overlay-message-row" data-draft-id="{{draft_id}}">
<div class="draft-info-box overlay-message-info-box" tabindex="0"> <div class="overlay-message-info-box" tabindex="0">
{{#if is_stream}} {{#if is_stream}}
<div class="message_header message_header_stream"> <div class="message_header message_header_stream">
<div class="message-header-contents" style="background: {{recipient_bar_color}};"> <div class="message-header-contents" style="background: {{recipient_bar_color}};">
@ -34,12 +34,12 @@
<div class="messagebox"> <div class="messagebox">
<div class="messagebox-content"> <div class="messagebox-content">
<div class="message_top_line"> <div class="message_top_line">
<div class="draft_controls overlay_message_controls"> <div class="overlay_message_controls">
<i class="fa fa-pencil fa-lg restore-draft restore-overlay-message tippy-zulip-tooltip" aria-hidden="true" data-tooltip-template-id="restore-draft-tooltip-template"></i> <i class="fa fa-pencil fa-lg restore-overlay-message tippy-zulip-tooltip" aria-hidden="true" data-tooltip-template-id="restore-draft-tooltip-template"></i>
<i class="fa fa-trash-o fa-lg delete-draft delete-overlay-message tippy-zulip-tooltip" aria-hidden="true" data-tooltip-template-id="delete-draft-tooltip-template"></i> <i class="fa fa-trash-o fa-lg delete-overlay-message tippy-zulip-tooltip" aria-hidden="true" data-tooltip-template-id="delete-draft-tooltip-template"></i>
</div> </div>
</div> </div>
<div class="message_content rendered_markdown restore-draft restore-overlay-message tippy-zulip-delayed-tooltip" data-tooltip-template-id="restore-draft-tooltip-template">{{rendered_markdown content}}</div> <div class="message_content rendered_markdown restore-overlay-message tippy-zulip-delayed-tooltip" data-tooltip-template-id="restore-draft-tooltip-template">{{rendered_markdown content}}</div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -609,11 +609,11 @@ test("format_drafts", ({override_rewire, mock_template}) => {
const $unread_count = $("<unread-count-stub>"); const $unread_count = $("<unread-count-stub>");
$(".top_left_drafts").set_find_results(".unread_count", $unread_count); $(".top_left_drafts").set_find_results(".unread_count", $unread_count);
$.create("#drafts_table .draft-row", {children: []}); $.create("#drafts_table .overlay-message-row", {children: []});
drafts.launch(); drafts.launch();
$.clear_all_elements(); $.clear_all_elements();
$.create("#drafts_table .draft-row", {children: []}); $.create("#drafts_table .overlay-message-row", {children: []});
$("#draft_overlay").css = () => {}; $("#draft_overlay").css = () => {};
override_rewire(sub_store, "get", (stream_id) => { override_rewire(sub_store, "get", (stream_id) => {
@ -769,6 +769,6 @@ test("filter_drafts", ({override_rewire, mock_template}) => {
compose_state.set_message_type("private"); compose_state.set_message_type("private");
compose_state.private_message_recipient(aaron.email); compose_state.private_message_recipient(aaron.email);
$.create("#drafts_table .draft-row", {children: []}); $.create("#drafts_table .overlay-message-row", {children: []});
drafts.launch(); drafts.launch();
}); });