diff --git a/web/src/click_handlers.js b/web/src/click_handlers.js
index a6b9a38438..164932028d 100644
--- a/web/src/click_handlers.js
+++ b/web/src/click_handlers.js
@@ -814,7 +814,7 @@ export function initialize() {
                 // We do the same when copying a code block, since the
                 // most likely next action within Zulip is to paste it
                 // into compose and modify it.
-                $("#compose-textarea").trigger("focus");
+                $("textarea#compose-textarea").trigger("focus");
                 return;
             } else if (
                 !window.getSelection().toString() &&
diff --git a/web/src/compose.js b/web/src/compose.js
index 773c60770f..fa16b25239 100644
--- a/web/src/compose.js
+++ b/web/src/compose.js
@@ -42,13 +42,13 @@ export function clear_private_stream_alert() {
 }
 
 export function clear_preview_area() {
-    $("#compose-textarea").show();
-    $("#compose-textarea").trigger("focus");
+    $("textarea#compose-textarea").show();
+    $("textarea#compose-textarea").trigger("focus");
     $("#compose .undo_markdown_preview").hide();
     $("#compose .preview_message_area").hide();
     $("#compose .preview_content").empty();
     $("#compose .markdown_preview").show();
-    autosize.update($("#compose-textarea"));
+    autosize.update($("textarea#compose-textarea"));
 
     // While in preview mode we disable unneeded compose_control_buttons,
     // so here we are re-enabling those compose_control_buttons
@@ -107,11 +107,11 @@ export function clear_compose_box() {
     if (compose_ui.is_full_size()) {
         compose_ui.make_compose_box_original_size();
     }
-    $("#compose-textarea").val("").trigger("focus");
+    $("textarea#compose-textarea").val("").trigger("focus");
     compose_validate.check_overflow_text();
     compose_validate.clear_topic_resolved_warning();
-    $("#compose-textarea").removeData("draft-id");
-    compose_ui.autosize_textarea($("#compose-textarea"));
+    $("textarea#compose-textarea").removeData("draft-id");
+    compose_ui.autosize_textarea($("textarea#compose-textarea"));
     compose_banner.clear_errors();
     compose_banner.clear_warnings();
     compose_banner.clear_uploads();
@@ -121,8 +121,8 @@ export function clear_compose_box() {
 
 export function send_message_success(request, data) {
     if (!request.locally_echoed) {
-        if ($("#compose-textarea").data("draft-id")) {
-            drafts.draft_model.deleteDraft($("#compose-textarea").data("draft-id"));
+        if ($("textarea#compose-textarea").data("draft-id")) {
+            drafts.draft_model.deleteDraft($("textarea#compose-textarea").data("draft-id"));
         }
         clear_compose_box();
     }
@@ -187,7 +187,7 @@ export function send_message(request = create_message_object()) {
                 response,
                 compose_banner.CLASSNAMES.generic_compose_error,
                 $("#compose_banners"),
-                $("#compose-textarea"),
+                $("textarea#compose-textarea"),
             );
             // For messages that were not locally echoed, we're
             // responsible for hiding the compose spinner to restore
@@ -367,7 +367,7 @@ function schedule_message_to_custom_date() {
 
     const $banner_container = $("#compose_banners");
     const success = function (data) {
-        drafts.draft_model.deleteDraft($("#compose-textarea").data("draft-id"));
+        drafts.draft_model.deleteDraft($("textarea#compose-textarea").data("draft-id"));
         clear_compose_box();
         const new_row = render_success_message_scheduled_banner({
             scheduled_message_id: data.scheduled_message_id,
@@ -384,7 +384,7 @@ function schedule_message_to_custom_date() {
             response,
             compose_banner.CLASSNAMES.generic_compose_error,
             $banner_container,
-            $("#compose-textarea"),
+            $("textarea#compose-textarea"),
         );
     };
 
diff --git a/web/src/compose_actions.js b/web/src/compose_actions.js
index 24a1a83160..47c1c16500 100644
--- a/web/src/compose_actions.js
+++ b/web/src/compose_actions.js
@@ -81,9 +81,9 @@ function clear_box() {
     compose_state.set_recipient_edited_manually(false);
     clear_textarea();
     compose_validate.check_overflow_text();
-    $("#compose-textarea").removeData("draft-id");
-    $("#compose-textarea").toggleClass("invalid", false);
-    compose_ui.autosize_textarea($("#compose-textarea"));
+    $("textarea#compose-textarea").removeData("draft-id");
+    $("textarea#compose-textarea").toggleClass("invalid", false);
+    compose_ui.autosize_textarea($("textarea#compose-textarea"));
     compose_banner.clear_errors();
     compose_banner.clear_warnings();
     compose_banner.clear_uploads();
@@ -91,7 +91,7 @@ function clear_box() {
 
 export function autosize_message_content() {
     if (!compose_ui.is_full_size()) {
-        autosize($("#compose-textarea"), {
+        autosize($("textarea#compose-textarea"), {
             callback() {
                 maybe_scroll_up_selected_message();
             },
@@ -271,13 +271,13 @@ export function start(msg_type, opts) {
     show_compose_box(msg_type, opts);
 
     if (opts.draft_id) {
-        $("#compose-textarea").data("draft-id", opts.draft_id);
+        $("textarea#compose-textarea").data("draft-id", opts.draft_id);
     }
 
     if (opts.content !== undefined) {
         // If we were provided with message content, we might need to
         // resize the compose box, or display that it's too long.
-        compose_ui.autosize_textarea($("#compose-textarea"));
+        compose_ui.autosize_textarea($("textarea#compose-textarea"));
         compose_validate.check_overflow_text();
     }
 
@@ -307,7 +307,7 @@ export function cancel() {
         compose_ui.make_compose_box_original_size();
     }
 
-    $("#compose-textarea").height(40 + "px");
+    $("textarea#compose-textarea").height(40 + "px");
 
     if (page_params.narrow !== undefined) {
         // Never close the compose box in narrow embedded windows, but
@@ -376,7 +376,7 @@ export function on_topic_narrow() {
     compose_validate.warn_if_topic_resolved(true);
     compose_fade.set_focused_recipient("stream");
     compose_fade.update_message_list();
-    $("#compose-textarea").trigger("focus");
+    $("textarea#compose-textarea").trigger("focus");
 }
 
 export function on_narrow(opts) {
diff --git a/web/src/compose_popovers.js b/web/src/compose_popovers.js
index 95a730ce61..f429c1c3a5 100644
--- a/web/src/compose_popovers.js
+++ b/web/src/compose_popovers.js
@@ -120,7 +120,7 @@ export function initialize() {
 
                 // Refocus in the content box so you can continue typing or
                 // press Enter to send.
-                $("#compose-textarea").trigger("focus");
+                $("textarea#compose-textarea").trigger("focus");
 
                 channel.patch({
                     url: "/json/settings",
diff --git a/web/src/compose_recipient.js b/web/src/compose_recipient.js
index c90d941d3b..856c111c71 100644
--- a/web/src/compose_recipient.js
+++ b/web/src/compose_recipient.js
@@ -295,12 +295,12 @@ function on_hidden_callback() {
         // Always move focus to the topic input even if it's not empty,
         // since it's likely the user will want to update the topic
         // after updating the stream.
-        ui_util.place_caret_at_end($("#stream_message_recipient_topic")[0]);
+        ui_util.place_caret_at_end($("input#stream_message_recipient_topic")[0]);
     } else {
         if (compose_state.private_message_recipient().length === 0) {
             $("#private_message_recipient").trigger("focus").trigger("select");
         } else {
-            $("#compose-textarea").trigger("focus");
+            $("textarea#compose-textarea").trigger("focus");
         }
     }
 }
@@ -339,7 +339,7 @@ export function initialize() {
 
 export function update_placeholder_text() {
     // Change compose placeholder text only if compose box is open.
-    if (!$("#compose-textarea").is(":visible")) {
+    if (!$("textarea#compose-textarea").is(":visible")) {
         return;
     }
 
@@ -352,5 +352,5 @@ export function update_placeholder_text() {
         private_message_recipient: compose_pm_pill.get_emails(),
     };
 
-    $("#compose-textarea").attr("placeholder", compose_ui.compute_placeholder_text(opts));
+    $("textarea#compose-textarea").attr("placeholder", compose_ui.compute_placeholder_text(opts));
 }
diff --git a/web/src/compose_reply.js b/web/src/compose_reply.js
index 5371b8fced..22ee8db791 100644
--- a/web/src/compose_reply.js
+++ b/web/src/compose_reply.js
@@ -124,7 +124,7 @@ export function reply_with_mention(opts) {
 }
 
 export function quote_and_reply(opts) {
-    const $textarea = $("#compose-textarea");
+    const $textarea = $("textarea#compose-textarea");
     const message_id = message_lists.current.selected_id();
     const message = message_lists.current.selected_message();
     const quoting_placeholder = $t({defaultMessage: "[Quoting…]"});
@@ -159,7 +159,7 @@ export function quote_and_reply(opts) {
         content += `${fence}quote\n${message.raw_content}\n${fence}`;
 
         compose_ui.replace_syntax(quoting_placeholder, content, $textarea);
-        compose_ui.autosize_textarea($("#compose-textarea"));
+        compose_ui.autosize_textarea($("textarea#compose-textarea"));
     }
 
     if (message && message.raw_content) {
diff --git a/web/src/compose_setup.js b/web/src/compose_setup.js
index 87e2e5fe42..01a52cb068 100644
--- a/web/src/compose_setup.js
+++ b/web/src/compose_setup.js
@@ -47,18 +47,18 @@ export function initialize() {
     $("#below-compose-content .video_link").toggle(compose_call.compute_show_video_chat_button());
     $("#below-compose-content .audio_link").toggle(compose_call.compute_show_audio_chat_button());
 
-    $("#compose-textarea").on("keydown", (event) => {
-        compose_ui.handle_keydown(event, $("#compose-textarea").expectOne());
+    $("textarea#compose-textarea").on("keydown", (event) => {
+        compose_ui.handle_keydown(event, $("textarea#compose-textarea").expectOne());
     });
-    $("#compose-textarea").on("keyup", (event) => {
-        compose_ui.handle_keyup(event, $("#compose-textarea").expectOne());
+    $("textarea#compose-textarea").on("keyup", (event) => {
+        compose_ui.handle_keyup(event, $("textarea#compose-textarea").expectOne());
     });
 
-    $("#compose-textarea").on("input propertychange", () => {
+    $("textarea#compose-textarea").on("input propertychange", () => {
         compose_validate.warn_if_topic_resolved(false);
         const compose_text_length = compose_validate.check_overflow_text();
-        if (compose_text_length !== 0 && $("#compose-textarea").hasClass("invalid")) {
-            $("#compose-textarea").toggleClass("invalid", false);
+        if (compose_text_length !== 0 && $("textarea#compose-textarea").hasClass("invalid")) {
+            $("textarea#compose-textarea").toggleClass("invalid", false);
         }
         // Change compose close button tooltip as per condition.
         // We save compose text in draft only if its length is > 2.
@@ -229,7 +229,7 @@ export function initialize() {
                     error_message,
                     compose_banner.CLASSNAMES.generic_compose_error,
                     $banner_container,
-                    $("#compose-textarea"),
+                    $("textarea#compose-textarea"),
                 );
                 $(event.target).prop("disabled", true);
             }
@@ -330,8 +330,8 @@ export function initialize() {
         $("#compose").addClass("preview_mode");
         $("#compose .preview_mode_disabled .compose_control_button").attr("tabindex", -1);
 
-        const content = $("#compose-textarea").val();
-        $("#compose-textarea").hide();
+        const content = $("textarea#compose-textarea").val();
+        $("textarea#compose-textarea").hide();
         $("#compose .markdown_preview").hide();
         $("#compose .undo_markdown_preview").show();
         $("#compose .undo_markdown_preview").trigger("focus");
@@ -370,12 +370,12 @@ export function initialize() {
         compose_ui.make_compose_box_original_size();
     });
 
-    $("#compose-textarea").on("focus", () => {
+    $("textarea#compose-textarea").on("focus", () => {
         compose_recipient.update_placeholder_text();
     });
 
     $("#compose_recipient_box").on("click", "#recipient_box_clear_topic_button", () => {
-        const $input = $("#stream_message_recipient_topic");
+        const $input = $("input#stream_message_recipient_topic");
         const $button = $("#recipient_box_clear_topic_button");
 
         $input.val("");
@@ -383,7 +383,7 @@ export function initialize() {
         $button.hide();
     });
 
-    $("#compose_recipient_box").on("input", "#stream_message_recipient_topic", (e) => {
+    $("#compose_recipient_box").on("input", "input#stream_message_recipient_topic", (e) => {
         const $button = $("#recipient_box_clear_topic_button");
         const value = $(e.target).val();
         if (value.length === 0) {
@@ -393,11 +393,11 @@ export function initialize() {
         }
     });
 
-    $("#stream_message_recipient_topic").on("focus", () => {
+    $("input#stream_message_recipient_topic").on("focus", () => {
         compose_recipient.update_placeholder_text();
     });
 
-    $("#stream_message_recipient_topic").on("input", () => {
+    $("input#stream_message_recipient_topic").on("input", () => {
         compose_recipient.update_placeholder_text();
     });
 
diff --git a/web/src/compose_state.js b/web/src/compose_state.js
index 01e43e7cfd..fa95501a59 100644
--- a/web/src/compose_state.js
+++ b/web/src/compose_state.js
@@ -50,12 +50,12 @@ export function composing() {
     return Boolean(message_type);
 }
 
-function get_or_set(fieldname, keep_leading_whitespace, no_trim) {
+function get_or_set(input_selector, keep_leading_whitespace, no_trim) {
     // We can't hoist the assignment of '$elem' out of this lambda,
     // because the DOM element might not exist yet when get_or_set
     // is called.
     return function (newval) {
-        const $elem = $(`#${CSS.escape(fieldname)}`);
+        const $elem = $(input_selector);
         const oldval = $elem.val();
         if (newval !== undefined) {
             $elem.val(newval);
@@ -108,7 +108,7 @@ export function set_compose_recipient_id(recipient_id) {
 }
 
 // TODO: Break out setter and getter into their own functions.
-export const topic = get_or_set("stream_message_recipient_topic");
+export const topic = get_or_set("input#stream_message_recipient_topic");
 
 export function empty_topic_placeholder() {
     return $t({defaultMessage: "(no topic)"});
@@ -116,12 +116,12 @@ export function empty_topic_placeholder() {
 
 // We can't trim leading whitespace in `compose_textarea` because
 // of the indented syntax for multi-line code blocks.
-export const message_content = get_or_set("compose-textarea", true);
+export const message_content = get_or_set("textarea#compose-textarea", true);
 
-const untrimmed_message_content = get_or_set("compose-textarea", true, true);
+const untrimmed_message_content = get_or_set("textarea#compose-textarea", true, true);
 
 function cursor_at_start_of_whitespace_in_compose() {
-    const cursor_position = $("#compose-textarea").caret();
+    const cursor_position = $("textarea#compose-textarea").caret();
     return message_content() === "" && cursor_position === 0;
 }
 
diff --git a/web/src/compose_textarea.ts b/web/src/compose_textarea.ts
index 6b33641f08..f213cee8f1 100644
--- a/web/src/compose_textarea.ts
+++ b/web/src/compose_textarea.ts
@@ -5,7 +5,7 @@ import $ from "jquery";
 let saved_compose_cursor = 0;
 
 function set_compose_textarea_handlers(): void {
-    $("#compose-textarea").on("blur", function () {
+    $("textarea#compose-textarea").on("blur", function () {
         saved_compose_cursor = $(this).caret();
     });
 
@@ -17,7 +17,7 @@ function set_compose_textarea_handlers(): void {
 }
 
 export function restore_compose_cursor(): void {
-    $("#compose-textarea").trigger("focus").caret(saved_compose_cursor);
+    $("textarea#compose-textarea").trigger("focus").caret(saved_compose_cursor);
 }
 
 export function initialize(): void {
diff --git a/web/src/compose_ui.js b/web/src/compose_ui.js
index 3e61f0a1f3..6710088a3e 100644
--- a/web/src/compose_ui.js
+++ b/web/src/compose_ui.js
@@ -47,15 +47,15 @@ function get_focus_area(msg_type, opts) {
     // Set focus to "Topic" when narrowed to a stream+topic
     // and "Start new conversation" button clicked.
     if (msg_type === "stream" && opts.stream_id && !opts.topic) {
-        return "#stream_message_recipient_topic";
+        return "input#stream_message_recipient_topic";
     } else if (
         (msg_type === "stream" && opts.stream_id) ||
         (msg_type === "private" && opts.private_message_recipient)
     ) {
         if (opts.trigger === "clear topic button") {
-            return "#stream_message_recipient_topic";
+            return "input#stream_message_recipient_topic";
         }
-        return "#compose-textarea";
+        return "textarea#compose-textarea";
     }
 
     if (msg_type === "stream") {
@@ -159,7 +159,7 @@ export function smart_insert_block($textarea, syntax, padding_newlines = 2) {
 
 export function insert_syntax_and_focus(
     syntax,
-    $textarea = $("#compose-textarea"),
+    $textarea = $("textarea#compose-textarea"),
     mode = "inline",
     padding_newlines,
 ) {
@@ -184,7 +184,7 @@ export function insert_syntax_and_focus(
     }
 }
 
-export function replace_syntax(old_syntax, new_syntax, $textarea = $("#compose-textarea")) {
+export function replace_syntax(old_syntax, new_syntax, $textarea = $("textarea#compose-textarea")) {
     // The following couple lines are needed to later restore the initial
     // logical position of the cursor after the replacement
     const prev_caret = $textarea.caret();
@@ -294,7 +294,7 @@ export function make_compose_box_full_size() {
 
     // The autosize should be destroyed for the full size compose
     // box else it will interfere and shrink its size accordingly.
-    autosize.destroy($("#compose-textarea"));
+    autosize.destroy($("textarea#compose-textarea"));
 
     $("#compose").addClass("compose-fullscreen");
 
@@ -304,7 +304,7 @@ export function make_compose_box_full_size() {
     $(".collapse_composebox_button").show();
     $(".expand_composebox_button").hide();
     $("#scroll-to-bottom-button-container").removeClass("show");
-    $("#compose-textarea").trigger("focus");
+    $("textarea#compose-textarea").trigger("focus");
 }
 
 export function make_compose_box_original_size() {
@@ -317,11 +317,11 @@ export function make_compose_box_original_size() {
 
     // Again initialise the compose textarea as it was destroyed
     // when compose box was made full screen
-    autosize($("#compose-textarea"));
+    autosize($("textarea#compose-textarea"));
 
     $(".collapse_composebox_button").hide();
     $(".expand_composebox_button").show();
-    $("#compose-textarea").trigger("focus");
+    $("textarea#compose-textarea").trigger("focus");
 }
 
 export function handle_keydown(event, $textarea) {
diff --git a/web/src/compose_validate.js b/web/src/compose_validate.js
index 43f7ef0315..a1c4c5325b 100644
--- a/web/src/compose_validate.js
+++ b/web/src/compose_validate.js
@@ -500,7 +500,7 @@ function validate_stream_message(scheduling_message) {
                 $t({defaultMessage: "Topics are required in this organization."}),
                 compose_banner.CLASSNAMES.topic_missing,
                 $banner_container,
-                $("#stream_message_recipient_topic"),
+                $("input#stream_message_recipient_topic"),
             );
             return false;
         }
@@ -623,7 +623,7 @@ export function check_overflow_text() {
 
     if (text.length > max_length) {
         $indicator.addClass("over_limit");
-        $("#compose-textarea").addClass("over_limit");
+        $("textarea#compose-textarea").addClass("over_limit");
         $indicator.text(text.length + "/" + max_length);
         compose_banner.show_error_message(
             $t(
@@ -639,14 +639,14 @@ export function check_overflow_text() {
         $("#compose-send-button").prop("disabled", true);
     } else if (text.length > 0.9 * max_length) {
         $indicator.removeClass("over_limit");
-        $("#compose-textarea").removeClass("over_limit");
+        $("textarea#compose-textarea").removeClass("over_limit");
         $indicator.text(text.length + "/" + max_length);
 
         $("#compose-send-button").prop("disabled", false);
         $(`#compose_banners .${CSS.escape(compose_banner.CLASSNAMES.message_too_long)}`).remove();
     } else {
         $indicator.text("");
-        $("#compose-textarea").removeClass("over_limit");
+        $("textarea#compose-textarea").removeClass("over_limit");
 
         $("#compose-send-button").prop("disabled", false);
         $(`#compose_banners .${CSS.escape(compose_banner.CLASSNAMES.message_too_long)}`).remove();
@@ -657,8 +657,8 @@ export function check_overflow_text() {
 
 export function validate_message_length() {
     if (compose_state.message_content().length > page_params.max_message_length) {
-        $("#compose-textarea").addClass("flash");
-        setTimeout(() => $("#compose-textarea").removeClass("flash"), 1500);
+        $("textarea#compose-textarea").addClass("flash");
+        setTimeout(() => $("textarea#compose-textarea").removeClass("flash"), 1500);
         return false;
     }
     return true;
@@ -667,7 +667,7 @@ export function validate_message_length() {
 export function validate(scheduling_message) {
     const message_content = compose_state.message_content();
     if (/^\s*$/.test(message_content)) {
-        $("#compose-textarea").toggleClass("invalid", true);
+        $("textarea#compose-textarea").toggleClass("invalid", true);
         return false;
     }
 
diff --git a/web/src/composebox_typeahead.js b/web/src/composebox_typeahead.js
index 9b8495b481..7ee4b1ceeb 100644
--- a/web/src/composebox_typeahead.js
+++ b/web/src/composebox_typeahead.js
@@ -241,7 +241,7 @@ function handle_keydown(e, {on_enter_send}) {
             target_sel = `#${CSS.escape(e.target.id)}`;
         }
 
-        const on_topic = target_sel === "#stream_message_recipient_topic";
+        const on_topic = target_sel === "input#stream_message_recipient_topic";
         const on_pm = target_sel === "#private_message_recipient";
         const on_compose = target_sel === "#compose-textarea";
 
@@ -276,11 +276,11 @@ function handle_keydown(e, {on_enter_send}) {
                     return;
                 }
 
-                handle_enter($("#compose-textarea"), e);
+                handle_enter($("textarea#compose-textarea"), e);
             }
         } else if (on_topic || on_pm) {
             // We are doing the focusing on keyup to not abort the typeahead.
-            $nextFocus = $("#compose-textarea");
+            $nextFocus = $("textarea#compose-textarea");
         }
     }
 }
@@ -1133,7 +1133,7 @@ export function initialize({on_enter_send}) {
     $("form#send_message_form").on("keydown", (e) => handle_keydown(e, {on_enter_send}));
     $("form#send_message_form").on("keyup", handle_keyup);
 
-    $("#stream_message_recipient_topic").typeahead({
+    $("input#stream_message_recipient_topic").typeahead({
         source() {
             return topics_seen_for(compose_state.stream_id());
         },
@@ -1195,7 +1195,7 @@ export function initialize({on_enter_send}) {
         stopAdvance: true, // Do not advance to the next field on a Tab or Enter
     });
 
-    initialize_compose_typeahead("#compose-textarea");
+    initialize_compose_typeahead("textarea#compose-textarea");
 
     $("#private_message_recipient").on("blur", function () {
         const val = $(this).val();
diff --git a/web/src/copy_and_paste.js b/web/src/copy_and_paste.js
index ff80835db4..5baceeb388 100644
--- a/web/src/copy_and_paste.js
+++ b/web/src/copy_and_paste.js
@@ -535,6 +535,6 @@ export function paste_handler(event) {
 }
 
 export function initialize() {
-    $("#compose-textarea").on("paste", paste_handler);
+    $("textarea#compose-textarea").on("paste", paste_handler);
     $("body").on("paste", ".message_edit_content", paste_handler);
 }
diff --git a/web/src/drafts.js b/web/src/drafts.js
index d297593a8f..0213d612b0 100644
--- a/web/src/drafts.js
+++ b/web/src/drafts.js
@@ -250,7 +250,7 @@ export function update_draft(opts = {}) {
         return undefined;
     }
 
-    const draft_id = $("#compose-textarea").data("draft-id");
+    const draft_id = $("textarea#compose-textarea").data("draft-id");
 
     if (draft_id !== undefined) {
         // We don't save multiple drafts of the same message;
@@ -265,7 +265,7 @@ export function update_draft(opts = {}) {
     // We have never saved a draft for this message, so add one.
     const update_count = opts.update_count === undefined ? true : opts.update_count;
     const new_draft_id = draft_model.addDraft(draft, update_count);
-    $("#compose-textarea").data("draft-id", new_draft_id);
+    $("textarea#compose-textarea").data("draft-id", new_draft_id);
     maybe_notify(no_notify);
 
     return new_draft_id;
diff --git a/web/src/giphy.js b/web/src/giphy.js
index 75b1a0e8b5..2c238c23ef 100644
--- a/web/src/giphy.js
+++ b/web/src/giphy.js
@@ -94,7 +94,7 @@ async function renderGIPHYGrid(targetEl) {
                 // GIF; nice in principle but too distracting.
                 hideAttribution: true,
                 onGifClick(props) {
-                    let $textarea = $("#compose-textarea");
+                    let $textarea = $("textarea#compose-textarea");
                     if (edit_message_id !== undefined) {
                         $textarea = $(
                             `#edit_form_${CSS.escape(edit_message_id)} .message_edit_content`,
diff --git a/web/src/hotkey.js b/web/src/hotkey.js
index 2c423346a3..9a5874d385 100644
--- a/web/src/hotkey.js
+++ b/web/src/hotkey.js
@@ -320,7 +320,7 @@ export function process_escape_key(e) {
             // Check if the giphy popover was open using compose box.
             // Hide GIPHY popover if it's open.
             if (!giphy.is_popped_from_edit_message() && giphy.hide_giphy_popover()) {
-                $("#compose-textarea").trigger("focus");
+                $("textarea#compose-textarea").trigger("focus");
                 return true;
             }
 
@@ -620,7 +620,7 @@ export function process_shift_tab_key() {
         return emoji_picker.navigate("shift_tab");
     }
 
-    if ($("#stream_message_recipient_topic").is(":focus")) {
+    if ($("input#stream_message_recipient_topic").is(":focus")) {
         compose_recipient.open_compose_recipient_dropdown();
         return true;
     }
diff --git a/web/src/message_list_view.js b/web/src/message_list_view.js
index 717a4f9b85..d093d34ad8 100644
--- a/web/src/message_list_view.js
+++ b/web/src/message_list_view.js
@@ -1117,7 +1117,7 @@ export class MessageListView {
             // the current compose is bigger than the empty, open
             // compose box.
             const compose_textarea_default_height = 42;
-            const compose_textarea_current_height = $("#compose-textarea").height();
+            const compose_textarea_current_height = $("textarea#compose-textarea").height();
             const expected_change =
                 compose_textarea_current_height - compose_textarea_default_height;
             const expected_offset = offset - expected_change;
diff --git a/web/src/resize.js b/web/src/resize.js
index 1ab31a2d0d..a9865a2f68 100644
--- a/web/src/resize.js
+++ b/web/src/resize.js
@@ -91,13 +91,13 @@ export function reset_compose_message_max_height(bottom_whitespace_height) {
 
     const compose_height = $("#compose").get(0).getBoundingClientRect().height;
     const compose_textarea_height = Math.max(
-        $("#compose-textarea").get(0).getBoundingClientRect().height,
+        $("textarea#compose-textarea").get(0).getBoundingClientRect().height,
         $("#preview_message_area").get(0).getBoundingClientRect().height,
     );
     const compose_non_textarea_height = compose_height - compose_textarea_height;
 
     // We ensure that the last message is not overlapped by compose box.
-    $("#compose-textarea").css(
+    $("textarea#compose-textarea").css(
         "max-height",
         // Because <textarea> max-height includes padding, we subtract
         // 10 for the padding and 10 for the selected message border.
diff --git a/web/src/resize_handler.js b/web/src/resize_handler.js
index 63c01c5b43..f756ad2f1f 100644
--- a/web/src/resize_handler.js
+++ b/web/src/resize_handler.js
@@ -28,7 +28,7 @@ export function handler() {
         _old_width = new_width;
     }
     resize.resize_page_components();
-    compose_ui.autosize_textarea($("#compose-textarea"));
+    compose_ui.autosize_textarea($("textarea#compose-textarea"));
     resize.update_recent_view_filters_height();
 
     // Re-compute and display/remove 'Show more' buttons to messages
diff --git a/web/src/scheduled_messages_popover.js b/web/src/scheduled_messages_popover.js
index 7b57e68b50..74428d805f 100644
--- a/web/src/scheduled_messages_popover.js
+++ b/web/src/scheduled_messages_popover.js
@@ -116,7 +116,7 @@ export function initialize() {
         target: "#send_later i",
         onUntrigger() {
             // This is only called when the popover is closed by clicking on `target`.
-            $("#compose-textarea").trigger("focus");
+            $("textarea#compose-textarea").trigger("focus");
         },
         onShow(instance) {
             const formatted_send_later_time =
diff --git a/web/src/upload.js b/web/src/upload.js
index d4bdb142cf..419c2709c3 100644
--- a/web/src/upload.js
+++ b/web/src/upload.js
@@ -37,7 +37,7 @@ export function get_item(key, config, file_id) {
     if (config.mode === "compose") {
         switch (key) {
             case "textarea":
-                return $("#compose-textarea");
+                return $("textarea#compose-textarea");
             case "send_button":
                 return $("#compose-send-button");
             case "banner_container":
diff --git a/web/tests/compose.test.js b/web/tests/compose.test.js
index e1a955d59e..f277c2ffcd 100644
--- a/web/tests/compose.test.js
+++ b/web/tests/compose.test.js
@@ -133,8 +133,8 @@ test_ui("send_message_success", ({override, override_rewire}) => {
     mock_banners();
 
     function reset() {
-        $("#compose-textarea").val("foobarfoobar");
-        $("#compose-textarea").trigger("blur");
+        $("textarea#compose-textarea").val("foobarfoobar");
+        $("textarea#compose-textarea").trigger("blur");
         $(".compose-submit-button .loader").show();
     }
 
@@ -165,8 +165,8 @@ test_ui("send_message_success", ({override, override_rewire}) => {
     let data = {id: 12, automatic_new_visibility_policy: 2};
     compose.send_message_success(request, data);
 
-    assert.equal($("#compose-textarea").val(), "");
-    assert.ok($("#compose-textarea").is_focused());
+    assert.equal($("textarea#compose-textarea").val(), "");
+    assert.ok($("textarea#compose-textarea").is_focused());
     assert.ok(!$(".compose-submit-button .loader").visible());
     assert.ok(reify_message_id_checked);
 
@@ -189,8 +189,8 @@ test_ui("send_message_success", ({override, override_rewire}) => {
     data = {id: 12};
     compose.send_message_success(request, data);
 
-    assert.equal($("#compose-textarea").val(), "");
-    assert.ok($("#compose-textarea").is_focused());
+    assert.equal($("textarea#compose-textarea").val(), "");
+    assert.ok($("textarea#compose-textarea").is_focused());
     assert.ok(!$(".compose-submit-button .loader").visible());
     assert.ok(reify_message_id_checked);
 });
@@ -266,8 +266,8 @@ test_ui("send_message", ({override, override_rewire, mock_template}) => {
             stub_state.reify_message_id_checked += 1;
         });
 
-        $("#compose-textarea").val("[foobar](/user_uploads/123456)");
-        $("#compose-textarea").trigger("blur");
+        $("textarea#compose-textarea").val("[foobar](/user_uploads/123456)");
+        $("textarea#compose-textarea").trigger("blur");
         $(".compose-submit-button .loader").show();
 
         compose.send_message();
@@ -278,8 +278,8 @@ test_ui("send_message", ({override, override_rewire, mock_template}) => {
             send_msg_called: 1,
         };
         assert.deepEqual(stub_state, state);
-        assert.equal($("#compose-textarea").val(), "");
-        assert.ok($("#compose-textarea").is_focused());
+        assert.equal($("textarea#compose-textarea").val(), "");
+        assert.ok($("textarea#compose-textarea").is_focused());
         assert.ok(!$(".compose-submit-button .loader").visible());
     })();
 
@@ -320,10 +320,10 @@ test_ui("send_message", ({override, override_rewire, mock_template}) => {
             banner_rendered = true;
         });
         stub_state = initialize_state_stub_dict();
-        $("#compose-textarea").val("foobarfoobar");
-        $("#compose-textarea").trigger("blur");
+        $("textarea#compose-textarea").val("foobarfoobar");
+        $("textarea#compose-textarea").trigger("blur");
         $(".compose-submit-button .loader").show();
-        $("#compose-textarea").off("select");
+        $("textarea#compose-textarea").off("select");
         echo_error_msg_checked = false;
         override_rewire(echo, "try_deliver_locally", () => {});
 
@@ -339,15 +339,15 @@ test_ui("send_message", ({override, override_rewire, mock_template}) => {
         assert.deepEqual(stub_state, state);
         assert.ok(!echo_error_msg_checked);
         assert.ok(banner_rendered);
-        assert.equal($("#compose-textarea").val(), "foobarfoobar");
-        assert.ok($("#compose-textarea").is_focused());
+        assert.equal($("textarea#compose-textarea").val(), "foobarfoobar");
+        assert.ok($("textarea#compose-textarea").is_focused());
         assert.ok(!$(".compose-submit-button .loader").visible());
     })();
 });
 
 test_ui("enter_with_preview_open", ({override, override_rewire}) => {
     mock_banners();
-    $("#compose-textarea").toggleClass = noop;
+    $("textarea#compose-textarea").toggleClass = noop;
     mock_stream_header_colorblock();
     override_rewire(compose_banner, "clear_message_sent_banners", () => {});
     override(document, "to_$", () => $("document-stub"));
@@ -363,8 +363,8 @@ test_ui("enter_with_preview_open", ({override, override_rewire}) => {
     compose_state.set_message_type("stream");
     compose_state.set_stream_id(social.stream_id);
 
-    $("#compose-textarea").val("message me");
-    $("#compose-textarea").hide();
+    $("textarea#compose-textarea").val("message me");
+    $("textarea#compose-textarea").hide();
     $("#compose .undo_markdown_preview").show();
     $("#compose .preview_message_area").show();
     $("#compose .markdown_preview").hide();
@@ -375,7 +375,7 @@ test_ui("enter_with_preview_open", ({override, override_rewire}) => {
         send_message_called = true;
     });
     compose.enter_with_preview_open();
-    assert.ok($("#compose-textarea").visible());
+    assert.ok($("textarea#compose-textarea").visible());
     assert.ok(!$("#compose .undo_markdown_preview").visible());
     assert.ok(!$("#compose .preview_message_area").visible());
     assert.ok($("#compose .markdown_preview").visible());
@@ -384,12 +384,12 @@ test_ui("enter_with_preview_open", ({override, override_rewire}) => {
     assert.ok(show_button_spinner_called);
 
     user_settings.enter_sends = false;
-    $("#compose-textarea").trigger("blur");
+    $("textarea#compose-textarea").trigger("blur");
     compose.enter_with_preview_open();
-    assert.ok($("#compose-textarea").is_focused());
+    assert.ok($("textarea#compose-textarea").is_focused());
 
     // Test sending a message without content.
-    $("#compose-textarea").val("");
+    $("textarea#compose-textarea").val("");
     $("#compose .preview_message_area").show();
     user_settings.enter_sends = true;
 
@@ -409,7 +409,7 @@ test_ui("finish", ({override, override_rewire}) => {
     });
 
     (function test_when_compose_validation_fails() {
-        $("#compose-textarea").toggleClass = (classname, value) => {
+        $("textarea#compose-textarea").toggleClass = (classname, value) => {
             assert.equal(classname, "invalid");
             assert.equal(value, true);
         };
@@ -417,8 +417,8 @@ test_ui("finish", ({override, override_rewire}) => {
         $("#compose-send-button").prop("disabled", false);
         $("#compose-send-button").trigger("focus");
         $(".compose-submit-button .loader").hide();
-        $("#compose-textarea").off("select");
-        $("#compose-textarea").val("");
+        $("textarea#compose-textarea").off("select");
+        $("textarea#compose-textarea").val("");
         override_rewire(compose_ui, "compose_spinner_visible", false);
         const res = compose.finish();
         assert.equal(res, false);
@@ -433,7 +433,7 @@ test_ui("finish", ({override, override_rewire}) => {
         $("#compose .preview_message_area").show();
         $("#compose .markdown_preview").hide();
         $("#compsoe").addClass("preview_mode");
-        $("#compose-textarea").val("foobarfoobar");
+        $("textarea#compose-textarea").val("foobarfoobar");
         override_rewire(compose_ui, "compose_spinner_visible", false);
         compose_state.set_message_type("private");
         override(compose_pm_pill, "get_emails", () => "bob@example.com");
@@ -448,7 +448,7 @@ test_ui("finish", ({override, override_rewire}) => {
             send_message_called = true;
         });
         assert.ok(compose.finish());
-        assert.ok($("#compose-textarea").visible());
+        assert.ok($("textarea#compose-textarea").visible());
         assert.ok(!$("#compose .undo_markdown_preview").visible());
         assert.ok(!$("#compose .preview_message_area").visible());
         assert.ok($("#compose .markdown_preview").visible());
@@ -617,7 +617,7 @@ test_ui("on_events", ({override, override_rewire}) => {
     (function test_markdown_preview_compose_clicked() {
         // Tests setup
         function setup_visibilities() {
-            $("#compose-textarea").show();
+            $("textarea#compose-textarea").show();
             $("#compose .markdown_preview").show();
             $("#compose .undo_markdown_preview").hide();
             $("#compose .preview_message_area").hide();
@@ -625,7 +625,7 @@ test_ui("on_events", ({override, override_rewire}) => {
         }
 
         function assert_visibilities() {
-            assert.ok(!$("#compose-textarea").visible());
+            assert.ok(!$("textarea#compose-textarea").visible());
             assert.ok(!$("#compose .markdown_preview").visible());
             assert.ok($("#compose .undo_markdown_preview").visible());
             assert.ok($("#compose .preview_message_area").visible());
@@ -689,7 +689,7 @@ test_ui("on_events", ({override, override_rewire}) => {
         const handler = $("#compose").get_on_handler("click", ".markdown_preview");
 
         // Tests start here
-        $("#compose-textarea").val("");
+        $("textarea#compose-textarea").val("");
         setup_visibilities();
 
         const event = {
@@ -703,7 +703,7 @@ test_ui("on_events", ({override, override_rewire}) => {
         assert_visibilities();
 
         let make_indicator_called = false;
-        $("#compose-textarea").val("```foobarfoobar```");
+        $("textarea#compose-textarea").val("```foobarfoobar```");
         setup_visibilities();
         setup_mock_markdown_contains_backend_only_syntax("```foobarfoobar```", true);
         setup_mock_markdown_is_status_message("```foobarfoobar```", false);
@@ -721,7 +721,7 @@ test_ui("on_events", ({override, override_rewire}) => {
         assert_visibilities();
 
         let apply_markdown_called = false;
-        $("#compose-textarea").val("foobarfoobar");
+        $("textarea#compose-textarea").val("foobarfoobar");
         setup_visibilities();
         setup_mock_markdown_contains_backend_only_syntax("foobarfoobar", false);
         setup_mock_markdown_is_status_message("foobarfoobar", false);
@@ -744,7 +744,7 @@ test_ui("on_events", ({override, override_rewire}) => {
     (function test_undo_markdown_preview_clicked() {
         const handler = $("#compose").get_on_handler("click", ".undo_markdown_preview");
 
-        $("#compose-textarea").hide();
+        $("textarea#compose-textarea").hide();
         $("#compose .undo_markdown_preview").show();
         $("#compose .preview_message_area").show();
         $("#compose .markdown_preview").hide();
@@ -759,7 +759,7 @@ test_ui("on_events", ({override, override_rewire}) => {
 
         handler(event);
 
-        assert.ok($("#compose-textarea").visible());
+        assert.ok($("textarea#compose-textarea").visible());
         assert.ok(!$("#compose .undo_markdown_preview").visible());
         assert.ok(!$("#compose .preview_message_area").visible());
         assert.ok($("#compose .markdown_preview").visible());
@@ -772,8 +772,8 @@ test_ui("create_message_object", ({override, override_rewire}) => {
     mock_banners();
 
     compose_state.set_stream_id(social.stream_id);
-    $("#stream_message_recipient_topic").val("lunch");
-    $("#compose-textarea").val("burrito");
+    $("input#stream_message_recipient_topic").val("lunch");
+    $("textarea#compose-textarea").val("burrito");
 
     compose_state.set_message_type("stream");
 
diff --git a/web/tests/compose_actions.test.js b/web/tests/compose_actions.test.js
index a1bade3ec3..db61c981cc 100644
--- a/web/tests/compose_actions.test.js
+++ b/web/tests/compose_actions.test.js
@@ -199,11 +199,11 @@ test("start", ({override, override_rewire, mock_template}) => {
 
     start("private", opts);
 
-    assert_hidden("#stream_message_recipient_topic");
+    assert_hidden("input#stream_message_recipient_topic");
     assert_visible("#compose-direct-recipient");
 
     assert.equal(compose_state.private_message_recipient(), "foo@example.com");
-    assert.equal($("#compose-textarea").val(), "hello");
+    assert.equal($("textarea#compose-textarea").val(), "hello");
     assert.equal(compose_state.get_message_type(), "private");
     assert.ok(compose_state.composing());
 
@@ -230,7 +230,7 @@ test("start", ({override, override_rewire, mock_template}) => {
     });
 
     compose_actions.register_compose_cancel_hook(compose_setup.abort_xhr);
-    $("#compose-textarea").set_height(50);
+    $("textarea#compose-textarea").set_height(50);
 
     assert_hidden("#compose_controls");
     cancel();
@@ -411,7 +411,7 @@ test("quote_and_reply", ({disallow, override, override_rewire}) => {
         reply_type: "personal",
     };
 
-    $("#compose-textarea").caret = noop;
+    $("textarea#compose-textarea").caret = noop;
 
     replaced = false;
     expected_replacement =
@@ -457,16 +457,16 @@ test("quote_and_reply", ({disallow, override, override_rewire}) => {
 test("focus_in_empty_compose", () => {
     document.activeElement = {id: "compose-textarea"};
     compose_state.set_message_type("stream");
-    $("#compose-textarea").val("");
+    $("textarea#compose-textarea").val("");
     assert.ok(compose_state.focus_in_empty_compose());
 
     compose_state.set_message_type(false);
     assert.ok(!compose_state.focus_in_empty_compose());
 
-    $("#compose-textarea").val("foo");
+    $("textarea#compose-textarea").val("foo");
     assert.ok(!compose_state.focus_in_empty_compose());
 
-    $("#compose-textarea").trigger("blur");
+    $("textarea#compose-textarea").trigger("blur");
     assert.ok(!compose_state.focus_in_empty_compose());
 });
 
diff --git a/web/tests/compose_fade.test.js b/web/tests/compose_fade.test.js
index 92e75114c7..7cd28eae27 100644
--- a/web/tests/compose_fade.test.js
+++ b/web/tests/compose_fade.test.js
@@ -7,7 +7,7 @@ const {run_test} = require("./lib/test");
 
 mock_jquery((selector) => {
     switch (selector) {
-        case "#stream_message_recipient_topic":
+        case "input#stream_message_recipient_topic":
             return {
                 val() {
                     return "lunch";
diff --git a/web/tests/compose_ui.test.js b/web/tests/compose_ui.test.js
index 5519374344..4e6a2b45b2 100644
--- a/web/tests/compose_ui.test.js
+++ b/web/tests/compose_ui.test.js
@@ -102,9 +102,9 @@ run_test("autosize_textarea", ({override}) => {
 });
 
 run_test("insert_syntax_and_focus", ({override}) => {
-    $("#compose-textarea").val("xyz ");
-    $("#compose-textarea").caret = () => 4;
-    $("#compose-textarea")[0] = "compose-textarea";
+    $("textarea#compose-textarea").val("xyz ");
+    $("textarea#compose-textarea").caret = () => 4;
+    $("textarea#compose-textarea")[0] = "compose-textarea";
     // Since we are using a third party library, we just
     // need to ensure it is being called with the right params.
     override(text_field_edit, "insert", (elt, syntax) => {
@@ -298,11 +298,11 @@ run_test("quote_and_reply", ({override, override_rewire}) => {
     let textarea_val = "";
     let textarea_caret_pos;
 
-    $("#compose-textarea").val = function () {
+    $("textarea#compose-textarea").val = function () {
         return textarea_val;
     };
 
-    $("#compose-textarea").caret = function (arg) {
+    $("textarea#compose-textarea").caret = function (arg) {
         if (arg === undefined) {
             return textarea_caret_pos;
         }
@@ -328,7 +328,7 @@ run_test("quote_and_reply", ({override, override_rewire}) => {
             return this;
         }
     };
-    $("#compose-textarea")[0] = "compose-textarea";
+    $("textarea#compose-textarea")[0] = "compose-textarea";
     override(text_field_edit, "insert", (elt, syntax) => {
         assert.equal(elt, "compose-textarea");
         assert.equal(syntax, "\n\ntranslated: [Quoting…]\n\n");
@@ -339,7 +339,7 @@ run_test("quote_and_reply", ({override, override_rewire}) => {
         content = content.slice(0, caret_position) + content.slice(caret_position + 1); // remove the "%"
         textarea_val = content;
         textarea_caret_pos = caret_position;
-        $("#compose-textarea").trigger("focus");
+        $("textarea#compose-textarea").trigger("focus");
     }
 
     function reset_test_state() {
@@ -349,7 +349,7 @@ run_test("quote_and_reply", ({override, override_rewire}) => {
         // Reset compose-box state.
         textarea_val = "";
         textarea_caret_pos = 0;
-        $("#compose-textarea").trigger("blur");
+        $("textarea#compose-textarea").trigger("blur");
     }
 
     function override_with_quote_text(quote_text) {
@@ -395,7 +395,7 @@ run_test("quote_and_reply", ({override, override_rewire}) => {
         // Reset compose state to replicate the re-opening of compose-box.
         textarea_val = "";
         textarea_caret_pos = 0;
-        $("#compose-textarea").trigger("focus");
+        $("textarea#compose-textarea").trigger("focus");
     });
 
     reset_test_state();
@@ -511,7 +511,7 @@ function reset_state() {
     wrap_syntax_end = "";
 }
 
-const $textarea = $("#compose-textarea");
+const $textarea = $("textarea#compose-textarea");
 $textarea.get = () => ({
     setSelectionRange(start, end) {
         $textarea.range = () => ({
@@ -787,7 +787,7 @@ run_test("markdown_shortcuts", ({override_rewire}) => {
         event.key = "b";
         event.ctrlKey = isCtrl;
         event.metaKey = isCmd;
-        compose_ui.handle_keydown(event, $("#compose-textarea"));
+        compose_ui.handle_keydown(event, $("textarea#compose-textarea"));
         assert.equal(format_text_type, "bold");
         format_text_type = undefined;
 
@@ -797,7 +797,7 @@ run_test("markdown_shortcuts", ({override_rewire}) => {
         // We use event.key = "I" to emulate user using Caps Lock key.
         event.key = "I";
         event.shiftKey = false;
-        compose_ui.handle_keydown(event, $("#compose-textarea"));
+        compose_ui.handle_keydown(event, $("textarea#compose-textarea"));
         assert.equal(format_text_type, "italic");
         format_text_type = undefined;
 
@@ -806,7 +806,7 @@ run_test("markdown_shortcuts", ({override_rewire}) => {
         // Windows/Linux = Ctrl+Shift+L
         event.key = "l";
         event.shiftKey = true;
-        compose_ui.handle_keydown(event, $("#compose-textarea"));
+        compose_ui.handle_keydown(event, $("textarea#compose-textarea"));
         assert.equal(format_text_type, "link");
         format_text_type = undefined;
     }
@@ -820,17 +820,17 @@ run_test("markdown_shortcuts", ({override_rewire}) => {
         event.metaKey = isCmd;
 
         event.key = "b";
-        compose_ui.handle_keydown(event, $("#compose-textarea"));
+        compose_ui.handle_keydown(event, $("textarea#compose-textarea"));
         assert.equal(format_text_type, undefined);
 
         event.key = "i";
         event.shiftKey = false;
-        compose_ui.handle_keydown(event, $("#compose-textarea"));
+        compose_ui.handle_keydown(event, $("textarea#compose-textarea"));
         assert.equal(format_text_type, undefined);
 
         event.key = "l";
         event.shiftKey = true;
-        compose_ui.handle_keydown(event, $("#compose-textarea"));
+        compose_ui.handle_keydown(event, $("textarea#compose-textarea"));
         assert.equal(format_text_type, undefined);
     }
 
@@ -859,7 +859,7 @@ run_test("markdown_shortcuts", ({override_rewire}) => {
 });
 
 run_test("right-to-left", () => {
-    const $textarea = $("#compose-textarea");
+    const $textarea = $("textarea#compose-textarea");
 
     const event = {
         key: "A",
@@ -868,7 +868,7 @@ run_test("right-to-left", () => {
     assert.equal($textarea.hasClass("rtl"), false);
 
     $textarea.val("```quote\nمرحبا");
-    compose_ui.handle_keyup(event, $("#compose-textarea"));
+    compose_ui.handle_keyup(event, $("textarea#compose-textarea"));
 
     assert.equal($textarea.hasClass("rtl"), true);
 
@@ -885,16 +885,16 @@ run_test("get_focus_area", () => {
         get_focus_area("private", {
             private_message_recipient: "bob@example.com",
         }),
-        "#compose-textarea",
+        "textarea#compose-textarea",
     );
     assert.equal(get_focus_area("stream", {}), "#compose_select_recipient_widget_wrapper");
     assert.equal(
         get_focus_area("stream", {stream_name: "fun", stream_id: 4}),
-        "#stream_message_recipient_topic",
+        "input#stream_message_recipient_topic",
     );
     assert.equal(
         get_focus_area("stream", {stream_name: "fun", stream_id: 4, topic: "more"}),
-        "#compose-textarea",
+        "textarea#compose-textarea",
     );
     assert.equal(
         get_focus_area("stream", {
@@ -902,6 +902,6 @@ run_test("get_focus_area", () => {
             topic: "more",
             trigger: "clear topic button",
         }),
-        "#stream_message_recipient_topic",
+        "input#stream_message_recipient_topic",
     );
 });
diff --git a/web/tests/compose_validate.test.js b/web/tests/compose_validate.test.js
index 1df9bf1009..ae804c5144 100644
--- a/web/tests/compose_validate.test.js
+++ b/web/tests/compose_validate.test.js
@@ -68,7 +68,7 @@ people.add_cross_realm_user(welcome_bot);
 function test_ui(label, f) {
     // The sloppy_$ flag lets us reuse setup from prior tests.
     run_test(label, (helpers) => {
-        $("#compose-textarea").val("some message");
+        $("textarea#compose-textarea").val("some message");
         f(helpers);
     });
 }
@@ -178,7 +178,7 @@ test_ui("validate", ({mock_template}) => {
     }
 
     function add_content_to_compose_box() {
-        $("#compose-textarea").val("foobarfoobar");
+        $("textarea#compose-textarea").val("foobarfoobar");
     }
 
     // test validating direct messages
@@ -243,7 +243,7 @@ test_ui("validate", ({mock_template}) => {
     });
     initialize_pm_pill();
     compose_state.private_message_recipient("welcome-bot@example.com");
-    $("#compose-textarea").toggleClass = (classname, value) => {
+    $("textarea#compose-textarea").toggleClass = (classname, value) => {
         assert.equal(classname, "invalid");
         assert.equal(value, true);
     };
@@ -546,7 +546,7 @@ test_ui("test_check_overflow_text", ({mock_template}) => {
     mock_banners();
     page_params.max_message_length = 10000;
 
-    const $textarea = $("#compose-textarea");
+    const $textarea = $("textarea#compose-textarea");
     const $indicator = $("#compose_limit_indicator");
     const $send_button = $("#compose-send-button");
     let banner_rendered = false;
diff --git a/web/tests/compose_video.test.js b/web/tests/compose_video.test.js
index 1f01a583df..75501321dc 100644
--- a/web/tests/compose_video.test.js
+++ b/web/tests/compose_video.test.js
@@ -86,7 +86,7 @@ test("videos", ({override}) => {
         };
 
         const handler = $("body").get_on_handler("click", ".video_link");
-        $("#compose-textarea").val("");
+        $("textarea#compose-textarea").val("");
 
         with_overrides(({disallow}) => {
             disallow(compose_ui, "insert_syntax_and_focus");
@@ -115,7 +115,7 @@ test("videos", ({override}) => {
         });
 
         const handler = $("body").get_on_handler("click", ".video_link");
-        $("#compose-textarea").val("");
+        $("textarea#compose-textarea").val("");
 
         page_params.realm_video_chat_provider = realm_available_video_chat_providers.jitsi_meet.id;
 
@@ -187,14 +187,14 @@ test("videos", ({override}) => {
             return {abort() {}};
         };
 
-        $("#compose-textarea").val("");
+        $("textarea#compose-textarea").val("");
         const video_handler = $("body").get_on_handler("click", ".video_link");
         video_handler(ev);
         const video_link_regex = /\[translated: Join video call\.]\(example\.zoom\.com\)/;
         assert.ok(called);
         assert.match(syntax_to_insert, video_link_regex);
 
-        $("#compose-textarea").val("");
+        $("textarea#compose-textarea").val("");
         const audio_handler = $("body").get_on_handler("click", ".audio_link");
         audio_handler(ev);
         const audio_link_regex = /\[translated: Join voice call\.]\(example\.zoom\.com\)/;
@@ -223,7 +223,7 @@ test("videos", ({override}) => {
         });
 
         const handler = $("body").get_on_handler("click", ".video_link");
-        $("#compose-textarea").val("");
+        $("textarea#compose-textarea").val("");
 
         page_params.realm_video_chat_provider =
             realm_available_video_chat_providers.big_blue_button.id;
diff --git a/web/tests/composebox_typeahead.test.js b/web/tests/composebox_typeahead.test.js
index 503ee90021..4142dcf003 100644
--- a/web/tests/composebox_typeahead.test.js
+++ b/web/tests/composebox_typeahead.test.js
@@ -741,7 +741,7 @@ test("initialize", ({override, override_rewire, mock_template}) => {
     override(stream_topic_history_util, "get_server_history", () => {});
 
     let topic_typeahead_called = false;
-    $("#stream_message_recipient_topic").typeahead = (options) => {
+    $("input#stream_message_recipient_topic").typeahead = (options) => {
         override_rewire(stream_topic_history, "get_recent_topic_names", (stream_id) => {
             assert.equal(stream_id, sweden_stream.stream_id);
             return sweden_topics_to_show;
@@ -962,7 +962,7 @@ test("initialize", ({override, override_rewire, mock_template}) => {
     };
 
     let compose_textarea_typeahead_called = false;
-    $("#compose-textarea").typeahead = (options) => {
+    $("textarea#compose-textarea").typeahead = (options) => {
         // options.source()
         //
         // For now we only test that get_sorted_filtered_items has been
@@ -1159,14 +1159,14 @@ test("initialize", ({override, override_rewire, mock_template}) => {
     event.target.id = "some_non_existing_id";
     $("form#send_message_form").trigger(event);
 
-    $("#compose-textarea")[0] = {
+    $("textarea#compose-textarea")[0] = {
         selectionStart: 0,
         selectionEnd: 0,
     };
     override(compose_ui, "insert_and_scroll_into_view", (content, _textarea) => {
         assert.equal(content, "\n");
     });
-    $("#compose-textarea").caret = () => $("#compose-textarea")[0].selectionStart;
+    $("textarea#compose-textarea").caret = () => $("textarea#compose-textarea")[0].selectionStart;
 
     event.key = "Enter";
     event.target.id = "stream_message_recipient_topic";
@@ -1188,19 +1188,19 @@ test("initialize", ({override, override_rewire, mock_template}) => {
     // Cover cases where there's at least one character there.
 
     // Test automatic bulleting.
-    $("#compose-textarea").val("- List item 1\n- List item 2");
-    $("#compose-textarea")[0].selectionStart = 27;
-    $("#compose-textarea")[0].selectionEnd = 27;
+    $("textarea#compose-textarea").val("- List item 1\n- List item 2");
+    $("textarea#compose-textarea")[0].selectionStart = 27;
+    $("textarea#compose-textarea")[0].selectionEnd = 27;
     override(compose_ui, "insert_and_scroll_into_view", (content, _textarea) => {
         assert.equal(content, "\n- ");
     });
     $("form#send_message_form").trigger(event);
 
     // Test removal of bullet.
-    $("#compose-textarea").val("- List item 1\n- List item 2\n- ");
-    $("#compose-textarea")[0].selectionStart = 30;
-    $("#compose-textarea")[0].selectionEnd = 30;
-    $("#compose-textarea")[0].setSelectionRange = (start, end) => {
+    $("textarea#compose-textarea").val("- List item 1\n- List item 2\n- ");
+    $("textarea#compose-textarea")[0].selectionStart = 30;
+    $("textarea#compose-textarea")[0].selectionEnd = 30;
+    $("textarea#compose-textarea")[0].setSelectionRange = (start, end) => {
         assert.equal(start, 28);
         assert.equal(end, 30);
     };
@@ -1210,19 +1210,19 @@ test("initialize", ({override, override_rewire, mock_template}) => {
     $("form#send_message_form").trigger(event);
 
     // Test automatic numbering.
-    $("#compose-textarea").val("1. List item 1\n2. List item 2");
-    $("#compose-textarea")[0].selectionStart = 29;
-    $("#compose-textarea")[0].selectionEnd = 29;
+    $("textarea#compose-textarea").val("1. List item 1\n2. List item 2");
+    $("textarea#compose-textarea")[0].selectionStart = 29;
+    $("textarea#compose-textarea")[0].selectionEnd = 29;
     override(compose_ui, "insert_and_scroll_into_view", (content, _textarea) => {
         assert.equal(content, "\n3. ");
     });
     $("form#send_message_form").trigger(event);
 
     // Test removal of numbering.
-    $("#compose-textarea").val("1. List item 1\n2. List item 2\n3. ");
-    $("#compose-textarea")[0].selectionStart = 33;
-    $("#compose-textarea")[0].selectionEnd = 33;
-    $("#compose-textarea")[0].setSelectionRange = (start, end) => {
+    $("textarea#compose-textarea").val("1. List item 1\n2. List item 2\n3. ");
+    $("textarea#compose-textarea")[0].selectionStart = 33;
+    $("textarea#compose-textarea")[0].selectionEnd = 33;
+    $("textarea#compose-textarea")[0].setSelectionRange = (start, end) => {
         assert.equal(start, 30);
         assert.equal(end, 33);
     };
@@ -1231,9 +1231,9 @@ test("initialize", ({override, override_rewire, mock_template}) => {
     });
     $("form#send_message_form").trigger(event);
 
-    $("#compose-textarea").val("A");
-    $("#compose-textarea")[0].selectionStart = 4;
-    $("#compose-textarea")[0].selectionEnd = 4;
+    $("textarea#compose-textarea").val("A");
+    $("textarea#compose-textarea")[0].selectionStart = 4;
+    $("textarea#compose-textarea")[0].selectionEnd = 4;
     override(compose_ui, "insert_and_scroll_into_view", (content, _textarea) => {
         assert.equal(content, "\n");
     });
@@ -1259,7 +1259,7 @@ test("initialize", ({override, override_rewire, mock_template}) => {
     };
     // We trigger keydown in order to make nextFocus !== false
     $("form#send_message_form").trigger(event);
-    $("#stream_message_recipient_topic").off("mouseup");
+    $("input#stream_message_recipient_topic").off("mouseup");
     event.type = "keyup";
     $("form#send_message_form").trigger(event);
     event.key = "Tab";
@@ -1268,7 +1268,7 @@ test("initialize", ({override, override_rewire, mock_template}) => {
     event.key = "a";
     $("form#send_message_form").trigger(event);
 
-    $("#stream_message_recipient_topic").off("focus");
+    $("input#stream_message_recipient_topic").off("focus");
     $("#private_message_recipient").off("focus");
     $("form#send_message_form").off("keydown");
     $("form#send_message_form").off("keyup");
diff --git a/web/tests/upload.test.js b/web/tests/upload.test.js
index cbb5d076d6..98b716b6f6 100644
--- a/web/tests/upload.test.js
+++ b/web/tests/upload.test.js
@@ -48,7 +48,7 @@ test("feature_check", ({override}) => {
 });
 
 test("get_item", () => {
-    assert.equal(upload.get_item("textarea", {mode: "compose"}), $("#compose-textarea"));
+    assert.equal(upload.get_item("textarea", {mode: "compose"}), $("textarea#compose-textarea"));
     assert.equal(
         upload.get_item("upload_banner_message", {mode: "compose"}, "id_1"),
         $("#compose_banners .upload_banner.file_id_1 .upload_msg"),
@@ -323,7 +323,7 @@ test("upload_files", async ({mock_template, override_rewire}) => {
         compose_ui_replace_syntax_called = true;
         assert.equal(old_syntax, "[translated: Uploading budapest.png…]()");
         assert.equal(new_syntax, "");
-        assert.equal(textarea, $("#compose-textarea"));
+        assert.equal(textarea, $("textarea#compose-textarea"));
     });
     on_click_close_button_callback();
     assert.ok(remove_file_called);
@@ -333,14 +333,14 @@ test("upload_files", async ({mock_template, override_rewire}) => {
     hide_upload_banner_called = false;
     compose_ui_replace_syntax_called = false;
     remove_file_called = false;
-    $("#compose-textarea").val("user modified text");
+    $("textarea#compose-textarea").val("user modified text");
 
     on_click_close_button_callback();
     assert.ok(remove_file_called);
     assert.ok(hide_upload_banner_called);
     assert.ok(compose_ui_autosize_textarea_called);
     assert.ok(compose_ui_replace_syntax_called);
-    assert.equal($("#compose-textarea").val(), "user modified text");
+    assert.equal($("textarea#compose-textarea").val(), "user modified text");
 });
 
 test("uppy_config", () => {
@@ -550,7 +550,7 @@ test("uppy_events", ({override_rewire, mock_template}) => {
             new_syntax,
             "[copenhagen.png](/user_uploads/4/cb/rue1c-MlMUjDAUdkRrEM4BTJ/copenhagen.png)",
         );
-        assert.equal(textarea, $("#compose-textarea"));
+        assert.equal(textarea, $("textarea#compose-textarea"));
     });
     let compose_ui_autosize_textarea_called = false;
     override_rewire(compose_ui, "autosize_textarea", () => {
@@ -590,15 +590,15 @@ test("uppy_events", ({override_rewire, mock_template}) => {
         compose_ui_replace_syntax_called = true;
         assert.equal(old_syntax, "[translated: Uploading copenhagen.png…]()");
         assert.equal(new_syntax, "");
-        assert.equal(textarea, $("#compose-textarea"));
+        assert.equal(textarea, $("textarea#compose-textarea"));
     });
     on_restriction_failed_callback(file, null, null);
     assert.ok(compose_ui_replace_syntax_called);
     compose_ui_replace_syntax_called = false;
-    $("#compose-textarea").val("user modified text");
+    $("textarea#compose-textarea").val("user modified text");
     on_restriction_failed_callback(file, null, null);
     assert.ok(compose_ui_replace_syntax_called);
-    assert.equal($("#compose-textarea").val(), "user modified text");
+    assert.equal($("textarea#compose-textarea").val(), "user modified text");
 
     state = {
         type: "error",
@@ -635,10 +635,10 @@ test("uppy_events", ({override_rewire, mock_template}) => {
 
     $("#compose_banners .upload_banner .upload_msg").text("");
     assert.ok(hide_upload_banner_called);
-    $("#compose-textarea").val("user modified text");
+    $("textarea#compose-textarea").val("user modified text");
     on_upload_error_callback(file, null);
     assert.ok(compose_ui_replace_syntax_called);
-    assert.equal($("#compose-textarea").val(), "user modified text");
+    assert.equal($("textarea#compose-textarea").val(), "user modified text");
 });
 
 test("main_file_drop_compose_mode", ({override, override_rewire}) => {