Hi! I have issue with TextField label if variant="filled" is set then label will become blurry on focus or unfocus.
Current Behavior 😯
https://codesandbox.io/s/material-demo-2ymqu
Click to edit field and you will see blurry label for about 1 second like this

Then it will return to correct crisp view

If variant="filled" not set label always crisp.
Expected Behavior 🤔
Label should be always stay crisp (not blurry).
Context 🔦
It seems that this is old CSS Translate issue in Chrome browsers with hardware acceleration turns on.
I don't have such issue in Firefox for example.
Also interesting fact that Google doesn't have this issue in their signup page.
Please help! Thank you!
Your Environment 🌎
| Tech |
Version |
| Material-UI |
v4.4.2 |
| React |
v16.9.0 |
| Browser |
Version 77.0.3865.75 (Official Build) (64-bit) (same in v76) |
Hi! I have issue with TextField label if variant="filled" is set then label will become blurry on focus or unfocus.
Current Behavior 😯
https://codesandbox.io/s/material-demo-2ymqu
Click to edit field and you will see blurry label for about 1 second like this


Then it will return to correct crisp view
If variant="filled" not set label always crisp.
Expected Behavior 🤔
Label should be always stay crisp (not blurry).
Context 🔦
It seems that this is old CSS Translate issue in Chrome browsers with hardware acceleration turns on.
I don't have such issue in Firefox for example.
Also interesting fact that Google doesn't have this issue in their signup page.
Please help! Thank you!
Your Environment 🌎