webshim polyfill for <input type="datetime-local"> stopped working in Firefox 57 Quantum

789 Views Asked by At

I've been using webshim for polyfilling <input type="datetime-local"> in a project I'm working on. The input type works natively in Chrome and Edge, but webshim gets invoked with Internet Explorer, and used to in Firefox up to version 56.

It all worked fine until two weeks ago when Firefox was automatically updated to version 57 aka "Quantum". <input type="datetime-local"> still isn't supported natively in that version, but for some reason, webshim also stopped to polyfill it. It's now displayed as a plain text input.

I've googled a bit to find if other people have had the same problem and hopefully a solution, but to no avail. I've also googled up pages that use the datetime-local input type, some of which with webshim as polyfill, and it seems it stopped working everywhere. Now I'm stumped.

So has anyone here come across the same problem, and perhaps found a solution or workaround? Assuming the developers of Firefox won't add support for <input type="datetime-local"> anytime soon, and that I'm not doing anything wrong, that means we either have to wait for the webshim developers to fix the problem, or I'll have to look for a different polyfill ...

Does anyone here know if webshim will be updated to fix that problem? Failing that, what other polyfills would be recommendable? I don't really want to switch unless I have to. Any thoughts appreciated.

Here's the relevant code (lots of stuff snipped for brevity):

<body>
  <form name="form" id="form" action="/results/" method="POST">
    <input type="datetime-local" name="date1" id="date1" value="1999-01-01T00:00">
    <input type="datetime-local" name="date2" id="date2" value="2038-01-01T00:00">
  </form>

  <script type="text/javascript" src="/js/vendor/jquery.js"></script>
  <script type="text/javascript" src="/js/vendor/jquery-migrate-3.0.0.min.js"></script>
  <script type="text/javascript" src="/js/vendor/js-webshim/minified/polyfiller.js"></script>
  <script type="text/javascript" src="/js/site.js"></script>

  <script type="text/javascript">
    $(window).ready(function () {                
      webshim.polyfill('forms forms-ext');
    });
  </script>
</body>

Thank you so much :)

0

There are 0 best solutions below