mirror of
https://github.com/zulip/zulip.git
synced 2025-10-23 04:52:12 +00:00
6f6e3b9f48
This commit improves the styling of the default user status options in the status picker modal by adding hover, focus and active state styles similar to that of the popover menu options. Fixes #35005.
59 lines
2.4 KiB
TypeScript
59 lines
2.4 KiB
TypeScript
import type {Page} from "puppeteer";
|
|
|
|
import * as common from "./lib/common.ts";
|
|
|
|
async function open_set_user_status_modal(page: Page): Promise<void> {
|
|
await page.click("#personal-menu");
|
|
await page.waitForSelector("#personal-menu-dropdown", {visible: true});
|
|
// We are using evaluate to click because it is very hard to detect if
|
|
// the personal menu popover has opened.
|
|
await page.evaluate(() => {
|
|
document.querySelector<HTMLAnchorElement>(".update_status_text")!.click();
|
|
});
|
|
|
|
// Wait for the modal to completely open.
|
|
await common.wait_for_micromodal_to_open(page);
|
|
}
|
|
|
|
async function test_user_status(page: Page): Promise<void> {
|
|
await open_set_user_status_modal(page);
|
|
// Check by clicking on common statues.
|
|
await page.click(".user-status-option:nth-child(2) .user-status-value");
|
|
await page.waitForFunction(
|
|
() => document.querySelector<HTMLInputElement>(".user-status")!.value === "In a meeting",
|
|
);
|
|
// It should select calendar emoji.
|
|
await page.waitForSelector(".selected-emoji.emoji-1f4c5");
|
|
|
|
// Clear everything.
|
|
await page.click("#clear_status_message_button");
|
|
await page.waitForFunction(
|
|
() => document.querySelector<HTMLInputElement>(".user-status")!.value === "",
|
|
);
|
|
await page.waitForSelector(".status-emoji-wrapper .smiley-icon", {visible: true});
|
|
|
|
// Manually adding everything.
|
|
await page.type(".user-status", "Busy");
|
|
const tada_emoji_selector = ".emoji-1f389";
|
|
await page.click(".status-emoji-wrapper .smiley-icon");
|
|
// Wait until emoji popover is opened.
|
|
await page.waitForSelector(`.emoji-popover ${tada_emoji_selector}`, {visible: true});
|
|
await page.click(`.emoji-popover ${tada_emoji_selector}`);
|
|
await page.waitForSelector(".emoji-picker-popover", {hidden: true});
|
|
await page.waitForSelector(`.selected-emoji${tada_emoji_selector}`);
|
|
|
|
await page.click("#set-user-status-modal .dialog_submit_button");
|
|
// It should close the modal after saving.
|
|
await page.waitForSelector("#set-user-status-modal", {hidden: true});
|
|
|
|
// Check if the emoji is added in user presence list.
|
|
await page.waitForSelector(`.user-presence-link .status-emoji${tada_emoji_selector}`);
|
|
}
|
|
|
|
async function user_status_test(page: Page): Promise<void> {
|
|
await common.log_in(page);
|
|
await test_user_status(page);
|
|
}
|
|
|
|
common.run_test(user_status_test);
|