diff --git a/web/e2e-tests/message-basics.test.ts b/web/e2e-tests/message-basics.test.ts index 426a07a5a5..4f477bd1bd 100644 --- a/web/e2e-tests/message-basics.test.ts +++ b/web/e2e-tests/message-basics.test.ts @@ -395,21 +395,24 @@ async function test_stream_search_filters_stream_list(page: Page): Promise async function test_users_search(page: Page): Promise { console.log("Search users using right sidebar"); async function assert_in_list(page: Page, name: string): Promise { - await page.waitForSelector(`#user_presences li [data-name="${CSS.escape(name)}"]`, { - visible: true, - }); + await page.waitForSelector( + `#buddy-list-users-matching-view li [data-name="${CSS.escape(name)}"]`, + { + visible: true, + }, + ); } async function assert_selected(page: Page, name: string): Promise { await page.waitForSelector( - `#user_presences li.highlighted_user [data-name="${CSS.escape(name)}"]`, + `#buddy-list-users-matching-view li.highlighted_user [data-name="${CSS.escape(name)}"]`, {visible: true}, ); } async function assert_not_selected(page: Page, name: string): Promise { await page.waitForSelector( - `#user_presences li.highlighted_user [data-name="${CSS.escape(name)}"]`, + `#buddy-list-users-matching-view li.highlighted_user [data-name="${CSS.escape(name)}"]`, {hidden: true}, ); } @@ -421,7 +424,9 @@ async function test_users_search(page: Page): Promise { // Enter the search box and test selected suggestion navigation await page.click("#user_filter_icon"); - await page.waitForSelector("#user_presences .highlighted_user", {visible: true}); + await page.waitForSelector("#buddy-list-users-matching-view .highlighted_user", { + visible: true, + }); await assert_selected(page, "Desdemona"); await assert_not_selected(page, "Cordelia, Lear's daughter"); await assert_not_selected(page, "King Hamlet"); @@ -443,9 +448,12 @@ async function test_users_search(page: Page): Promise { await arrow(page, "Down"); // Now Iago must be highlighted - await page.waitForSelector('#user_presences li.highlighted_user [data-name="Iago"]', { - visible: true, - }); + await page.waitForSelector( + '#buddy-list-users-matching-view li.highlighted_user [data-name="Iago"]', + { + visible: true, + }, + ); await assert_not_selected(page, "King Hamlet"); await assert_not_selected(page, "aaron"); await assert_not_selected(page, "Desdemona"); diff --git a/web/src/buddy_list.js b/web/src/buddy_list.js index b91cfa6acf..821ca5430b 100644 --- a/web/src/buddy_list.js +++ b/web/src/buddy_list.js @@ -10,7 +10,7 @@ import * as padded_widget from "./padded_widget"; import * as scroll_util from "./scroll_util"; class BuddyListConf { - container_sel = "#user_presences"; + container_sel = "#buddy-list-users-matching-view"; scroll_container_sel = "#buddy_list_wrapper"; item_sel = "li.user_sidebar_entry"; padding_sel = "#buddy_list_wrapper_padding"; diff --git a/web/src/click_handlers.js b/web/src/click_handlers.js index c4a75a1070..a6b9a38438 100644 --- a/web/src/click_handlers.js +++ b/web/src/click_handlers.js @@ -472,7 +472,7 @@ export function initialize() { }); // SIDEBARS - $("#user_presences") + $("#buddy-list-users-matching-view") .expectOne() .on("click", ".selectable_sidebar_block", (e) => { const $li = $(e.target).parents("li"); @@ -547,7 +547,7 @@ export function initialize() { } // BUDDY LIST TOOLTIPS (not displayed on touch devices) - $("#user_presences").on("mouseenter", ".selectable_sidebar_block", (e) => { + $("#buddy-list-users-matching-view").on("mouseenter", ".selectable_sidebar_block", (e) => { e.stopPropagation(); const $elem = $(e.currentTarget).closest(".user_sidebar_entry").find(".user-presence-link"); const user_id_string = $elem.attr("data-user-id"); @@ -555,7 +555,7 @@ export function initialize() { // `target_node` is the `ul` element since it stays in DOM even after updates. function get_target_node() { - return document.querySelector("#user_presences"); + return document.querySelector("#buddy-list-users-matching-view"); } function check_reference_removed(mutation, instance) { @@ -623,9 +623,11 @@ export function initialize() { // MISC { - const sel = ["#stream_filters", "#left-sidebar-navigation-list", "#user_presences"].join( - ", ", - ); + const sel = [ + "#stream_filters", + "#left-sidebar-navigation-list", + "#buddy-list-users-matching-view", + ].join(", "); $(sel).on("click", "a", function () { this.blur(); diff --git a/web/src/list_util.ts b/web/src/list_util.ts index 8f0b428737..e64f16379f 100644 --- a/web/src/list_util.ts +++ b/web/src/list_util.ts @@ -3,7 +3,7 @@ import $ from "jquery"; const list_selectors = [ "#stream_filters", "#left-sidebar-navigation-list", - "#user_presences", + "#buddy-list-users-matching-view", "#send_later_options", ]; diff --git a/web/src/ui_init.js b/web/src/ui_init.js index 5f3557d493..7a3e844efb 100644 --- a/web/src/ui_init.js +++ b/web/src/ui_init.js @@ -186,7 +186,7 @@ function initialize_right_sidebar() { ); } - $("#user_presences").on("mouseenter", ".user_sidebar_entry", (e) => { + $("#buddy-list-users-matching-view").on("mouseenter", ".user_sidebar_entry", (e) => { const $status_emoji = $(e.target).closest(".user_sidebar_entry").find("img.status-emoji"); if ($status_emoji.length) { const animated_url = $status_emoji.data("animated-url"); @@ -196,7 +196,7 @@ function initialize_right_sidebar() { } }); - $("#user_presences").on("mouseleave", ".user_sidebar_entry", (e) => { + $("#buddy-list-users-matching-view").on("mouseleave", ".user_sidebar_entry", (e) => { const $status_emoji = $(e.target).closest(".user_sidebar_entry").find("img.status-emoji"); if ($status_emoji.length) { const still_url = $status_emoji.data("still-url"); diff --git a/web/src/user_card_popover.js b/web/src/user_card_popover.js index f84287eeee..141c3ed885 100644 --- a/web/src/user_card_popover.js +++ b/web/src/user_card_popover.js @@ -787,13 +787,13 @@ function register_click_handlers() { $("body").on("click", ".update_status_text", open_user_status_modal); // Clicking on one's own status emoji should open the user status modal. - $("#user_presences").on( + $("#buddy-list-users-matching-view").on( "click", ".user_sidebar_entry_me .status-emoji", open_user_status_modal, ); - $("#user_presences").on("click", ".user-list-sidebar-menu-icon", (e) => { + $("#buddy-list-users-matching-view").on("click", ".user-list-sidebar-menu-icon", (e) => { e.stopPropagation(); const $target = $(e.currentTarget).closest("li"); diff --git a/web/styles/dark_theme.css b/web/styles/dark_theme.css index 74305b5367..68b44286a1 100644 --- a/web/styles/dark_theme.css +++ b/web/styles/dark_theme.css @@ -756,8 +756,8 @@ } } - #user_presences li:hover, - #user_presences li.highlighted_user { + #buddy-list-users-matching-view li:hover, + #buddy-list-users-matching-view li.highlighted_user { background-color: hsl(136deg 25% 73% / 20%); } diff --git a/web/styles/right_sidebar.css b/web/styles/right_sidebar.css index 8b2079970c..2ec839cc87 100644 --- a/web/styles/right_sidebar.css +++ b/web/styles/right_sidebar.css @@ -13,7 +13,7 @@ $user_status_emoji_width: 24px; overflow: auto; } -#user_presences { +#buddy-list-users-matching-view { max-width: 95%; overflow-x: hidden; list-style-position: inside; /* Draw the bullets inside our box */ diff --git a/web/templates/right_sidebar.hbs b/web/templates/right_sidebar.hbs index e152ad02cd..b469c976a2 100644 --- a/web/templates/right_sidebar.hbs +++ b/web/templates/right_sidebar.hbs @@ -18,7 +18,7 @@
-
    +
      diff --git a/web/tests/activity.test.js b/web/tests/activity.test.js index 6577c267ef..113a6a4500 100644 --- a/web/tests/activity.test.js +++ b/web/tests/activity.test.js @@ -247,7 +247,7 @@ function buddy_list_add(user_id, $stub) { } $stub.length = 1; const sel = `li.user_sidebar_entry[data-user-id='${CSS.escape(user_id)}']`; - $("#user_presences").set_find_results(sel, $stub); + $("#buddy-list-users-matching-view").set_find_results(sel, $stub); } test("direct_message_update_dom_counts", () => { @@ -305,7 +305,7 @@ test("handlers", ({override, mock_template}) => { keys: [me.user_id, alice.user_id, fred.user_id], }); activity_ui.set_cursor_and_filter(); - $("#user_presences").empty = () => {}; + $("#buddy-list-users-matching-view").empty = () => {}; $me_li = $.create("me stub"); $alice_li = $.create("alice stub"); @@ -599,7 +599,7 @@ test("realm_presence_disabled", () => { test("redraw_muted_user", () => { muted_users.add_muted_user(mark.user_id); activity_ui.redraw_user(mark.user_id); - assert.equal($("#user_presences").html(), "never-been-set"); + assert.equal($("#buddy-list-users-matching-view").html(), "never-been-set"); }); test("update_presence_info", ({override}) => { @@ -655,7 +655,7 @@ test("initialize", ({override, mock_template}) => { function clear() { $.clear_all_elements(); - buddy_list.$container = $("#user_presences"); + buddy_list.$container = $("#buddy-list-users-matching-view"); buddy_list.$container.append = () => {}; clear_buddy_list(); page_params.presences = {}; diff --git a/web/tests/buddy_list.test.js b/web/tests/buddy_list.test.js index 13d46ea56e..e9631d3d67 100644 --- a/web/tests/buddy_list.test.js +++ b/web/tests/buddy_list.test.js @@ -72,7 +72,7 @@ run_test("basics", ({override}) => { override(padded_widget, "update_padding", () => {}); let appended; - $("#user_presences").append = (html) => { + $("#buddy-list-users-matching-view").append = (html) => { assert.equal(html, "html-stub"); appended = true; };