value="12:30" results in "12:30 AM" being displayed

[baldwindavid]

Thanks for this polyfill. It is almost perfect, but the one issue I see is a showstopper for me. In Safari, there does not seem to be a way to set a value on an input that will result in times within the 12pm hour. Or perhaps I'm doing it wrong. The result is always an input displaying 12am.

Here is a JSBin demonstrating the issue (when viewed in Safari).
https://jsbin.com/huyowaxeza/edit?html,output

I read in another issue that you don't have access to Safari, so this is probably not going anywhere, but am reporting anyway. Thanks.

[Dan503]

Is it definitely only in Safari? So IE11 works as expected?

I was able to reproduce the last safari bug by forcing Firefox to display the time input as a polyfill. Maybe that will work here as well.

I'm also working on a major re-write at the moment which might also fix this issue.

[baldwindavid]

Sorry, I actually don't know if it works in IE11. I'm not super-concerned about supporting that since MS is actively trying to kill it. I can only test MS Edge free via Browserstack. I'm on a Mac, so can test Safari.

Here is a JSBin that I think forces the polyfill in all browsers. It seems to break in both Chrome and Firefox in a different way than this 12:30 issue.
https://jsbin.com/gopurah/edit?html,output

For now, I am using Cleave.js. It's awkward because, while it supports 12 hour time entry, it doesn't include a way to set am or pm. Thus, I'm using a separate select for that part, which makes for more moving pieces.

The native Chrome/Firefox time inputs are my favorite user experience, so I really like the intent of this polyfill.

[Dan503]

I think this is a core bug in how I implemented it that is not browser specific. Thanks for picking up on it. I'll fix this up as when I get a chance.

[Dan503]

Fixed in v1.0.9

[baldwindavid]

Excellent. Thanks for fixing it up so quickly. This is working great in Safari. I've switched back to using it and will let you know if I run into any other issues.