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

ms edge not working with lastest version #93

Closed userquin closed 7 years ago

userquin commented 7 years ago

@motss can you test component page with ms edge? Also test with previous version 2.10.1.

my edge on windows 10 (64 bits) home edition, also not working at office (Professional edition) Microsoft Edge 38.14393.1066.0 Microsoft EdgeHTML 14.14393

ms-edge

motss commented 7 years ago

@userquin That's something need to be fixed.

userquin commented 7 years ago

There is a strange behavior with the + cast operator, at least on Edge:

          if (i >= _start & i < _start + _totalDays) {
            _dateObj.date = +_formatted;
            _dateObj.index = +j;
          }

if changing the + cast forcing it explicitly, also works in Edge (and of course in firefox and chrome):

          if (i >= _start & i < _start + _totalDays) {
            _dateObj.date = ''+_formatted;
            _dateObj.index = ''+j;
          }

By the way, change the & operator by && in if statement... ;)

motss commented 7 years ago

@userquin the & operator is definitely a mistake and never know this had run into issue. 😢

But don't understand what going on with the + shorthand and in your fixed, it basically becomes a string and not a number type. Could you please explain on your fix?

userquin commented 7 years ago

is a problem with ms edge not mine, changing _dateObj.date = +_formatted; to _dateObj.date = ''+_formatted; just works on all navigator...

the & operator: problem with my IDE (Intellij or webstorm) tells me it its a bitwise operator not a logical operator...

thomasd commented 7 years ago

Hey, had the same error with latest version (2.11.1) on IE11 (Windows 7 64bit).

After some research I think I found the problem: IE11+ (including Edge) includes LTR/RTL unicode characters around the formatted date string coming from DateTimeFormat.format. This hidden characters are the reason why the conversion of the string to number with the +-sign results in "NaN". This is apperently by design and not a bug! (See: https://stackoverflow.com/a/25813272) I suggest a different fix, than described above by @userquin: To remove all special characters from the string use this: Str.replace(/[^ -~]/g,''). So for temporary fix I changed line 927 in app-datepicker.html to: var _formatted = _formatter(Date.UTC(_activeYear, _activeMonth, j)).replace(/[^ -~]/g,''); This should work in all browsers, I tested IE11 and Chrome.

But why is the formatted day converted to a number anyway? Is this necessary anywhere? If only for display in the calender, I would suggest to remove the conversion altogether and just display whatever the browser returns.

userquin commented 7 years ago

Latest version does not include #94 so the problem is not yet fixed. Maybe can be fixed with your approach, wait @motss answer (I suggest you to submit a new pull request).

gudatcomputers commented 7 years ago

@thomasd this fix totally worked for me.. I'm eager for a PR. Can you submit? I didn't want to resubmit a PR of your work and "try to take credit" I'm relegated to bundling bower_components in my git repo for now.

motss commented 7 years ago

@thomasd @gudatcomputers @userquin This seems like a more favorable fix to the issue. I'll try to make this patch available as soon as possible. Sorry for the long waiting.