Bug report

Reproduction of the problem

(bug report only)
1. Run this example: https://blazorrepl.telerik.com/cUaBGOOZ34pkp6wB57
2. Inspect the MultiSelect’s input.
3. Click within the component’s input area, to open its popup.

The issue is also reproducible in the other dropdown components: https://blazorrepl.telerik.com/GUurGmvw32oPqGYu03

Current behavior

(optional)
When the dropdown opens, an aria-controls attribute is applied to the MultiSelect’s input. Its value does not match any existing DOM element.

Expected/desired behavior

The value of the aria-controls attribute should point at an existing element (e.g., the popup’s list element: https://www.telerik.com/blazor-ui/documentation/components/multiselect/accessibility/wai-aria-support#multiselect-wrapping-element ). But in this case the MultiSelect is not bound to data and a list element is not rendered in the popup.

Environment

• Kendo/Telerik version: 14.1.0
• jQuery version:
• Browser: [all ]

Bug report

Reproduction of the problem

Related to https://progresssoftware.atlassian.net/browse/BLZ-3112

(bug report only)

1. Run this example: https://blazorrepl.telerik.com/wqlEwZbI56m31kAM53
2. Inspect the MultiSelect’s input.
3. Click within the component’s input area to open its popup.

The issue is also reproducible in the other dropdown components.

Current behavior

(optional)
The aria-activedescendant attribute on the <input> element points to a non-existent element.

Expected/desired behavior

The aria-activedescendant attribute on the <input> element must point to the unique id string of the currently active (visually highlighted) <li role="option"> inside the popup listbox. When the popup opens but no item is highlighted (as in the case where the component is not bound to data) the attribute should omitted.

Environment

• Kendo/Telerik version: 15.1.0
• Browser: [all ]

I have been trying to improve my Lighthouse score with Google and one of the items it is tagging is the "telerik-blazor.js" file.  I have seen new practices where the JavaScript is imported as needed, see this article here from Microsoft.

Can you please consider this in the future?

===

Telerik edit: A possible workaround is to build the Telerik JavaScript file without some of the components that you don't need.

Title: WCAG 1.3.1: Ensures elements with an ARIA role that require child roles contain them (#\39 374a450-079d-4586-b823-d6bc7723505f)
Tags: Accessibility, WCAG 1.3.1, aria-required-children

Issue: Ensures elements with an ARIA role that require child roles contain them (aria-required-children - https://accessibilityinsights.io/info-examples/web/aria-required-children)

Target application: Hermes Home - https://localhost/TrafficLoss

Element path: #\39 374a450-079d-4586-b823-d6bc7723505f

Snippet: <div class="k-grid-aria-root" id="9374a450-079d-4586-b823-d6bc7723505f" role="grid" aria-label="Data table">

How to fix: 
Fix any of the following:
  Element has children which are not allowed (see related nodes)
  Element has no aria-busy="true" attribute

Environment: Microsoft Edge version 111.0.1661.41

====

This accessibility issue was found using Accessibility Insights for Web 2.37.3 (axe-core 4.6.3), a tool that helps find and fix accessibility issues. Get more information & download this tool at http://aka.ms/AccessibilityInsights.

============================  code =============================

                           <TelerikGrid Data="@ViewModel.RDLInformation" TItem="TLSummary"
                                                        Pageable="true" 
                                                        Sortable="true" 
                                                        Groupable="false"
                                                        FilterMode="Telerik.Blazor.GridFilterMode.FilterRow"
                                                        Resizable="true" 
                                                        Reorderable="true"
                                                        Height = "100%">

....

                            </TelerikGrid>

Bug report

Reproduction of the problem

Environment

• Version 15.1.0
• Blazor Server, .NET 10
• Chromium (Chrome and Playwright headless)

Grid ColumnDraggable is never destroyed
In Components/Common/Grid/Rows/TableHeaderRow.cs, Dispose() calls base.Dispose() first, which sets IsDisposed = true. It then calls DestroyColumnDraggable(), which uses InvokeAsync<object>. That method returns early when IsDisposed is true (BaseComponent.InvokeAsync<T>), so destroyColumnDraggable is never sent to the browser. DestroyColumnReorderable() and DestroyColumnResizable() work because they use InvokeVoidAsync, which has no such check.

As a result, every grid with Reorderable="true" or Groupable="true" leaves "<dataId>-telerik-ColumnDraggable" in window.TelerikBlazor._instances. Its draggable.element (the grid's .k-grid-header) keeps the whole disposed page reachable, so the page is never garbage collected.

1. Create two routable pages. Page A has a TelerikGrid with Reorderable="true" and a TelerikTabStrip with a few tabs. Page B is empty.
2. Open Page A, then navigate to Page B with the in-app router (no full reload).
3. Run this in the browser console:

Object.entries(TelerikBlazor._instances)
     .filter(([k, i]) => i && i.element && !i.element.isConnected)
     .map(([k, i]) => k + ' / ' + i.constructor.name)

Sample project attached.

TelerikBlazorApp1.zip

Current behavior

(optional)
one "...-telerik-ColumnDraggable" entry per reorderable or groupable grid, all pointing at detached elements. Each pageA -> pageB round trip adds more, and the detached DOM is never released.

Expected/desired behavior

An empty array is returned. Page A's components were disposed, so their JS instances should have been destroyed.

Workaround

After each navigation, we destroy and remove any registered instance whose element is no longer in the page:

   const instances = window.TelerikBlazor && window.TelerikBlazor._instances;
   for (const key of Object.keys(instances || {})) {
       const i = instances[key];
       if (i && i.element && !i.element.isConnected) {
           try { i.destroy && i.destroy(); } catch (e) { }
           delete instances[key];
       }
   }

Suggested Fix

1. In TableHeaderRow.DestroyColumnDraggable(), use InvokeVoidAsync, as DestroyColumnReorderable() does. Or call the destroy methods before base.Dispose().

Environment

• Kendo/Telerik version:
• Browser: [Chrome XX, Firefox]

In version 15.1.0, the Editor causes a browser freeze when it contains a custom tool and the Value is changed programmatically. It works as expected in version 15.0.1.

The issue occurs only in WebAssembly apps.

Test page:

@using Telerik.Blazor.Components.Editor

<TelerikButton OnClick="@(() => EditorValue = "<p>baz</p><p>baz</p>")" ButtonType="@ButtonType.Button">Change Editor Value</TelerikButton>

<TelerikEditor Tools="@EditorTools"
               @bind-Value="@EditorValue">
    <EditorCustomTools>
        <EditorCustomTool Name="CustomEditorTool">
            custom tool here
        </EditorCustomTool>
    </EditorCustomTools>
</TelerikEditor>

@code {
    private string EditorValue { get; set; } = @"<p>foo</p><p>bar</p>";
    private List<IEditorTool> EditorTools { get; set; } = new();

    protected override void OnInitialized()
    {
        EditorTools.Add(new CustomTool("CustomEditorTool"));

        base.OnInitialized();
    }
}

• I want to track when the popup element of the DropDownButton is opened and closed.
• I also want to have an Open method via the component reference

===

ADMIN EDIT

===

For the time being, a possible option is to use the DropDownList component that exposes such events. Customize it so it can look and behave similarly to the DropDownButton.

Example implementation: https://blazorrepl.telerik.com/mekbkTPE21kwyMBU05.

Entering dates in the Blazor spreadsheet act weird if you enter a 2 digit year. It seems to subtract a day when you remove focus from the cell.

Start by entering a date like 2/2/25:

Then hit enter or otherwise remove focus from the cell and this is what it changes it to. Notice it subtracts a day:

Then put focus back on the cell:

Now look at the editor at the top:

I note that when you enter a two digit year in Excel it defaults the century to 20 when you enter a year less than 30. It defaults a century of 19 when you enter a year >= 30. It appears that with the Telerik Blazor spreadsheet it always defaults the century to 19. You can make arguments on either side of that but the real issue here is that it subtracts a day when you enter a two digit year. It doesn't do that when you enter a 4 digit year.

The related thing that becomes an issue is when you export the spreadsheet to a byte array and evaluate the cell RawValue. When you enter a 4 digit year, you get a raw value that is a positive number and you can use FormatHelper.ConvertDoubleToDateTime to get the date value. When you enter a 2 digit year and get the raw value, it is a negative number, and when you call FormatHelper.ConvertDoubleToDateTime it returns null.

Can you please comment on the rhyme or reason the spreadsheet behaves this way? Or is this a bug(s)?

Thanks.

Bug report

Reproduction of the problem

(bug report only)
Regression introduced in 15.1.0.

1. Run this example on a mobile device: https://blazorrepl.telerik.com/wUlaGWlv26jsx5Mi00

1. Attempt pinch-to-zoom over the Map.

Current behavior

(optional)
A js exception is thrown (see details in the related ticket).

Expected/desired behavior

Zoom in/out works as expected.

Workaround:

https://blazorrepl.telerik.com/QKbkwiFl21IX6YvX13

Environment

• Kendo/Telerik version:
• Browser: [ Mobile Chrome XX ]

I my understanding, the simplest way to get a coding agent provide better assistance to a very specific product like telerik blazor, is by just providing the documentation. 

My first experiments with the telerik mcp server are not succesful. I would think that linking the full documentation directly to the coding agent can seriously lead to better results.

AI Coding agents are doing a great job with more standard frontend framework like react, they seem to be common knowledge. We know that Blazor and in particular Telerik blazor is a niche product (not only niche, but also NICE), so coding agents needs to have clear instructions on everything.

Of course, i don't know how your documentation system works, and how easy it would be to generate .md files from this?

Thanks for looking into this matter

Don't hesitate to contact me directly for further questions or whatsoever.

warm regards

paul

Bug report

Reproduction of the problem

(bug report only)
The clear button in the ComboBox (MultiColumnComboBox, etc.) currently renders as a span element and has the following attributes:

<span class="k-clear-value" role="button" tabindex="-1" title="Clear">
  ...
</span>

Excluding a button from the Tab key sequence does not hide it from a screen reader user. A screen reader user navigating by virtual cursor (using arrow keys or "next button" shortcuts) can and will still find this span element. When they arrive at it, they will hear "Clear, button." Naturally, they will press Enter or Space to activate it.

Current behavior

(optional)
Provide additional information if the steps for reproducing the faulty behavior are not sufficient to describe the issue.

Expected/desired behavior

Make the span WCAG 4.1.2 compliant: https://www.w3.org/WAI/standards-guidelines/act/rules/97a4e1/

<span 
  class="k-clear-value" 
  role="button" 
  tabindex="-1" 
  aria-label="Clear selection"
  title="Clear">
  ...
</span>

We can also consider completely hiding the span from screen readers, by rendering aria-hidden="true" on the span element, for example: 

<span 
  class="k-clear-value" 
  role="button" 
  tabindex="-1" 
  aria-hidden="true">
</span>

The Kendo Angular ComboBox implements a similar approach. This will be in accordance with WCAG 4.1.2, because aria-hidden="true" removes the element from the accessibility tree entirely, it is no longer parsed as an active UI component by screen readers.

TicketID:

(optional)
Provide the TicketID, where the bug report initiated.

Environment

• Kendo/Telerik version:
• Browser: [all ]

Please support ColumnVirtualization in a Grid that also has multi-column headers (column bands) and locked columns, all three at once.

Follows ticket 1720022, where Ivan Danchev confirmed two defects in this combination (Telerik UI for Blazor 15.1.0, Blazor Server, ScrollMode Virtual, 45 columns of fixed px width in bands, the first band locked, Grid Width in px):

1. A band's header colspan is computed from its visible leaf columns and ignores the columns hidden by virtualization, so the header row goes out of step with the data rows and a band partly in view shows no title.

2. With any locked column the virtualizer merges every hidden column into one spacer cell. The spacer is a whole number of columns wide, so it cannot match an arbitrary scroll offset and leaves an empty strip, narrower than one column, between the locked block and the first scrolled column, in the header and every row. The spacer also carries the first hidden column's band into the header row.

Why it matters: on Blazor Server every rendered cell is a component held on the circuit. For our 45-column logbook grid the cells and loading placeholders are most of each user's memory (about 50 MB of render tree), and column virtualization would cut that by about two thirds. Wide data grids are usually grouped into bands with an identifying block locked on the left, so the combination is the normal case for a grid wide enough to need column virtualization.

Related: feedback items 1546425 and 1538964.