paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-03 13:33:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

stream_create: Use ListWidget to render list of all users.

Browse Source 
This improves the UX of creating a stream for atleast 1000+ users
realm by showing the the stream creation form much faster than
before.

Search, user addition, scrolling worked smoothly on 15k+
users realm as tested on dev setup.

Also, simplebar is used to replace the default scrollbar.

Fixes #16805
This commit is contained in:
Aman Agrawal
2021-04-22 21:40:09 +00:00
committed by Tim Abbott
parent 7a58446c82
commit 384156c307
9 changed files with 150 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
frontend_tests/node_tests/list_widget.js
View File

@@ -219,6 +219,7 @@ run_test("filtering", () => {
// is a glorified indexOf call.)
search_input.val = () => "g";
search_input.simulate_input_event();
assert.deepEqual(widget.get_current_list(), ["dog", "egg", "grape"]);
expected_html = "<div>dog</div><div>egg</div><div>grape</div>";
assert.deepEqual(container.appended_data.html(), expected_html);

24
frontend_tests/node_tests/people.js
View File

@@ -492,9 +492,27 @@ test_people("get_people_for_stream_create", () => {
const others = people.get_people_for_stream_create();
const expected = [
{email: "alice1@example.com", user_id: alice1.user_id, full_name: "Alice"},
{email: "alice2@example.com", user_id: alice2.user_id, full_name: "Alice"},
{email: "bob@example.com", user_id: bob.user_id, full_name: "Bob van Roberts"},
{
email: "alice1@example.com",
user_id: alice1.user_id,
full_name: "Alice",
checked: false,
disabled: false,
},
{
email: "alice2@example.com",
user_id: alice2.user_id,
full_name: "Alice",
checked: false,
disabled: false,
},
{
email: "bob@example.com",
user_id: bob.user_id,
full_name: "Bob van Roberts",
checked: false,
disabled: false,
},
];
assert.deepEqual(others, expected);
});

32
frontend_tests/puppeteer_tests/subscriptions.ts
View File

@@ -6,11 +6,11 @@ import common from "../puppeteer_lib/common";
async function user_checkbox(page: Page, name: string): Promise<string> {
const user_id = await common.get_user_id_from_name(page, name);
return `#user-checkboxes [data-user-id="${CSS.escape(user_id.toString())}"]`;
return `#user_checkbox_${CSS.escape(user_id.toString())}`;
}
async function user_span(page: Page, name: string): Promise<string> {
return (await user_checkbox(page, name)) + " input ~ span";
return (await user_checkbox(page, name)) + " span";
}
async function stream_checkbox(page: Page, stream_name: string): Promise<string> {
@@ -26,7 +26,7 @@ async function wait_for_checked(page: Page, user_name: string, is_checked: boole
const selector = await user_checkbox(page, user_name);
await page.waitForFunction(
(selector: string, is_checked: boolean) =>
$(selector).find("input")[0].checked === is_checked,
$(selector).find("input").prop("checked") === is_checked,
{},
selector,
is_checked,
@@ -98,17 +98,11 @@ async function open_copy_from_stream_dropdown(
await page.waitForSelector(rome_checkbox, {visible: true});
}
async function test_check_all_only_affects_visible_users(page: Page): Promise<void> {
await page.click(".subs_set_all_users");
async function verify_check_all_only_affects_visible_users(page: Page): Promise<void> {
await wait_for_checked(page, "cordelia", false);
await wait_for_checked(page, "othello", true);
}
async function test_uncheck_all(page: Page): Promise<void> {
await page.click(".subs_unset_all_users");
await wait_for_checked(page, "othello", false);
}
async function clear_ot_filter_with_backspace(page: Page): Promise<void> {
await page.click(".add-user-list-filter");
await page.keyboard.press("Backspace");
@@ -132,6 +126,8 @@ async function test_user_filter_ui(
rome_checkbox: string,
): Promise<void> {
await page.waitForSelector("form#stream_creation_form", {visible: true});
// Desdemona should be checked by default
await wait_for_checked(page, "desdemona", true);
await common.fill_form(page, "form#stream_creation_form", {user_list_filter: "ot"});
await page.waitForSelector("#user-checkboxes", {visible: true});
@@ -142,11 +138,17 @@ async function test_user_filter_ui(
await page.waitForSelector(scotland_checkbox, {visible: true});
await page.waitForSelector(rome_checkbox, {visible: true});
await test_check_all_only_affects_visible_users(page);
await test_uncheck_all(page);
// Test check all
await page.click(".subs_set_all_users");
await clear_ot_filter_with_backspace(page);
await verify_filtered_users_are_visible_again(page, cordelia_checkbox, othello_checkbox);
await verify_check_all_only_affects_visible_users(page);
// Test unset all
await page.click(".subs_unset_all_users");
await verify_filtered_users_are_visible_again(page, cordelia_checkbox, othello_checkbox);
await wait_for_checked(page, "cordelia", false);
await wait_for_checked(page, "othello", false);
}
async function create_stream(page: Page): Promise<void> {
@@ -157,8 +159,10 @@ async function create_stream(page: Page): Promise<void> {
});
await page.click(await stream_span(page, "Scotland")); // Subscribes all users from Scotland
await page.click(await user_span(page, "cordelia")); // Add cordelia.
await wait_for_checked(page, "cordelia", true);
await page.click(await user_span(page, "desdemona")); // Add cordelia.
await page.click(await user_span(page, "othello")); // Remove othello who was selected from Scotland.
await wait_for_checked(page, "cordelia", true);
await wait_for_checked(page, "desdemona", true); // Add desdemona back as we did unset all in last test.
await wait_for_checked(page, "othello", false);
await page.click("form#stream_creation_form button.button.sea-green");
await page.waitForFunction(() => $(".stream-name").is(':contains("Puppeteer")'));