Progress® Telerik® UI for Blazor Feedback Portal

Recently Updated

Unplanned

Last Updated: 16 Oct 2023 13:52 by Jayden

[Accessibility] Revise the need to render at the same time both "aria-disabled" and "disabled" HTML attributes in a disabled state

Created by: Jayden

Comments: 0

Category: Button

Type: Bug Report

[Accessibility] Revise the need to render at the same time both "aria-disabled" and "disabled" HTML attributes in a disabled state

WCAG 4.1.2 was flagged by our accessibility checker due to the above redundancy. Disabled buttons have both "disabled" and aria-disabled="true" attributes.

Declined

Last Updated: 09 Mar 2022 17:05 by ADMIN

TelerikButton: disabled state can be circumvented to trigger OnClick

Created by: Alexander

Comments: 4

Category: Button

Type: Bug Report

TelerikButton: disabled state can be circumvented to trigger OnClick

Consider the following Blazor markup:

<TelerikButton OnClick="@MyClickHandler" Enabled="false">Click me!</TelerikButton>

This will be rendered as a disabled HTML button with the class k-disabled. If a malicious user edits the DOM to remove the disabled attribute and said class, the button will become enabled. If the user then clicks the button, the registered OnClick EventCallback gets executed, even though Enabled is set to false.

Telerik-REPL link https://blazorrepl.telerik.com/QcumwJPA47xzAake54

Here is a JavaScript function that can be used to enable the disabled button (please make sure to use the correct JavaScript context when using it inside the Browsers DevTools):

function enableButton() {
    const element = document.getElementById("button_2");
    element.disabled = false;
    element.classList.remove("k-disabled");
}

We are not sure if this can be considered a bug or if the registered OnClick EventCallback is supposed to make sure the button is enabled. It would, however, make sense for a Blazor Server environment if the TelerikButton component would check its Enabled state before triggering the EventCallback.