keydown_util: Extract all 'Enter' events to one place.

This is a prep commit to fix #22062.
This commit is contained in:
Rohitt Vashishtha 2022-09-28 11:57:24 +05:30 committed by Tim Abbott
parent aeb9a27d0e
commit d4379f9528
21 changed files with 51 additions and 26 deletions

View File

@ -1,4 +1,5 @@
import * as input_pill from "./input_pill";
import * as keydown_util from "./keydown_util";
import * as pill_typeahead from "./pill_typeahead";
import * as stream_pill from "./stream_pill";
import * as user_group_pill from "./user_group_pill";
@ -109,7 +110,7 @@ export function set_up_handlers({
}
$parent_container.on("keyup", pill_selector, (e) => {
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
e.preventDefault();
callback();
}

View File

@ -12,6 +12,7 @@ import * as compose_validate from "./compose_validate";
import * as emoji from "./emoji";
import * as flatpickr from "./flatpickr";
import {$t} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as message_store from "./message_store";
import * as muted_users from "./muted_users";
import {page_params} from "./page_params";
@ -137,7 +138,7 @@ export function should_enter_send(e) {
// With the enter_sends setting, we should send
// the message unless the user was holding a
// modifier key.
this_enter_sends = !has_modifier_key;
this_enter_sends = !has_modifier_key && keydown_util.is_enter_event(e);
} else {
// If enter_sends is not enabled, just hitting
// Enter should add a newline, but with a
@ -194,7 +195,7 @@ let $nextFocus = false;
function handle_keydown(e) {
const key = e.key;
if (key === "Enter" || (key === "Tab" && !e.shiftKey)) {
if (keydown_util.is_enter_event(e) || (key === "Tab" && !e.shiftKey)) {
// Enter key or Tab key
let target_sel;
@ -256,7 +257,7 @@ function handle_keydown(e) {
function handle_keyup(e) {
if (
// Enter key or Tab key
(e.key === "Enter" || (e.key === "Tab" && !e.shiftKey)) &&
(keydown_util.is_enter_event(e) || (e.key === "Tab" && !e.shiftKey)) &&
$nextFocus
) {
$nextFocus.trigger("focus");

View File

@ -6,6 +6,7 @@ import render_dropdown_list from "../templates/settings/dropdown_list.hbs";
import * as blueslip from "./blueslip";
import {$t} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as ListWidget from "./list_widget";
export class DropdownListWidget {
@ -82,7 +83,7 @@ export class DropdownListWidget {
`.${CSS.escape(this.widget_name)}_setting`,
);
if (e.type === "keypress") {
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
$setting_elem.find(".dropdown-menu").dropdown("toggle");
} else {
return;
@ -533,7 +534,7 @@ export class MultiSelectDropdownListWidget extends DropdownListWidget {
).expectOne();
$dropdown_list_body.on("click keypress", ".list_item", (e) => {
if (e.type === "keypress" && e.key !== "Enter") {
if (e.type === "keypress" && !keydown_util.is_enter_event(e)) {
return;
}

View File

@ -10,6 +10,7 @@ import render_emoji_showcase from "../templates/emoji_showcase.hbs";
import * as blueslip from "./blueslip";
import * as compose_ui from "./compose_ui";
import * as emoji from "./emoji";
import * as keydown_util from "./keydown_util";
import * as message_lists from "./message_lists";
import * as message_store from "./message_store";
import {page_params} from "./page_params";
@ -306,7 +307,7 @@ function is_status_emoji(emoji) {
}
function process_enter_while_filtering(e) {
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
e.preventDefault();
const $first_emoji = get_rendered_emoji(0, 0);
if ($first_emoji) {

View File

@ -6,6 +6,7 @@ import render_input_pill from "../templates/input_pill.hbs";
import * as blueslip from "./blueslip";
import * as compose from "./compose";
import * as keydown_util from "./keydown_util";
import * as ui_util from "./ui_util";
// See https://zulip.readthedocs.io/en/latest/subsystems/input-pills.html
@ -243,7 +244,7 @@ export function create(opts) {
{
store.$parent.on("keydown", ".input", (e) => {
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
// regardless of the value of the input, the ENTER keyword
// should be ignored in favor of keeping content to one line
// always.

View File

@ -13,6 +13,7 @@ import * as browser_history from "./browser_history";
import * as channel from "./channel";
import * as common from "./common";
import {$t, $t_html} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as overlays from "./overlays";
import {page_params} from "./page_params";
import * as settings_config from "./settings_config";
@ -210,7 +211,7 @@ export function launch() {
// Ctrl + Enter key to submit form
$("#invite-user").on("keydown", (e) => {
if (e.key === "Enter" && e.ctrlKey) {
if (keydown_util.is_enter_event(e) && e.ctrlKey) {
submit_invitation_form();
}
});
@ -333,7 +334,7 @@ export function initialize() {
});
$("#custom-expiration-time-input").on("keydown", (e) => {
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
e.preventDefault();
return;
}

View File

@ -31,3 +31,7 @@ export function handle(opts: {
}
});
}
export function is_enter_event(event: JQuery.KeyDownEvent): boolean {
return event.key === "Enter";
}

View File

@ -11,6 +11,7 @@ import render_profile_incomplete_alert_content from "../templates/navbar_alerts/
import render_server_needs_upgrade_alert_content from "../templates/navbar_alerts/server_needs_upgrade.hbs";
import * as compose_ui from "./compose_ui";
import * as keydown_util from "./keydown_util";
import {localstorage} from "./localstorage";
import * as notifications from "./notifications";
import {page_params} from "./page_params";
@ -233,7 +234,7 @@ export function initialize() {
// Treat Enter with links in the navbar alerts UI focused like a click.,
$("#navbar_alerts_wrapper").on("keyup", ".alert-link[role=button]", function (e) {
e.stopPropagation();
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
$(this).trigger("click");
}
});

View File

@ -6,6 +6,7 @@ import render_widgets_poll_widget_results from "../templates/widgets/poll_widget
import * as blueslip from "./blueslip";
import {$t} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as people from "./people";
export function activate({
@ -127,7 +128,7 @@ export function activate({
$elem.find("input.poll-question").on("keydown", (e) => {
e.stopPropagation();
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
submit_question();
return;
}
@ -163,7 +164,7 @@ export function activate({
e.stopPropagation();
check_option_button();
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
submit_option();
return;
}

View File

@ -3,6 +3,7 @@ import $ from "jquery";
import render_search_list_item from "../templates/search_list_item.hbs";
import {Filter} from "./filter";
import * as keydown_util from "./keydown_util";
import * as message_view_header from "./message_view_header";
import * as narrow from "./narrow";
import * as narrow_state from "./narrow_state";
@ -136,7 +137,7 @@ export function initialize() {
$searchbox_form
.on("keydown", (e) => {
update_button_visibility();
if (e.key === "Enter" && $search_query_box.is(":focus")) {
if (keydown_util.is_enter_event(e) && $search_query_box.is(":focus")) {
// Don't submit the form so that the typeahead can instead
// handle our Enter keypress. Any searching that needs
// to be done will be handled in the keyup.
@ -149,7 +150,7 @@ export function initialize() {
return;
}
if (e.key === "Enter" && $search_query_box.is(":focus")) {
if (keydown_util.is_enter_event(e) && $search_query_box.is(":focus")) {
// We just pressed Enter and the box had focus, which
// means we didn't use the typeahead at all. In that
// case, we should act as though we're searching by

View File

@ -15,6 +15,7 @@ import * as confirm_dialog from "./confirm_dialog";
import {csrf_token} from "./csrf";
import * as dialog_widget from "./dialog_widget";
import {$t, $t_html} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as overlays from "./overlays";
import {page_params} from "./page_params";
import * as people from "./people";
@ -384,7 +385,7 @@ export function set_up() {
do_get_api_key();
});
$("#get_api_key_password").on("keydown", (e) => {
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
e.preventDefault();
e.stopPropagation();
do_get_api_key();

View File

@ -10,6 +10,7 @@ import * as confirm_dialog from "./confirm_dialog";
import {csrf_token} from "./csrf";
import {DropdownListWidget} from "./dropdown_list_widget";
import {$t, $t_html, get_language_name} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as loading from "./loading";
import {page_params} from "./page_params";
import * as realm_icon from "./realm_icon";
@ -1135,7 +1136,7 @@ export function build_page() {
$(".org-subsection-parent").on("keydown", "input", (e) => {
e.stopPropagation();
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
e.preventDefault();
$(e.target)
.closest(".org-subsection-parent")

View File

@ -5,6 +5,7 @@ import render_admin_default_streams_list from "../templates/settings/admin_defau
import * as channel from "./channel";
import * as hash_util from "./hash_util";
import {$t_html} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as ListWidget from "./list_widget";
import * as loading from "./loading";
import {page_params} from "./page_params";
@ -110,7 +111,7 @@ export function build_page() {
update_default_streams_table();
$(".create_default_stream").on("keypress", (e) => {
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
e.preventDefault();
e.stopPropagation();
const $default_stream_input = $(".create_default_stream");

View File

@ -9,6 +9,7 @@ import * as channel from "./channel";
import * as confirm_dialog from "./confirm_dialog";
import * as dialog_widget from "./dialog_widget";
import {$t, $t_html} from "./i18n";
import * as keydown_util from "./keydown_util";
import {page_params} from "./page_params";
import * as people from "./people";
import * as pill_typeahead from "./pill_typeahead";
@ -406,7 +407,7 @@ export function set_up() {
});
$("#user-groups").on("keypress", ".user-group h4 > span", (e) => {
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
e.preventDefault();
}
});

View File

@ -7,6 +7,7 @@ import render_subscription_invites_warning_modal from "../templates/confirm_dial
import * as channel from "./channel";
import * as confirm_dialog from "./confirm_dialog";
import {$t, $t_html} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as loading from "./loading";
import {page_params} from "./page_params";
import * as people from "./people";
@ -399,7 +400,7 @@ export function set_up_handlers() {
// Do not allow the user to enter newline characters while typing out the
// stream's description during it's creation.
$container.on("keydown", "#create_stream_description", (e) => {
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
e.preventDefault();
}
});

View File

@ -15,6 +15,7 @@ import * as confirm_dialog from "./confirm_dialog";
import * as dialog_widget from "./dialog_widget";
import * as hash_util from "./hash_util";
import {$t, $t_html} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as narrow_state from "./narrow_state";
import {page_params} from "./page_params";
import * as settings_config from "./settings_config";
@ -560,7 +561,7 @@ export function initialize() {
$("#manage_streams_container").on("keypress", "#change_stream_description", (e) => {
// Stream descriptions can not be multiline, so disable enter key
// to prevent new line
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
return false;
}
return true;

View File

@ -21,6 +21,7 @@ import * as drafts from "./drafts";
import {DropdownListWidget} from "./dropdown_list_widget";
import * as hash_util from "./hash_util";
import {$t, $t_html} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as message_edit from "./message_edit";
import * as muted_topics_ui from "./muted_topics_ui";
import {page_params} from "./page_params";
@ -634,7 +635,7 @@ export function register_click_handlers() {
// and thus don't want to kill the natural bubbling of event.
e.preventDefault();
if (e.type === "keypress" && e.key !== "Enter") {
if (e.type === "keypress" && !keydown_util.is_enter_event(e)) {
return;
}
const stream_name = stream_data.maybe_get_stream_name(

View File

@ -16,6 +16,7 @@ import * as compose_state from "./compose_state";
import * as confirm_dialog from "./confirm_dialog";
import * as hash_util from "./hash_util";
import {$t, $t_html} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as loading from "./loading";
import * as message_live_update from "./message_live_update";
import * as message_view_header from "./message_view_header";
@ -663,7 +664,7 @@ export function setup_page(callback) {
// streams, either explicitly via user_can_create_streams, or
// implicitly because page_params.realm_is_zephyr_mirror_realm.
$("#stream_filter input[type='text']").on("keypress", (e) => {
if (e.key !== "Enter") {
if (!keydown_util.is_enter_event(e)) {
return;
}

View File

@ -1,5 +1,7 @@
import $ from "jquery";
import * as keydown_util from "./keydown_util";
// Add functions to this that have no non-trivial
// dependencies other than jQuery.
@ -27,7 +29,7 @@ export function blur_active_element(): void {
}
export function convert_enter_to_click(e: JQuery.KeyDownEvent): void {
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
e.preventDefault();
e.stopPropagation();
$(e.currentTarget).trigger("click");

View File

@ -2,6 +2,7 @@ import $ from "jquery";
import * as channel from "./channel";
import {$t, $t_html} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as loading from "./loading";
import * as ui_report from "./ui_report";
import * as user_group_create_members from "./user_group_create_members";
@ -182,7 +183,7 @@ export function set_up_handlers() {
// Do not allow the user to enter newline characters while typing out the
// group's description during it's creation.
$container.on("keydown", "#create_user_group_description", (e) => {
if (e.key === "Enter") {
if (keydown_util.is_enter_event(e)) {
e.preventDefault();
}
});

View File

@ -6,6 +6,7 @@ import render_status_emoji_selector from "../templates/status_emoji_selector.hbs
import * as dialog_widget from "./dialog_widget";
import * as emoji from "./emoji";
import {$t, $t_html} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as people from "./people";
import * as user_status from "./user_status";
@ -146,7 +147,7 @@ function user_status_post_render() {
});
input_field().on("keypress", (event) => {
if (event.key === "Enter") {
if (keydown_util.is_enter_event(event)) {
event.preventDefault();
submit_new_status();