sadpandajoe opened a new pull request, #42091:
URL: https://github.com/apache/superset/pull/42091
### SUMMARY
In the Alerts & Reports modal, typing into the "Email recipients" select
(and the CC/BCC fields) showed no visible text — the characters were accepted
but invisible, so users couldn't see the emails they were entering.
Root cause: `StyledNotificationMethod` styles the recipient selects with an
`.email-recipient-select > div { width: 100% }` rule that was written for the
antd v5 DOM, where the select's direct child div was `.ant-select-selector` and
forcing full width was correct. After the antd v5→v6 upgrade (#41636), the
direct child div is `.ant-select-content`; forcing `width: 100%` on it
collapses it to zero width, which shrinks the search input inside it to ~4px —
the typed text renders inside an invisible sliver. Verified in a real browser
by injecting the modal's CSS cascade rule-by-rule into an isolated Select
render: only this rule collapses the input (89px → 4px).
The fix keeps the full-width rule on the select root only and drops the `>
div` half. The surrounding `.email-recipient-container` is a stretch flex
column, so the selects still fill the modal width.
Also adds `NotificationMethodEmailRecipients.test.tsx`, which renders the
real `AsyncSelect` (the existing `NotificationMethod.test.tsx` mocks it, which
is why it couldn't catch this):
- a CSS regression test asserting the alerts CSS doesn't override the width
of antd Select internals — verified to fail with the old rule and pass with the
fix
- behavioral coverage that a typed email stays visible and becomes a
selectable option
### BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
Before: typing into Email recipients shows nothing (the search input is
collapsed to ~4px wide).
After: typed text is visible while typing, appears as a selectable option,
and selected recipients render as tags.
### TESTING INSTRUCTIONS
1. Go to Alerts & Reports → add (or edit) a report.
2. Expand the "Notification method" section with the Email method selected.
3. Start typing an email address into "Email recipients".
4. The typed text should be visible, and the typed address should appear as
a selectable option; selecting it should render a tag. Same for the CC/BCC
fields.
Unit tests: `npx jest
src/features/alerts/components/NotificationMethodEmailRecipients.test.tsx`
### ADDITIONAL INFORMATION
- [ ] Has associated issue:
- [ ] Required feature flags:
- [x] Changes UI
- [ ] Includes DB Migration (follow approval process in
[SIP-59](https://github.com/apache/superset/issues/13351))
- [ ] Migration is atomic, supports rollback & is backwards-compatible
- [ ] Confirm DB migration upgrade and downgrade tested
- [ ] Runtime estimates and downtime expectations provided
- [ ] Introduces new feature or API
- [ ] Removes existing feature or API
🤖 Generated with [Claude Code](https://claude.com/claude-code)
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
