Blazor WASM: Button-tag is not correctly disabled within a disabled fieldset

[StefanOssendorf]

Describe the bug

When placing a <button> within a <fieldset disabled> and the button contains anything other than plain text it's click handler ist executed eventhough it shouldn't be.

To Reproduce

The following code contains an enabled state and 3 disabled states where the first disabled state is really disabled and the last two are showing the non expected behavior.

@page "/"
@inject IJSRuntime JSRuntime

<h1>Test that a button-tag is clickable even though it's within a disabled fieldset</h1>

<div>
    <h3>Enabled fieldset</h3>
    <fieldset>
        <legend>Enabled fieldset</legend>
        <input type="text" />
        <button @onclick="ShowAlert" type="button">Click me!</button>
    </fieldset>
</div>

<br />

<div>
    <h3>Disabled fieldset</h3>
    <fieldset disabled>
        <legend>Enabled fieldset</legend>
        <input type="text" />
        <button @onclick="ShowAlert" type="button">Click me!</button>
    </fieldset>
</div>

<br />

<div>
    <h3>Disabled fieldset. But now the button can be clicked on the image.</h3>
    <fieldset disabled>
        <legend>Enabled fieldset</legend>
        <input type="text" />
        <button @onclick="ShowAlert" type="button">
            <img src="brokenLink.jpg" />
            Click me!
        </button>
    </fieldset>
</div>

<br />

<div>
    <h3>Disabled fieldset. But now the button can be clicked on the span.</h3>
    <fieldset disabled>
        <legend>Enabled fieldset</legend>
        <input type="text" />
        <button @onclick="ShowAlert" type="button">
            <span>Testspan</span>
            Click me!
        </button>
    </fieldset>
</div>


@code{
    public async Task ShowAlert()
    {
        await JSRuntime.InvokeVoidAsync("alert", "Hello from JS!").ConfigureAwait(false);
    }
}

Further technical details

• ASP.NET Core version
  5.0.302
• Include the output of dotnet --info

.NET SDK (gemäß "global.json"):
 Version:   5.0.302
 Commit:    c005824e35

Laufzeitumgebung:
 OS Name:     Windows
 OS Version:  10.0.19043
 OS Platform: Windows
 RID:         win10-x64
 Base Path:   c:\program files\dotnet\sdk\5.0.302\

Host (useful for support):
  Version: 6.0.0-preview.6.21352.12
  Commit:  770d630b28

.NET SDKs installed:
  1.0.0-preview2-003131 [c:\program files\dotnet\sdk]
  1.0.0 [c:\program files\dotnet\sdk]
  1.0.2 [c:\program files\dotnet\sdk]
  1.0.3 [c:\program files\dotnet\sdk]
  1.0.4 [c:\program files\dotnet\sdk]
  1.1.0 [c:\program files\dotnet\sdk]
  2.0.0 [c:\program files\dotnet\sdk]
  2.0.2-vspre-006949 [c:\program files\dotnet\sdk]
  2.0.2 [c:\program files\dotnet\sdk]
  2.0.3 [c:\program files\dotnet\sdk]
  2.1.2 [c:\program files\dotnet\sdk]
  2.1.4 [c:\program files\dotnet\sdk]
  2.1.100-preview-007363 [c:\program files\dotnet\sdk]
  2.1.100 [c:\program files\dotnet\sdk]
  2.1.101 [c:\program files\dotnet\sdk]
  2.1.103 [c:\program files\dotnet\sdk]
  2.1.104 [c:\program files\dotnet\sdk]
  2.1.200-preview-007517 [c:\program files\dotnet\sdk]
  2.1.200 [c:\program files\dotnet\sdk]
  2.1.201 [c:\program files\dotnet\sdk]
  2.1.202 [c:\program files\dotnet\sdk]
  2.1.301 [c:\program files\dotnet\sdk]
  2.1.400 [c:\program files\dotnet\sdk]
  2.1.401 [c:\program files\dotnet\sdk]
  2.1.402 [c:\program files\dotnet\sdk]
  2.1.403 [c:\program files\dotnet\sdk]
  2.1.524 [c:\program files\dotnet\sdk]
  2.1.600-preview-009472 [c:\program files\dotnet\sdk]
  2.1.600-preview-009497 [c:\program files\dotnet\sdk]
  2.1.600 [c:\program files\dotnet\sdk]
  2.1.601 [c:\program files\dotnet\sdk]
  2.1.617 [c:\program files\dotnet\sdk]
  2.1.700-preview-009601 [c:\program files\dotnet\sdk]
  2.1.700 [c:\program files\dotnet\sdk]
  2.1.701 [c:\program files\dotnet\sdk]
  2.1.800-preview-009677 [c:\program files\dotnet\sdk]
  2.1.800-preview-009696 [c:\program files\dotnet\sdk]
  2.1.800 [c:\program files\dotnet\sdk]
  2.1.816 [c:\program files\dotnet\sdk]
  3.0.100-preview6-012264 [c:\program files\dotnet\sdk]
  3.1.411 [c:\program files\dotnet\sdk]
  5.0.104 [c:\program files\dotnet\sdk]
  5.0.205 [c:\program files\dotnet\sdk]
  5.0.302 [c:\program files\dotnet\sdk]
  5.0.400-preview.21328.4 [c:\program files\dotnet\sdk]
  6.0.100-preview.5.21302.13 [c:\program files\dotnet\sdk]
  6.0.100-preview.6.21355.2 [c:\program files\dotnet\sdk]

