motss / app-datepicker

Datepicker element built with Google's lit and Material Design 2021
https://npm.im/app-datepicker
MIT License
180 stars 51 forks source link

IE 11 - Date Picker does not show up on the page #154

Closed kaseyhinton closed 5 years ago

kaseyhinton commented 5 years ago

Description

The app-datepicker element wont work in IE 11. It throws a type error

TypeError: Unable to get property 'toString' of undefined or null reference at AppDatepicker (http://localhost:3000/node_modules/app-datepicker/dist/app-datepicker.js:230:7)

Expected outcome

Date picker should show up and work in IE 11

Actual outcome

Date picker not showing in IE 11 due to type error

Live Demo

I do not have time to set up a live demo. Maybe later this week I can

Steps to reproduce

My environment is Typescript 3.5.1 and Lit Element 2.2.0

  1. Put a app-datepicker element in the page.
  2. Open the page in a IE 11.
  3. Open console to view error

Browsers Affected

motss commented 5 years ago

Which version of the datepicker are you using?

I actually have a demo at https://github.com/motss/app-datepicker/blob/master/README.md#demo. Does it work for you?

In the meantime, I'll take a look when I have my laptop with me.

motss commented 5 years ago

@kaseyhinton Do you have got tht time to work on a reduced test case? I've checked it on my side and it works on IE11 without any issue except for the animation glitch which was caused by Web Animations polyfill. I might plan to remove animations completely on older browsers.

kaseyhinton commented 5 years ago

@motss The demo you have provided works for me in IE 11. I will try to set up a demonstration of the bug I am seeing. As far as the version is concerned I installed the latest available at the time. RC 24 I believe.

kaseyhinton commented 5 years ago

@motss Here is a repo I made that can reproduce the problem I am seeing. demo

I tried to set up an example online but am having difficulty because codesandbox and codepen aren't working in IE-11 unfortunately.

motss commented 5 years ago

Errors are due to missing polyfills on IE11. It was mentioned inside the demo but not the docs.

https://github.com/motss/app-datepicker/blob/master/index.html#L19-L43

The line above is what you need to run the datepicker.

motss commented 5 years ago

I tried to set up an example online but am having difficulty because codesandbox and codepen aren't working in IE-11 unfortunately.

For some reasons, the website does not work well on IE11. You still be able to view the actual site though. The trick is to wake the server up in supported browsers such as Chrome and visit the link again with IE11.

I've ensured that the demo site works on all browsers including IE11.

kaseyhinton commented 5 years ago

Ahh okay. Yeah it's working with the polyfills now. Thanks for getting back to me so promptly. This date picker will work really well for me! :)

motss commented 5 years ago

Glad to hear that it finally works for you. Feel free to open any issues you encounter. Thank you for supporting! 😄