Aspnetcore: Blazor: @onchange event not working on input with type="datetime-local" in some browsers

[craigbrown]

Describe the bug

The "datetime-local" input type is currently only supported on Chrome and Edge. On browsers that don't support it (e.g. Safari or Firefox on desktop) it gracefully degrades to a "text" type input. If I try to use the @onchange attribute on a supported browser this works fine and the method assigned to it is called when I make a change.

<input type="datetime-local" value=@dateTimeString @onchange=DateTimeChanged />

But if I try to use the @onchange attribute on this input in an unsupported browser, the method is not called and I get this error in the console.

Error: Invalid element type 'text'.

It seems like the error is coming from line 249 of EventForDotNet.ts. It's expecting the element to be of type "datetime-local" since that's what it was declared as, but the browser is providing it as type "text". That's my guess anyway.

To Reproduce

Here's a minimalistic repro project. All relevant code is in the Index.razor file.

Exceptions (if any)

No exceptions in the IDE, just this error in the browser console.

Error: Invalid element type 'text'.

Further technical details

• ASP.NET Core version: 3.1.6 (Blazor v3.2.1)
• Include the output of dotnet --info:

.NET Core SDK (reflecting any global.json):
 Version:   3.1.302
 Commit:    41faccf259

Runtime Environment:
 OS Name:     Mac OS X
 OS Version:  10.15
 OS Platform: Darwin
 RID:         osx.10.15-x64
 Base Path:   /usr/local/share/dotnet/sdk/3.1.302/

Host (useful for support):
  Version: 3.1.6
  Commit:  3acd9b0cd1

.NET Core SDKs installed:
  3.1.200 [/usr/local/share/dotnet/sdk]
  3.1.202 [/usr/local/share/dotnet/sdk]
  3.1.300 [/usr/local/share/dotnet/sdk]
  3.1.301 [/usr/local/share/dotnet/sdk]
  3.1.302 [/usr/local/share/dotnet/sdk]

.NET Core runtimes installed:
  Microsoft.AspNetCore.App 3.1.2 [/usr/local/share/dotnet/shared/Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 3.1.4 [/usr/local/share/dotnet/shared/Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 3.1.5 [/usr/local/share/dotnet/shared/Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 3.1.6 [/usr/local/share/dotnet/shared/Microsoft.AspNetCore.App]
  Microsoft.NETCore.App 2.1.17 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.18 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.19 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.20 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App]
  Microsoft.NETCore.App 3.1.2 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App]
  Microsoft.NETCore.App 3.1.4 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App]
  Microsoft.NETCore.App 3.1.5 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App]
  Microsoft.NETCore.App 3.1.6 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App]

To install additional .NET Core runtimes or SDKs:
  https://aka.ms/dotnet-download

• The IDE (VS / VS Code/ VS4Mac) you're running on, and it's version: VS for Mac 8.6.6 Build 11.

• I can reproduce this on both server-side Blazor and WebAssembly Blazor.

[mkArtakMSFT]

Thanks for contacting us.
Support of datetime-local is somewhat problematic: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime-local

We will look into what can be done here in the future.

[msftbot[bot]]

We've moved this issue to the Backlog milestone. This means that it is not going to be worked on for the coming release. We will reassess the backlog following the current release and consider this item at that time. To learn more about our issue management process and to have better expectation regarding different types of issues you can read our Triage Process.

[craigbrown]

Yeah there is definitely an unfortunate lack of support in some browsers! The issue is that while these browsers "degrade gracefully", Blazor doesn't. Thanks for looking into it, hopefully this is something that can be easily fixed in future.

[craigbrown]

Also, I just noticed the enhancement tag - I initially described this as a bug rather than an enhancement since I think it's unexpected behaviour. In a browser that doesn't support datetime-local, I would expect that Blazor would treat it as a text input (in the same way JavaScript would), but it doesn't.