[Blazor] onclick event no working on some element in iPhone browser.

Given the following code:

@page "/"
@inject IJSRuntime js

<div onclick="@BlazorClickEvent">I am a div, click me to say hello</div>

@functions{
    private void BlazorClickEvent()
    {
        js.InvokeAsync<object>("alert", "Hello from a div");
    }
}

If you run this on a browser like Chrome or Edge and click the div, the alert message will pop-up. If you run this on an iPhone browser and click the div the alert will not pop-up.

Below is a link you can use for testing, the link will open a Blazor project with a green square div you can use for experimentation.

https://iosbug.azurewebsites.net/

Not sure if this matter or not but the iPhone I am using to test is an iPhone 6s (this is the only Apple device I have for testing).

[campersau]

Have you tried this? Which is the workaround mentioned in https://github.com/aspnet/AspNetCore/issues/10725#issuecomment-498167475

@page "/counter"

@currentCount

<div style="cursor:pointer" onclick=@IncrementCount>Click me</div>

@functions {
    int currentCount = 0;

    void IncrementCount()
    {
        currentCount++;
    }
}

[rxelizondo]

@SteveSandersonMS

1. I don’t believe that the alert is the cause of the problem. In the repro above, I show a button with an onclick event attached to it where the click event fires an alert. The onclick event is fired correctly and the alert message is displayed without any problems (while on iOS).

2. If I attach a JavaScrip onclick event to the div everything works fine, this tell me that under normal circumstances the click event works just fine.

That said, this looks like a Blazor issue, basically, whatever code you guys are generating behind the scenes to handle the click event is not agreeing with iOS.

Also, it is important to point out that the repro is extremely simplistic, it is just a barebones div with an onclick event attached to it (it can get any simpler that that). For such simplistic and common scenarios, it really doe not matter who the culprit is, this really needs to be handled by Blazor, if this was an oddball / corner case scenario then yes, a manual fix is justified but definite no in this case.

I will experiment later with this when time and resources permits (I don’t own an iPhone / iPad), however, like I said before, this overly simplistic scenario really needs to be handled by Blazor.