More tests

examples/Demo/FluentUI.Demo.Client/Documentation/Components/DataGrid/Examples/DataGridVirtualization.razor

@@ -0,0 +1,29 @@
+
+<div style="height: 400px; max-width: 800px; overflow-y: scroll;">
+            <FluentDataGrid TGridItem="Customer" Items="items" ItemSize=32 Virtualize="true" DisplayMode="DataGridDisplayMode.Table" >
+                <PropertyColumn Property="@(x => x.Name)" />
+            </FluentDataGrid>
+            </div>
+
+@code {
+    private IQueryable<Customer>? items;
+
+    protected override void OnInitialized()
+    {
+        items = GetRandomCustomers(); // Added method call to assign items
+    }
+
+    private record Customer(int Id, string Name);
+
+    private IQueryable<Customer> GetRandomCustomers(int size = 500)
+    {
+        Customer[] data = new Customer[size];
+
+        for (int i = 0; i < size; i++)
+        {
+
+            data[i] = new Customer(i, $"Customer {i} - {Guid.NewGuid().ToString("N").Substring(0, 8)}");
+        }
+        return data.AsQueryable();
+    }
+}

examples/Demo/FluentUI.Demo.Client/Documentation/Components/DataGrid/FluentDataGrid.md

@@ -25,6 +25,8 @@ Pressing enter finishes the filter action by the current input to filter on and
 The resize options UI is using a customized string for the label ('Width (+/- 10px)' instead of the normal 'Column width'). This is done through
 the custom localizer which is registered in the Server project's `Program.cs` file.
 
+{{ DataGridVirtualization }}
+
 {{ DataGridTypical }}
 
 {{ DataGridMultiSelect }}

spelling.dic

@@ -95,3 +95,7 @@ rowcount
 displaymode
 Voituron
 inputfile
+eventargs
+Subscribable
+colspan
+Voituron

src/Core/Components/DataGrid/Columns/GridSort.cs

@@ -2,6 +2,7 @@
 // MIT License - Copyright (c) Microsoft Corporation. All rights reserved.
 // ------------------------------------------------------------------------
 
+using System.Diagnostics.CodeAnalysis;
 using System.Linq.Expressions;
 
 namespace Microsoft.FluentUI.AspNetCore.Components;
@@ -259,6 +260,8 @@ private List<SortedProperty> BuildPropertyList(bool ascending)
     }
 
     // Not sure we really want this level of complexity, but it converts expressions like @(c => c.Medals.Gold) to "Medals.Gold"
+    // Makes it too complex to test, so we exclude from coverage
+    [ExcludeFromCodeCoverage(Justification = "Too complex to write test for.")]
 #pragma warning disable MA0015 // Specify the parameter name in ArgumentException
     private static string ToPropertyName(LambdaExpression expression)
     {

src/Core/Components/DataGrid/FluentDataGrid.razor.cs

@@ -34,7 +34,7 @@ public partial class FluentDataGrid<TGridItem> : FluentComponentBase, IHandleEve
     private bool _collectingColumns;
     private ColumnBase<TGridItem>? _displayOptionsForColumn;
     internal ColumnBase<TGridItem>? _displayResizeForColumn;
-    private ColumnBase<TGridItem>? _sortByColumn;
+    internal ColumnBase<TGridItem>? _sortByColumn;
     private bool _sortByAscending;
     private bool _checkColumnOptionsPosition;
     private bool _checkColumnResizePosition;
@@ -780,7 +780,7 @@ private async Task RefreshDataCoreAsync()
         }
 
         _internalGridContext.ResetRowIndexes(startIndex);
-        StateHasChanged();
+        _ = InvokeAsync(StateHasChanged);
     }
 
     // Gets called both by RefreshDataCoreAsync and directly by the Virtualize child component during scrolling
@@ -791,8 +791,7 @@ private async Task RefreshDataCoreAsync()
         // Debounce the requests. This eliminates a lot of redundant queries at the cost of slight lag after interactions.
         // TODO: Consider making this configurable, or smarter (e.g., doesn't delay on first call in a batch, then the amount
         // of delay increases if you rapidly issue repeated requests, such as when scrolling a long way)
