<input type="date"> not updating in Edge browser

[Enkidatron]

I am using date inputs in an app, and have noticed that they behave strangely in Microsoft’s Edge browser. Specifically, if I provide a value (in ISO format), then the input element shows that date in ISO format (instead of local format) and never updates it, even if I select a new date. I can see that the onInput event fires and the model is updated with the new date, but the input element does not update its display. I only see this behavior on Edge. On other browsers, the input formats properly and updates when it should.

Here is an Ellie that demonstrates: https://ellie-app.com/7Yrf8GBhB7Ca1

Upon investigation, is appears that this only happens if I provide a value right from the start. In this modified Ellie, I start by providing a value of “”, and start providing the date in ISO format once one has been selected (instead of having a default starting date): https://ellie-app.com/7YrpcsrWckma1

I do not want to code up or use a custom date picker, as the vast majority of the users are using iOS Safari (where it works fine and the native date picker is pretty good).

Does anyone know why this would work this way? What can I do about this, other than make sure that the input element is always rendered at least once before I have a date value?

[rkb]

Moving the value attribute to after the id seems to work:

view : Model -> Html Msg
view model =
    div []
        [ button [ onClick Increment ] [ text "+1" ]
        , div [] [ Html.input 
            [ HAttr.type_ "date"
            , Html.Events.onInput SetDate
            , HAttr.id "input"
            , HAttr.value <| Date.toIsoString model.count
            ]
            []
            ]

Might be worth raising as a bug on Edge?

[Enkidatron]

Thanks @rkb! Inspired by your insight that moving the attributes around makes a difference, further experiment seems to show that what really controls it is whether the value is after type_ "date". See https://ellie-app.com/7ZFGfbX6mPga1

I have further experimented by using JS to manually create an input element, setting the value, and then setting the type, and verifying that it has this strange behavior.

I therefore believe that this is just a bug on Edge which I will try to raise with them.