elastic/kibana

[Watcher] Webhook password field breaks dark mode when filled

Open

#180,967 建立於 2024年4月16日

在 GitHub 查看
 (1 留言) (0 反應) (0 負責人)TypeScript (19,065 star) (8,021 fork)batch import
Feature:WatcherTeam:Kibana Managementbuggood first issue

描述

When testing https://github.com/elastic/kibana/pull/180331, I noticed that in the Watcher plugin there is a small issue when using the dark mode. To reproduce:

  1. The browser needs to have a password saved and configured to automatically fill out the fields
  2. Enable the dark mode in the Advanced settings
  3. Navigate to Watcher and start creating a threshold alert
  4. Add a webhook in the dropdown "Add action"
  5. The pre-filled password field is not displayed correctly in the dark mode

Screen recording

https://github.com/elastic/kibana/assets/6585477/af210331-1c42-4d41-8960-11a8b7d4bb1e

Screenshot

貢獻者指南

技術棧
typescriptreact
領域
frontendaccessibility
議題類型
bug
難度面向新貢獻者的預計實作難度，1 表示很小改動，5 表示專家級工作。
2
預計時間有經驗貢獻者完成調查、實作、測試並準備 pull request 的粗略時間範圍。
1-3 hours
活動狀態議題目前的可參與程度：新鮮、活躍、陳舊、阻塞或等待維護者輸入。
fresh
清晰度議題是否清楚說明預期改動、驗收標準和下一步。
mostly clear
前置要求
CSS knowledgeKibana dev environment setup
新手友善度1-100 的估計分數，表示該議題對首次貢獻者的友善程度。
70
研究方向
Investigate the Watcher plugin's webhook password field styling. The issue is a CSS bug where a pre filled password field does not adhere to dark mode styles. Look at the component rendering the password input in the webhook form, likely under `plugins/watcher/public/` or similar. Check if the dark mode CSS variables or classes are correctly applied. A potential fix could involve adding a CSS rule for `.euiFieldPassword` or similar when the input is autofilled, ensuring it uses the dark theme background and text colors. Review the linked PR #180331 for context. The fix should be localized to the password field's styling in dark mode.
[Watcher] Webhook password field breaks dark mode when filled · elastic/kibana#180967 | Good First Issue