-        await Task.Delay(100);
-
+        await Task.Delay(20);
         if (request.CancellationToken.IsCancellationRequested)
         {
             return default;
@@ -829,7 +828,7 @@ private async Task RefreshDataCoreAsync()
             if (_internalGridContext.TotalItemCount > 0 && Loading is null)
             {
                 Loading = false;
-                StateHasChanged();
+                _ = InvokeAsync(StateHasChanged);
             }
 
             // We're supplying the row _index along with each row's data because we need it for aria-rowindex, and we have to account for

src/Core/Components/DataGrid/GridItemsProviderRequest.cs

@@ -2,6 +2,8 @@
 // MIT License - Copyright (c) Microsoft Corporation. All rights reserved.
 // ------------------------------------------------------------------------
 
+using System.Diagnostics.CodeAnalysis;
+
 namespace Microsoft.FluentUI.AspNetCore.Components;
 
 /// <summary>
@@ -64,6 +66,7 @@ public IQueryable<TGridItem> ApplySorting(IQueryable<TGridItem> source) =>
     /// Produces a collection of (property name, direction) pairs representing the sorting rules.
     /// </summary>
     /// <returns>A collection of (property name, direction) pairs representing the sorting rules</returns>
+    [ExcludeFromCodeCoverage(Justification = "This is a not reachable in a unit test scenario.")]
     public IReadOnlyCollection<SortedProperty> GetSortByProperties() =>
         SortByColumn?.SortBy?.ToPropertyList(SortByAscending) ?? [];
 
@@ -73,6 +76,7 @@ public IReadOnlyCollection<SortedProperty> GetSortByProperties() =>
     /// <param name="req">The <see cref="GridItemsProviderRequest{TGridItem}"/> to compare with the current request.</param>
     /// <returns><see langword="true"/> if the specified request has the same start index, count, sort column, and sort order as
     /// the current request; otherwise, <see langword="false"/>.</returns>
+    [ExcludeFromCodeCoverage(Justification = "This is a not reachable in a unit test scenario.")]
     public bool IsSameRequest(GridItemsProviderRequest<TGridItem> req)
     {
         if (StartIndex != req.StartIndex)

src/Core/Components/DataGrid/Infrastructure/AsyncQueryExecutorSupplier.cs

@@ -8,6 +8,7 @@
 
 namespace Microsoft.FluentUI.AspNetCore.Components.DataGrid.Infrastructure;
 
+[ExcludeFromCodeCoverage(Justification = "This is an *internal* utility class that is too complicated to test. It provides a way to get an async query executor for EF Core queries.")]
 internal static class AsyncQueryExecutorSupplier
 {
     // The primary goal with this is to ensure that:

src/Core/Components/DataGrid/Infrastructure/ColumnsCollectedNotifier.cs

@@ -3,6 +3,7 @@
 // ------------------------------------------------------------------------
 
 using System.ComponentModel;
+using System.Diagnostics.CodeAnalysis;
 using Microsoft.AspNetCore.Components;
 
 namespace Microsoft.FluentUI.AspNetCore.Components.DataGrid.Infrastructure;
@@ -34,6 +35,7 @@ namespace Microsoft.FluentUI.AspNetCore.Components.DataGrid.Infrastructure;
 /// For internal use only. Do not use.
 /// </summary>
 /// <typeparam name="TGridItem">For internal use only. Do not use.</typeparam>
+[ExcludeFromCodeCoverage(Justification = "The return in SetParametersAsync can't be invoked because of the way this component gets rendered by the DataGrid. ")]
 [EditorBrowsable(EditorBrowsableState.Never)]
 public sealed class ColumnsCollectedNotifier<TGridItem> : Microsoft.AspNetCore.Components.IComponent
 {

src/Core/Components/DataGrid/Infrastructure/InternalGridContext.cs

@@ -2,6 +2,7 @@
 // MIT License - Copyright (c) Microsoft Corporation. All rights reserved.
 // ------------------------------------------------------------------------
 
+using System.Diagnostics.CodeAnalysis;
 using Microsoft.FluentUI.AspNetCore.Components.Infrastructure;
 
 namespace Microsoft.FluentUI.AspNetCore.Components.DataGrid.Infrastructure;
@@ -21,6 +22,8 @@ internal sealed class InternalGridContext<TGridItem>
 
     public ICollection<TGridItem> Items { get; set; } = [];
     public int TotalItemCount { get; set; }
+
+    [ExcludeFromCodeCoverage(Justification = "This can only be set when a Virtualized grid is scrolled which can't be done by bUnit")]
     public int TotalViewItemCount { get; set; }
 
     public FluentDataGrid<TGridItem> Grid { get; }

src/Core/Components/Pagination/FluentPaginator.razor.cs

@@ -102,7 +102,7 @@ private async Task GoToPageAsync(int pageIndex)
         await State.SetCurrentPageIndexAsync(pageIndex);
         if (CurrentPageIndexChanged.HasDelegate)
         {
-            await CurrentPageIndexChanged.InvokeAsync(State.CurrentPageIndex);
+            await InvokeAsync(() => CurrentPageIndexChanged.InvokeAsync(State.CurrentPageIndex));
         }
     }
 }

src/Core/Infrastructure/EventCallbackSubscribable.cs

@@ -24,7 +24,14 @@ public async Task InvokeCallbacksAsync(T eventArg)
     {
         foreach (var callback in _callbacks.Values)
         {
-            await callback.InvokeAsync(eventArg);
+            try
+            {
+                await callback.InvokeAsync(eventArg);
+            }
+            catch (InvalidOperationException)
+            {
+                // Continue invoking the rest of the callbacks even if one fails.
+            }
         }
     }
 

tests/Core/Components/DataGrid/ColumnResizeOptionsTests.razor

@@ -0,0 +1,23 @@
+@using Bunit.TestDoubles
+@using Xunit
+@inherits Bunit.TestContext
+
+@code {
+    public ColumnResizeOptionsTests()
+    {
+        JSInterop.Mode = JSRuntimeMode.Loose;
+
+        // Register services
+        Services.AddFluentUIComponents();
+        Services.AddScoped<IKeyCodeService>(factory => new KeyCodeService());
+    }
+
+    [Fact]
+    public void ColumnResizeOptions_InvalidColumn()
+    {
+        // Arrange && Act && Assert
+        Assert.Throws<ArgumentException>(() => Render<ColumnResizeOptions<string>>(
+            @<ColumnResizeOptions TGridItem="string" Column="0" />
+        ));
+    }
+}

tests/Core/Components/DataGrid/FluentDataGridTests.FluentDataGrid_ColumnOptionsUISettings.verified.razor.html

@@ -0,0 +1,25 @@
+
+<table id="xxx" class="fluent-data-grid grid" style="grid-template-columns: 1fr;" aria-rowcount="4" blazor:onclosecolumnoptions="1" blazor:onclosecolumnresize="2" blazor:elementreference="xxx">
+  <thead>
+    <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" blazor:onkeydown="x" blazor:onclick="x" blazor:ondblclick="5" blazor:onfocus="6">
+      <th col-index="1" class="column-header col-sort-asc" style="grid-column: 1; height: 32px; min-height: 44px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="x" blazor:onclick="x" blazor:onfocus="25" scope="col" aria-sort="ascending">
+        <div style="display: flex; justify-content: flex-start;">
+          <div class="col-title" style="width: calc(100% - 10px);">
+            <div class="col-title-text">Name</div>
+          </div>
+        </div>
+      </th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr class="fluent-data-grid-row" data-row-index="2" role="row" blazor:onkeydown="x" blazor:onclick="x" blazor:ondblclick="13" blazor:onfocus="14" aria-rowindex="2">
+      <td col-index="1" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" blazor:onkeydown="x" blazor:onclick="x" blazor:onfocus="28">Denis Voituron</td>
+    </tr>
+    <tr class="fluent-data-grid-row" data-row-index="3" role="row" blazor:onkeydown="x" blazor:onclick="x" blazor:ondblclick="17" blazor:onfocus="18" aria-rowindex="3">
+      <td col-index="1" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" blazor:onkeydown="x" blazor:onclick="x" blazor:onfocus="31">Vincent Baaij</td>
+    </tr>
+    <tr class="fluent-data-grid-row" data-row-index="4" role="row" blazor:onkeydown="x" blazor:onclick="x" blazor:ondblclick="21" blazor:onfocus="22" aria-rowindex="4">
+      <td col-index="1" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" blazor:onkeydown="x" blazor:onclick="x" blazor:onfocus="34">Bill Gates</td>
+    </tr>
+  </tbody>
+</table>

tests/Core/Components/DataGrid/FluentDataGridTests.FluentDataGrid_ColumnResizeUISettings.verified.razor.html

@@ -0,0 +1,25 @@
+
+<table id="xxx" class="fluent-data-grid grid" style="grid-template-columns: 1fr;" aria-rowcount="4" blazor:onclosecolumnoptions="1" blazor:onclosecolumnresize="2" blazor:elementreference="xxx">
+  <thead>
+    <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" blazor:onkeydown="x" blazor:onclick="x" blazor:ondblclick="5" blazor:onfocus="6">
+      <th col-index="1" class="column-header col-sort-asc" style="grid-column: 1; height: 32px; min-height: 44px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="x" blazor:onclick="x" blazor:onfocus="25" scope="col" aria-sort="ascending">
+        <div style="display: flex; justify-content: flex-start;">
+          <div class="col-title" style="width: calc(100% - 10px);">
+            <div class="col-title-text">Name</div>
+          </div>
+        </div>
+      </th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr class="fluent-data-grid-row" data-row-index="2" role="row" blazor:onkeydown="x" blazor:onclick="x" blazor:ondblclick="13" blazor:onfocus="14" aria-rowindex="2">
+      <td col-index="1" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" blazor:onkeydown="x" blazor:onclick="x" blazor:onfocus="28">Denis Voituron</td>
+    </tr>
+    <tr class="fluent-data-grid-row" data-row-index="3" role="row" blazor:onkeydown="x" blazor:onclick="x" blazor:ondblclick="17" blazor:onfocus="18" aria-rowindex="3">
+      <td col-index="1" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" blazor:onkeydown="x" blazor:onclick="x" blazor:onfocus="31">Vincent Baaij</td>
+    </tr>
+    <tr class="fluent-data-grid-row" data-row-index="4" role="row" blazor:onkeydown="x" blazor:onclick="x" blazor:ondblclick="21" blazor:onfocus="22" aria-rowindex="4">
+      <td col-index="1" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" blazor:onkeydown="x" blazor:onclick="x" blazor:onfocus="34">Bill Gates</td>
+    </tr>
+  </tbody>
+</table>

tests/Core/Components/DataGrid/FluentDataGridTests.FluentDataGrid_ColumnSortUISettings.verified.razor.html

@@ -0,0 +1,25 @@
+
+<table id="xxx" class="fluent-data-grid grid" style="grid-template-columns: 1fr;" aria-rowcount="4" blazor:onclosecolumnoptions="1" blazor:onclosecolumnresize="2" blazor:elementreference="xxx">
+  <thead>
+    <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" blazor:onkeydown="x" blazor:onclick="x" blazor:ondblclick="5" blazor:onfocus="6">
+      <th col-index="1" class="column-header col-sort-asc" style="grid-column: 1; height: 32px; min-height: 44px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="x" blazor:onclick="x" blazor:onfocus="25" scope="col" aria-sort="ascending">
+        <div style="display: flex; justify-content: flex-start;">
+          <div class="col-title" style="width: calc(100% - 10px);">
+            <div class="col-title-text">Name</div>
+          </div>
+        </div>
+      </th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr class="fluent-data-grid-row" data-row-index="2" role="row" blazor:onkeydown="x" blazor:onclick="x" blazor:ondblclick="13" blazor:onfocus="14" aria-rowindex="2">
+      <td col-index="1" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" blazor:onkeydown="x" blazor:onclick="x" blazor:onfocus="28">Denis Voituron</td>
+    </tr>
+    <tr class="fluent-data-grid-row" data-row-index="3" role="row" blazor:onkeydown="x" blazor:onclick="x" blazor:ondblclick="17" blazor:onfocus="18" aria-rowindex="3">
+      <td col-index="1" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" blazor:onkeydown="x" blazor:onclick="x" blazor:onfocus="31">Vincent Baaij</td>
+    </tr>
+    <tr class="fluent-data-grid-row" data-row-index="4" role="row" blazor:onkeydown="x" blazor:onclick="x" blazor:ondblclick="21" blazor:onfocus="22" aria-rowindex="4">
+      <td col-index="1" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" blazor:onkeydown="x" blazor:onclick="x" blazor:onfocus="34">Bill Gates</td>
+    </tr>
+  </tbody>
+</table>