web: Fix selectors to correspond with annotated types.

TypeScript does not check that these annotations are consistent with
the given selector strings.  We need to ensure that ourselves for
runtime safety.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
This commit is contained in:
Anders Kaseorg 2024-03-19 11:45:03 -07:00 committed by Tim Abbott
parent 548805dff9
commit 85d5669a4a
12 changed files with 43 additions and 43 deletions

View File

@ -96,11 +96,11 @@ export function initialize(): void {
old_current_manual_license_count: number;
} {
const new_current_manual_license_count: number = Number.parseInt(
$<HTMLInputElement>("#current-manual-license-count").val()!,
$<HTMLInputElement>("input#current-manual-license-count").val()!,
10,
);
const old_current_manual_license_count: number = Number.parseInt(
$<HTMLInputElement>("#current-manual-license-count").attr("data-original-value")!,
$<HTMLInputElement>("input#current-manual-license-count").attr("data-original-value")!,
10,
);
return {
@ -114,11 +114,11 @@ export function initialize(): void {
old_next_manual_license_count: number;
} {
const new_next_manual_license_count: number = Number.parseInt(
$<HTMLInputElement>("#next-manual-license-count").val()!,
$<HTMLInputElement>("input#next-manual-license-count").val()!,
10,
);
const old_next_manual_license_count: number = Number.parseInt(
$<HTMLInputElement>("#next-manual-license-count").attr("data-original-value")!,
$<HTMLInputElement>("input#next-manual-license-count").attr("data-original-value")!,
10,
);
return {
@ -323,7 +323,7 @@ export function initialize(): void {
}, 300); // Wait for 300ms after the user stops typing
});
$<HTMLInputElement>(".billing-frequency-select").on("change", function () {
$<HTMLSelectElement>("select.billing-frequency-select").on("change", function () {
const $wrapper = $(".org-billing-frequency-wrapper");
const switch_to_annual_eoc = $wrapper.attr("data-switch-to-annual-eoc") === "true";
const switch_to_monthly_eoc = $wrapper.attr("data-switch-to-monthly-eoc") === "true";

View File

@ -2,7 +2,7 @@ import $ from "jquery";
function handle_submit_for_server_login_form(form: HTMLFormElement): void {
// Get value of zulip_org_id.
const zulip_org_id = $<HTMLInputElement>("#zulip-org-id").val();
const zulip_org_id = $<HTMLInputElement>("input#zulip-org-id").val();
const $error_field = $(".zulip_org_id-error");
if (zulip_org_id === undefined) {
// Already handled by `validate` plugin.
@ -66,14 +66,14 @@ export function initialize(): void {
},
});
$<HTMLInputElement>("#enable-major-release-emails").on("change", function () {
$<HTMLInputElement>("input#enable-major-release-emails").on("change", function () {
if (this.checked) {
$(this).val("true");
}
$(this).val("false");
});
$<HTMLInputElement>("#enable-maintenance-release-emails").on("change", function () {
$<HTMLInputElement>("input#enable-maintenance-release-emails").on("change", function () {
if (this.checked) {
$(this).val("true");
}

View File

@ -87,14 +87,14 @@ export function initialize(): void {
function update_discount_details(): void {
const selected_org_type =
$<HTMLSelectElement>("#organization-type")
$<HTMLSelectElement>("select#organization-type")
.find(":selected")
.attr("data-string-value") ?? "";
helpers.update_discount_details(selected_org_type, is_remotely_hosted);
}
update_discount_details();
$<HTMLSelectElement>("#organization-type").on("change", () => {
$<HTMLSelectElement>("select#organization-type").on("change", () => {
update_discount_details();
});
}

View File

@ -187,7 +187,7 @@ export const initialize = (): void => {
update_due_today(selected_schedule);
$("#payment-schedule-select").val(selected_schedule);
$<HTMLInputElement>("#payment-schedule-select").on("change", function () {
$<HTMLSelectElement>("select#payment-schedule-select").on("change", function () {
selected_schedule = this.value;
ls.set("selected_schedule", selected_schedule);
update_due_today(selected_schedule);
@ -195,7 +195,7 @@ export const initialize = (): void => {
update_due_today_for_remote_server(remote_server_plan_start_date);
$("#remote-server-plan-start-date-select").val(remote_server_plan_start_date);
$<HTMLInputElement>("#remote-server-plan-start-date-select").on("change", function () {
$<HTMLSelectElement>("select#remote-server-plan-start-date-select").on("change", function () {
remote_server_plan_start_date = this.value;
ls.set("remote_server_plan_start_date", remote_server_plan_start_date);
update_due_today_for_remote_server(remote_server_plan_start_date);
@ -208,7 +208,7 @@ export const initialize = (): void => {
`Pay monthly ($${helpers.format_money(prices.monthly)}/user/month)`,
);
$<HTMLInputElement>("#manual_license_count").on("keyup", function () {
$<HTMLInputElement>("input#manual_license_count").on("keyup", function () {
const license_count = Number.parseInt(this.value, 10);
update_license_count(license_count);
});

View File

@ -407,7 +407,7 @@ function open_invite_user_modal(e: JQuery.ClickEvent<Document, undefined>): void
$(".custom-expiration-time").on("change", () => {
custom_expiration_time_input = Number.parseFloat(
$<HTMLInputElement>("#custom-expiration-time-input").val()!,
$<HTMLInputElement>("input#custom-expiration-time-input").val()!,
);
custom_expiration_time_unit = $<HTMLSelectElement & {type: "select-one"}>(
"select:not([multiple])#custom-expiration-time-unit",

View File

@ -101,7 +101,7 @@ $(() => {
}
$("#registration").on("submit", () => {
if ($<HTMLInputElement>("#registration").valid()) {
if ($("#registration").valid()) {
$(".register-button .loader").css("display", "inline-block");
$(".register-button").prop("disabled", true);
$(".register-button span").hide();

View File

@ -70,9 +70,9 @@ function change_logo_delete_button(
}
export function render(): void {
const $file_input = $<HTMLInputElement>("#realm-day-logo-upload-widget .image_file_input");
const $file_input = $<HTMLInputElement>("#realm-day-logo-upload-widget input.image_file_input");
const $night_file_input = $<HTMLInputElement>(
"#realm-night-logo-upload-widget .image_file_input",
"#realm-night-logo-upload-widget input.image_file_input",
);
$("#realm-day-logo-upload-widget .image-block").attr("src", realm.realm_logo_url);

View File

@ -263,7 +263,7 @@ function show_modal(): void {
const formData = new FormData();
for (const [i, file] of Array.prototype.entries.call(
$<HTMLInputElement>("#emoji_file_input")[0].files,
$<HTMLInputElement>("input#emoji_file_input")[0].files,
)) {
formData.append("file-" + i, file);
}

View File

@ -200,7 +200,7 @@ class StreamSidebar {
export const stream_sidebar = new StreamSidebar();
function get_search_term(): string {
const $search_box = $<HTMLInputElement>(".stream-list-filter").expectOne();
const $search_box = $<HTMLInputElement>("input.stream-list-filter").expectOne();
const search_term = $search_box.val();
assert(search_term !== undefined);
return search_term.trim();

View File

@ -12,7 +12,7 @@ export class UserSearch {
// details of populating the list when we change.
$widget = $("#user_search_section").expectOne();
$input = $<HTMLInputElement>(".user-list-filter").expectOne();
$input = $<HTMLInputElement>("input.user-list-filter").expectOne();
_reset_items: () => void;
_update_list: () => void;
_on_focus: () => void;

View File

@ -239,7 +239,7 @@ test("presence_list_full_update", ({override, mock_template}) => {
presence_rows = [...presence_rows, ...data.presence_rows];
});
$(".user-list-filter").trigger("focus");
$("input.user-list-filter").trigger("focus");
const user_ids = activity_ui.build_user_sidebar();
@ -258,7 +258,7 @@ test("presence_list_full_update", ({override, mock_template}) => {
});
function simulate_right_column_buddy_list() {
$(".user-list-filter").closest = (selector) => {
$("input.user-list-filter").closest = (selector) => {
assert.equal(selector, ".app-main [class^='column-']");
return $.create("right-sidebar").addClass("column-right");
};
@ -353,7 +353,7 @@ test("handlers", ({override, override_rewire, mock_template}) => {
stopPropagation() {},
};
const handler = $(".user-list-filter").get_on_handler("focus");
const handler = $("input.user-list-filter").get_on_handler("focus");
handler(e);
})();
@ -372,7 +372,7 @@ test("handlers", ({override, override_rewire, mock_template}) => {
(function test_enter_key() {
init();
$(".user-list-filter").val("al");
$("input.user-list-filter").val("al");
narrowed = false;
activity_ui.user_cursor.go_to(alice.user_id);
filter_key_handlers.Enter();
@ -395,7 +395,7 @@ test("handlers", ({override, override_rewire, mock_template}) => {
(function test_blur_filter() {
init();
const e = {};
const handler = $(".user-list-filter").get_on_handler("blur");
const handler = $("input.user-list-filter").get_on_handler("blur");
handler(e);
})();
});
@ -678,7 +678,7 @@ test("insert_unfiltered_user_with_filter", () => {
// This test only tests that we do not explode when
// try to insert Fred into a list where he does not
// match the search filter.
const $user_filter = $(".user-list-filter");
const $user_filter = $("input.user-list-filter");
$user_filter.val("do-not-match-filter");
activity_ui.redraw_user(fred.user_id);
});

View File

@ -75,8 +75,8 @@ function test(label, f) {
}
function set_input_val(val) {
$(".user-list-filter").val(val);
$(".user-list-filter").trigger("input");
$("input.user-list-filter").val(val);
$("input.user-list-filter").trigger("input");
}
function stub_buddy_list_empty_list_message_lengths() {
@ -104,7 +104,7 @@ test("clear_search", ({override}) => {
assert.deepEqual(user_ids, {all_user_ids: ordered_user_ids});
});
$("#clear_search_people_button").trigger("click");
assert.equal($(".user-list-filter").val(), "");
assert.equal($("input.user-list-filter").val(), "");
$("#clear_search_people_button").trigger("click");
assert.ok($("#user_search_section").hasClass("notdisplayed"));
});
@ -118,7 +118,7 @@ test("escape_search", ({override}) => {
set_input_val("somevalue");
activity_ui.escape_search();
assert.equal($(".user-list-filter").val(), "");
assert.equal($("input.user-list-filter").val(), "");
activity_ui.escape_search();
assert.ok($("#user_search_section").hasClass("notdisplayed"));
@ -131,15 +131,15 @@ test("blur search right", ({override}) => {
override(popovers, "hide_all", noop);
override(resize, "resize_sidebars", noop);
$(".user-list-filter").closest = (selector) => {
$("input.user-list-filter").closest = (selector) => {
assert.equal(selector, ".app-main [class^='column-']");
return $.create("right-sidebar").addClass("column-right");
};
$(".user-list-filter").trigger("blur");
assert.equal($(".user-list-filter").is_focused(), false);
$("input.user-list-filter").trigger("blur");
assert.equal($("input.user-list-filter").is_focused(), false);
activity_ui.initiate_search();
assert.equal($(".user-list-filter").is_focused(), true);
assert.equal($("input.user-list-filter").is_focused(), true);
});
test("blur search left", ({override}) => {
@ -147,15 +147,15 @@ test("blur search left", ({override}) => {
override(popovers, "hide_all", noop);
override(resize, "resize_sidebars", noop);
$(".user-list-filter").closest = (selector) => {
$("input.user-list-filter").closest = (selector) => {
assert.equal(selector, ".app-main [class^='column-']");
return $.create("right-sidebar").addClass("column-left");
};
$(".user-list-filter").trigger("blur");
assert.equal($(".user-list-filter").is_focused(), false);
$("input.user-list-filter").trigger("blur");
assert.equal($("input.user-list-filter").is_focused(), false);
activity_ui.initiate_search();
assert.equal($(".user-list-filter").is_focused(), true);
assert.equal($("input.user-list-filter").is_focused(), true);
});
test("filter_user_ids", ({override}) => {
@ -170,7 +170,7 @@ test("filter_user_ids", ({override}) => {
function test_filter(search_text, expected_users) {
const expected_user_ids = expected_users.map((user) => user.user_id);
$(".user-list-filter").val(search_text);
$("input.user-list-filter").val(search_text);
const filter_text = activity_ui.get_filter_text();
assert.deepEqual(
buddy_data.get_filtered_and_sorted_user_ids(filter_text),
@ -213,7 +213,7 @@ test("filter_user_ids", ({override}) => {
});
test("click on user header to toggle display", ({override}) => {
const $user_filter = $(".user-list-filter");
const $user_filter = $("input.user-list-filter");
override(popovers, "hide_all", noop);
override(sidebar_ui, "show_userlist_sidebar", noop);
@ -229,7 +229,7 @@ test("click on user header to toggle display", ({override}) => {
assert.ok($("#user_search_section").hasClass("notdisplayed"));
assert.equal($user_filter.val(), "");
$(".user-list-filter").closest = (selector) => {
$("input.user-list-filter").closest = (selector) => {
assert.equal(selector, ".app-main [class^='column-']");
return $.create("sidebar").addClass("column-right");
};
@ -240,8 +240,8 @@ test("click on user header to toggle display", ({override}) => {
test("searching", () => {
assert.equal(activity_ui.searching(), false);
$(".user-list-filter").trigger("focus");
$("input.user-list-filter").trigger("focus");
assert.equal(activity_ui.searching(), true);
$(".user-list-filter").trigger("blur");
$("input.user-list-filter").trigger("blur");
assert.equal(activity_ui.searching(), false);
});