.NET runtimes installed:
  Microsoft.AspNetCore.All 2.1.1 [c:\program files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.1.2 [c:\program files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.1.4 [c:\program files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.1.5 [c:\program files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.1.7 [c:\program files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.1.8 [c:\program files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.1.9 [c:\program files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.1.11 [c:\program files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.1.12 [c:\program files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.1.13 [c:\program files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.1.24 [c:\program files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.All 2.1.28 [c:\program files\dotnet\shared\Microsoft.AspNetCore.All]
  Microsoft.AspNetCore.App 2.1.1 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.1.2 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.1.4 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.1.5 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.1.7 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.1.8 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.1.9 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.1.11 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.1.12 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.1.13 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.1.24 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 2.1.28 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 3.0.0-preview6.19307.2 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 3.1.15 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 3.1.17 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 5.0.4 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 5.0.6 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 5.0.8 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 6.0.0-preview.5.21301.17 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 6.0.0-preview.6.21355.2 [c:\program files\dotnet\shared\Microsoft.AspNetCore.App]
  Microsoft.NETCore.App 1.0.1 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 1.0.4 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 1.0.5 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 1.1.1 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 1.1.2 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.0.0 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.0.3 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.0.5 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.0.6 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.0.7 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.0.9 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.1 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.2 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.3-servicing-26724-03 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.4 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.5 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.7 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.8 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.9 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.11 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.12 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.13 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.24 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 2.1.28 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 3.0.0-preview6-27804-01 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 3.1.4 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 3.1.15 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 3.1.17 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 5.0.4 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 5.0.6 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 5.0.8 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 6.0.0-preview.5.21301.5 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.NETCore.App 6.0.0-preview.6.21352.12 [c:\program files\dotnet\shared\Microsoft.NETCore.App]
  Microsoft.WindowsDesktop.App 3.0.0-preview6-27804-01 [c:\program files\dotnet\shared\Microsoft.WindowsDesktop.App]
  Microsoft.WindowsDesktop.App 3.1.4 [c:\program files\dotnet\shared\Microsoft.WindowsDesktop.App]
  Microsoft.WindowsDesktop.App 3.1.15 [c:\program files\dotnet\shared\Microsoft.WindowsDesktop.App]
  Microsoft.WindowsDesktop.App 3.1.17 [c:\program files\dotnet\shared\Microsoft.WindowsDesktop.App]
  Microsoft.WindowsDesktop.App 5.0.4 [c:\program files\dotnet\shared\Microsoft.WindowsDesktop.App]
  Microsoft.WindowsDesktop.App 5.0.6 [c:\program files\dotnet\shared\Microsoft.WindowsDesktop.App]
  Microsoft.WindowsDesktop.App 5.0.8 [c:\program files\dotnet\shared\Microsoft.WindowsDesktop.App]
  Microsoft.WindowsDesktop.App 6.0.0-preview.5.21301.4 [c:\program files\dotnet\shared\Microsoft.WindowsDesktop.App]
  Microsoft.WindowsDesktop.App 6.0.0-preview.6.21353.1 [c:\program files\dotnet\shared\Microsoft.WindowsDesktop.App]

• The IDE (VS / VS Code/ VS4Mac) you're running on, and its version
  VS 2019 Community, 16.10.4

[StefanOssendorf]

Addition: According to the W3C site it should not be possible. Here's a simple online example from me: https://www.w3schools.com/code/tryit.asp?filename=GSUO92QUUK60

[mkArtakMSFT]

Thanks for contacting us. This indeed seems to be the expected behavior: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/fieldset#attr-disabled.
We'll wait for more feedback from the community to get to this though.

[ghost]

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.

[campersau]

Looks like a browser bug to me. Enabling Experimental Web Platform features in about:flags makes it work correctly.

Blazor example: https://blazorfiddle.com/s/szj9ja01
JavaScript example: https://jsfiddle.net/3ojhcr2u/1/
HTML spec issue: whatwg/html#5886
Chromium issue: https://bugs.chromium.org/p/chromium/issues/detail?id=588760

The current attempt to disable events like click on buttons only works correctly if you explicitly set the disabled attribute on the button itself.

aspnetcore/src/Components/Web.JS/src/Rendering/Events/EventDelegator.ts

Lines 336 to 342 in dd476b1

	function eventIsDisabledOnElement(element: Element, rawBrowserEventName: string): boolean {
	// We want to replicate the normal DOM event behavior that, for 'interactive' elements
	// with a 'disabled' attribute, certain mouse events are suppressed
	return (element instanceof HTMLButtonElement || element instanceof HTMLInputElement || element instanceof HTMLTextAreaElement || element instanceof HTMLSelectElement)
	&& disableableEventNames.hasOwnProperty(rawBrowserEventName)
	&& element.disabled;
	}

Other frameworks like react have the same issue: facebook/react#7711