Textfield with type="date" not working correctly in chrome

[Timbuktu1982]

Hi there,

when i used a textfield with type="date" it working correctly in firefox, but not working correctly in chrome or edge. I miss the date-picker from browser. On your Demo-Page you can reproduce the problem...

I have always reported the issue in material-components/material-web#5795.

Can you help me?

[github-actions]

Thanks for the issue, @Timbuktu1982!

Please consider supporting the project by becoming a sponsor: GitHub Sponsors.

Sponsor issues get prioritized. If you get paid $100 per hour and this fix will save you an hour or more, then a $10 per month subscription for 10+ months will pay for itself.

[treeder]

Can you share screenshots of the problem?

[Timbuktu1982]

Yes, i can use your demo page.

Chrome is not working (date-picker on right side is missing):

Firefox is working (date-picker on right side is available):

The problem is also existent in material-components/material-web...

[treeder]

I've seen this before, it's only on dark theme. Light theme:

The icon is there in dark mode, it's just black so it's very hard to see. If you look closely you can see it though.

And it's a chrome issue:

https://stackoverflow.com/questions/62162645/change-color-of-calendar-icon-in-html-date-input

Can probably use something from there to fix it.

[Timbuktu1982]

Hi Treeder,

thank you for your reply. Thats a a good approach, but unfortunately the solutions given from Stackoverflow doesn't work for me either.
I have changed the Chrome display settings to the light theme, but the date picker is still not there.

Have you another idea?

[treeder]

I don't, I suspect the stuff in that stackoverflow article is the only way to do it. Can you share a screenshot of your light mode? I see it on chrome. I also see it on your dark mode, but it's black.

[Timbuktu1982]

Hi Treeder,

thank you for your reply and the screenshot.

I have discovered the button. I was expecting it on the far right (like in Firefox, show Screenshot), but it wasn't there. But with the screenshot I was able to locate the button better.

Firefox:

However, my application is still not working. There is no button to be seen (see screenshot below).

Is it possible that changes have already been made to the text field in your fork? I'm asking because I'm currently using the original version. I will install your version today and then test it. I will give you feedback.

[time4innovation]

Hi Treeder,

i have also tested with your fork repo and it works fine.

Now I have the problem that I can't use your fork repo in my project because I use the package https://github.com/maicol07/material-web-additions to get components for "card" and "data-table". This package uses @Material. So I can install your package, but I can't use your components, because when I import a component from your package, I get a conflict with the @material/web-package of the same name.

Have you an idea for what i can do? (I know, that would actually be worth a new topic.)

[Timbuktu1982]

Sorry, i have used my other account for the last answer. time4innovation is my company account...