Button Selectors Are Deprecated

Environment

Product

Progress® Kendo UI® for Angular Button

Description

A warning message appears in the console after updating the progress/kendo-angular-buttons package.

bash

As of package v16, the "span[kendoButton]" and "kendo-button" selectors
are deprecated and can be removed in a future major version.
We recommend using the "button[kendoButton]" selector to avoid discrepancies
between the behavior of the "ButtonComponent" and the native HTML Button element.

Cause

The kendoButton attribute applied on span HTML elements and using the <kendo-button> component have been deprecated since v16 of the Buttons package. These selectors are subject to removal in future major releases of the Buttons package.

html

<span kendoButton> Span Button </span>
<kendo-button> Button </kendo-buton>

The reason for the deprecation is that they are not native HTML button elements and cannot support button-like behavior in various scenarios. For example, using <span kendoButton> or <kendo-button> causes discrepancies in the following scenarios (the list is not exhaustive):

• Do not submit a form, when used inside the form.
• Cannot use the type attribute to determine the button behavior (submit, reset, etc.).
• Pressing Space/Enter does not propagate a native click event up the DOM tree.

Solution

Replace either the <span kendoButton> element or the <kendo-button> component with a native HTML Button element that has the kendoButton attribute applied.

html

<button kendoButton> My Button </button>

Suggested Links

• Button Overview
• Forms Overview