Skip to content

[textfield] Fix autofill styles always in dark mode when CSS variables is used#48244

Merged
mj12albert merged 6 commits intomui:masterfrom
ZeeshanTamboli:issue-48118-textfield-style-always-in-dark-mode-cssVariables-autofill
Apr 13, 2026
Merged

[textfield] Fix autofill styles always in dark mode when CSS variables is used#48244
mj12albert merged 6 commits intomui:masterfrom
ZeeshanTamboli:issue-48118-textfield-style-always-in-dark-mode-cssVariables-autofill

Conversation

@ZeeshanTamboli
Copy link
Copy Markdown
Member

@ZeeshanTamboli ZeeshanTamboli commented Apr 9, 2026

Fixes #48118

This fixes autofill styling for OutlinedInput and FilledInput when CSS theme variables are enabled. Previously, the dark autofill override was wrapped with theme.getColorSchemeSelector('dark'), which falls back to & when no dark color scheme is configured, causing the dark background styles to apply unconditionally even in light mode. The change moves the shared autofill border radius styles to the base :-webkit-autofill rule and uses theme.applyStyles('dark', ...) so the dark colors are only emitted when a dark scheme actually exists.


Before fix : https://stackblitz.com/edit/sgp19fdu?file=src%2FDemo.tsx
After fix: https://stackblitz.com/edit/sgp19fdu-bln82ebd?file=src%2FDemo.tsx

@ZeeshanTamboli ZeeshanTamboli added type: bug It doesn't behave as expected. scope: text field Changes related to the text field. labels Apr 9, 2026
@mui-bot
Copy link
Copy Markdown

mui-bot commented Apr 9, 2026

Netlify deploy preview

https://deploy-preview-48244--material-ui.netlify.app/

Bundle size report

Bundle Parsed size Gzip size
@mui/material ▼-206B(-0.04%) ▼-20B(-0.01%)
@mui/lab 0B(0.00%) 0B(0.00%)
@mui/system 0B(0.00%) 0B(0.00%)
@mui/utils 0B(0.00%) 0B(0.00%)

Details of bundle changes

Generated by 🚫 dangerJS against 041acb4

@ZeeshanTamboli ZeeshanTamboli marked this pull request as ready for review April 9, 2026 06:19
@mj12albert mj12albert enabled auto-merge (squash) April 13, 2026 14:16
@mj12albert mj12albert merged commit c4105df into mui:master Apr 13, 2026
19 checks passed
@ZeeshanTamboli ZeeshanTamboli deleted the issue-48118-textfield-style-always-in-dark-mode-cssVariables-autofill branch April 13, 2026 14:29
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

scope: text field Changes related to the text field. type: bug It doesn't behave as expected.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[text field] autofill style always in dark mode if cssVariables activated

3 participants