From a30029c8ad06bef2ce0e760f9917d7b75c269ea6 Mon Sep 17 00:00:00 2001 From: Aman Agrawal Date: Tue, 14 May 2024 07:48:08 +0000 Subject: [PATCH] upload: Don't render upload button instead of hiding. Doesn't make sense to hide the upload button button later when we can just not show it if the browser doesn't has support for it. --- web/src/compose_setup.js | 2 -- web/src/message_edit.js | 3 +-- web/src/ui_init.js | 2 +- web/src/upload.js | 8 +++----- web/templates/compose_control_buttons.hbs | 2 +- web/tests/compose.test.js | 2 -- web/tests/compose_video.test.js | 17 ++++------------- web/tests/upload.test.js | 8 ++------ 8 files changed, 12 insertions(+), 32 deletions(-) diff --git a/web/src/compose_setup.js b/web/src/compose_setup.js index af738b4bd1..894f5ece64 100644 --- a/web/src/compose_setup.js +++ b/web/src/compose_setup.js @@ -103,8 +103,6 @@ export function initialize() { const update_compose_max_height = new ResizeObserver(resize.reset_compose_message_max_height); update_compose_max_height.observe(document.querySelector("#compose")); - upload.feature_check($("#compose .compose_upload_file")); - function get_input_info(event) { const $edit_banners_container = $(event.target).closest(".edit_form_banners"); const is_edit_input = Boolean($edit_banners_container.length); diff --git a/web/src/message_edit.js b/web/src/message_edit.js index 07590da196..f1ba1f3392 100644 --- a/web/src/message_edit.js +++ b/web/src/message_edit.js @@ -453,7 +453,7 @@ function edit_message($row, raw_content) { const max_file_upload_size = realm.max_file_upload_size_mib; let file_upload_enabled = false; - if (max_file_upload_size > 0) { + if (max_file_upload_size > 0 && upload.feature_check()) { file_upload_enabled = true; } @@ -483,7 +483,6 @@ function edit_message($row, raw_content) { $form .find(".message-edit-feature-group .audio_link") .toggle(compose_call.compute_show_audio_chat_button()); - upload.feature_check($(`#edit_form_${CSS.escape(rows.id($row))} .compose_upload_file`)); const $message_edit_content = $row.find("textarea.message_edit_content"); const $message_edit_countdown_timer = $row.find(".message_edit_countdown_timer"); diff --git a/web/src/ui_init.js b/web/src/ui_init.js index f334ee0c14..95712b2393 100644 --- a/web/src/ui_init.js +++ b/web/src/ui_init.js @@ -176,7 +176,7 @@ function initialize_compose_box() { $( render_compose({ embedded: $("#compose").attr("data-embedded") === "", - file_upload_enabled: realm.max_file_upload_size_mib > 0, + file_upload_enabled: realm.max_file_upload_size_mib > 0 && upload.feature_check(), giphy_enabled: giphy.is_giphy_enabled(), max_stream_name_length: realm.max_stream_name_length, max_topic_length: realm.max_topic_length, diff --git a/web/src/upload.js b/web/src/upload.js index d34b819c86..33bdb79163 100644 --- a/web/src/upload.js +++ b/web/src/upload.js @@ -26,11 +26,9 @@ export function compose_upload_cancel() { compose_upload_object.cancelAll(); } -// Show the upload button only if the browser supports it. -export function feature_check($upload_button) { - if (window.XMLHttpRequest && new window.XMLHttpRequest().upload) { - $upload_button.removeClass("notdisplayed"); - } +export function feature_check() { + // Show the upload button only if the browser supports it. + return window.XMLHttpRequest && new window.XMLHttpRequest().upload; } export function get_translated_status(file) { diff --git a/web/templates/compose_control_buttons.hbs b/web/templates/compose_control_buttons.hbs index a67fafcb8b..5001d35705 100644 --- a/web/templates/compose_control_buttons.hbs +++ b/web/templates/compose_control_buttons.hbs @@ -8,7 +8,7 @@ {{#if file_upload_enabled }}
- +
{{/if}}
diff --git a/web/tests/compose.test.js b/web/tests/compose.test.js index e624bebb60..ea1a7a3a60 100644 --- a/web/tests/compose.test.js +++ b/web/tests/compose.test.js @@ -123,7 +123,6 @@ function test_ui(label, f) { function initialize_handlers({override}) { override(realm, "realm_available_video_chat_providers", {disabled: {id: 0}}); override(realm, "realm_video_chat_provider", 0); - override(upload, "feature_check", noop); override(resize, "watch_manual_resize", noop); compose_setup.initialize(); } @@ -510,7 +509,6 @@ test_ui("initialize", ({override}) => { override(upload, "compose_upload_cancel", () => { uppy_cancel_all_called = true; }); - override(upload, "feature_check", noop); compose_setup.initialize(); diff --git a/web/tests/compose_video.test.js b/web/tests/compose_video.test.js index cec004a581..b7efcdab42 100644 --- a/web/tests/compose_video.test.js +++ b/web/tests/compose_video.test.js @@ -4,14 +4,13 @@ const {strict: assert} = require("assert"); const events = require("./lib/events"); const {mock_esm, set_global, with_overrides, zrequire} = require("./lib/namespace"); -const {run_test, noop} = require("./lib/test"); +const {run_test} = require("./lib/test"); const $ = require("./lib/zjquery"); const {current_user, page_params, realm} = require("./lib/zpage_params"); const channel = mock_esm("../src/channel"); const compose_closed_ui = mock_esm("../src/compose_closed_ui"); const compose_ui = mock_esm("../src/compose_ui"); -const upload = mock_esm("../src/upload"); mock_esm("../src/resize", { watch_manual_resize() {}, }); @@ -70,8 +69,6 @@ function test(label, f) { test("videos", ({override}) => { realm.realm_video_chat_provider = realm_available_video_chat_providers.disabled.id; - override(upload, "feature_check", noop); - stub_out_video_calls(); compose_setup.initialize(); @@ -245,26 +242,20 @@ test("videos", ({override}) => { })(); }); -test("test_video_chat_button_toggle disabled", ({override}) => { - override(upload, "feature_check", noop); - +test("test_video_chat_button_toggle disabled", () => { realm.realm_video_chat_provider = realm_available_video_chat_providers.disabled.id; compose_setup.initialize(); assert.equal($(".compose-control-buttons-container .video_link").visible(), false); }); -test("test_video_chat_button_toggle no url", ({override}) => { - override(upload, "feature_check", noop); - +test("test_video_chat_button_toggle no url", () => { realm.realm_video_chat_provider = realm_available_video_chat_providers.jitsi_meet.id; page_params.jitsi_server_url = null; compose_setup.initialize(); assert.equal($(".compose-control-buttons-container .video_link").visible(), false); }); -test("test_video_chat_button_toggle enabled", ({override}) => { - override(upload, "feature_check", noop); - +test("test_video_chat_button_toggle enabled", () => { realm.realm_video_chat_provider = realm_available_video_chat_providers.jitsi_meet.id; realm.realm_jitsi_server_url = "https://meet.jit.si"; compose_setup.initialize(); diff --git a/web/tests/upload.test.js b/web/tests/upload.test.js index 1361b11a3d..ba6a646600 100644 --- a/web/tests/upload.test.js +++ b/web/tests/upload.test.js @@ -40,14 +40,10 @@ function test(label, f) { } test("feature_check", ({override}) => { - const $upload_button = $.create("upload-button-stub"); - $upload_button.addClass("notdisplayed"); - upload.feature_check($upload_button); - assert.ok($upload_button.hasClass("notdisplayed")); + assert.ok(!upload.feature_check()); override(window, "XMLHttpRequest", () => ({upload: true})); - upload.feature_check($upload_button); - assert.ok(!$upload_button.hasClass("notdisplayed")); + assert.ok(upload.feature_check()); }); test("get_item", () => {