Skip to content

[DataGrid Fix issue when scrolling horizontally and Virtualize="true" #2264

[DataGrid Fix issue when scrolling horizontally and Virtualize="true"

[DataGrid Fix issue when scrolling horizontally and Virtualize="true" #2264

Triggered via pull request December 27, 2024 15:16
Status Failure
Total duration 4m 31s
Artifacts

build-core-lib.yml

on: pull_request
Build and Test Core Lib
4m 17s
Build and Test Core Lib
Build and Deploy Demo site
3m 17s
Build and Deploy Demo site
Close Pull Request Job
0s
Close Pull Request Job
Fit to window
Zoom out
Zoom in

Annotations

9 errors and 4 warnings
Microsoft.FluentUI.AspNetCore.Components.Tests.DataGrid.DataGridSortByTests ► DataGridSortByTests_SortByColumnIndex_Ascending: tests/Core/FluentAssert.cs#L113
Failed test found in: TestResults/runneradmin_fv-az844-145_2024-12-27_15_20_53.trx Error: Bunit.HtmlEqualException : HTML comparison failed. The following errors were found: 1: The attribute at table(1) > tbody(3) > tr(1)[row-type] is missing. 2: The attribute at table(1) > tbody(3) > tr(3)[row-type] is missing. 3: The attribute at table(1) > tbody(3) > tr(5)[row-type] is missing. 4: The attribute at table(1) > tbody(3) > tr(7)[row-type] is missing. Actual HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 1fr 1fr;" aria-rowcount="5" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header col-justify-start col-sort-asc" style="grid-column: 1; height: 32px; min-height: 44px;" scope="col" aria-sort="ascending" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item1</div> </div> </th> <th col-index="2" class="column-header col-justify-start col-sort-asc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item2</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="3" role="row" aria-rowindex="2" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >A</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >D</td> </tr> <tr class="fluent-data-grid-row" data-row-index="2" role="row" aria-rowindex="3" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >B</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >C</td> </tr> <tr class="fluent-data-grid-row" data-row-index="5" role="row" aria-rowindex="4" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >C</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >B</td> </tr> <tr class="fluent-data-grid-row" data-row-index="4" role="row" aria-rowindex="5" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >D</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >A</td> </tr> </tbody> </table> Expected HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 1fr 1fr;" aria-rowcount="5" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header col-justify-start col-sort-asc" style="grid-column: 1; height: 32px; min-height: 44px;" scope="col" aria-sort="ascending" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item1</div> </div> </th> <th col-index="2" class="column-header col-justify-start col-sort-asc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item2</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="3" role="row" row-type="default" aria-rowindex="2" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >A</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >D</td> </tr> <tr class="fluent-data-grid-row" data-row-index="2" role="row" row-type="default" aria-rowindex="3" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >B</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >C</td> </tr> <tr class="fluent-data-grid-row" data-row-index="5" role="row" row-type="default" aria-rowindex="4" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >C</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >B</td> </tr> <tr class="fluent-data-grid-row" data-row-index="4" role="row" row-type="default" aria-rowindex="5" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >D</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >A</td> </tr> </tbody> </table>
Microsoft.FluentUI.AspNetCore.Components.Tests.DataGrid.DataGridSortByTests ► DataGridSortByTests_SortByColumnIndex_Descending: tests/Core/FluentAssert.cs#L113
Failed test found in: TestResults/runneradmin_fv-az844-145_2024-12-27_15_20_53.trx Error: Bunit.HtmlEqualException : HTML comparison failed. The following errors were found: 1: The attribute at table(1) > tbody(3) > tr(1)[row-type] is missing. 2: The attribute at table(1) > tbody(3) > tr(3)[row-type] is missing. 3: The attribute at table(1) > tbody(3) > tr(5)[row-type] is missing. 4: The attribute at table(1) > tbody(3) > tr(7)[row-type] is missing. Actual HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 1fr 1fr;" aria-rowcount="5" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header col-justify-start col-sort-desc" style="grid-column: 1; height: 32px; min-height: 44px;" scope="col" aria-sort="descending" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item1</div> </div> </th> <th col-index="2" class="column-header col-justify-start col-sort-desc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item2</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="4" role="row" aria-rowindex="2" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >D</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >A</td> </tr> <tr class="fluent-data-grid-row" data-row-index="5" role="row" aria-rowindex="3" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >C</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >B</td> </tr> <tr class="fluent-data-grid-row" data-row-index="2" role="row" aria-rowindex="4" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >B</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >C</td> </tr> <tr class="fluent-data-grid-row" data-row-index="3" role="row" aria-rowindex="5" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >A</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >D</td> </tr> </tbody> </table> Expected HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 1fr 1fr;" aria-rowcount="5" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header col-justify-start col-sort-desc" style="grid-column: 1; height: 32px; min-height: 44px;" scope="col" aria-sort="descending" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item1</div> </div> </th> <th col-index="2" class="column-header col-justify-start col-sort-desc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item2</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="4" role="row" row-type="default" aria-rowindex="2" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >D</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >A</td> </tr> <tr class="fluent-data-grid-row" data-row-index="5" role="row" row-type="default" aria-rowindex="3" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >C</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >B</td> </tr> <tr class="fluent-data-grid-row" data-row-index="2" role="row" row-type="default" aria-rowindex="4" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >B</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >C</td> </tr> <tr class="fluent-data-grid-row" data-row-index="3" role="row" row-type="default" aria-rowindex="5" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >A</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >D</td> </tr> </tbody> </table>
Microsoft.FluentUI.AspNetCore.Components.Tests.DataGrid.DataGridSortByTests ► DataGridSortByTests_SortByColumnTitle_Ascending: tests/Core/FluentAssert.cs#L113
Failed test found in: TestResults/runneradmin_fv-az844-145_2024-12-27_15_20_53.trx Error: Bunit.HtmlEqualException : HTML comparison failed. The following errors were found: 1: The attribute at table(1) > tbody(3) > tr(1)[row-type] is missing. 2: The attribute at table(1) > tbody(3) > tr(3)[row-type] is missing. 3: The attribute at table(1) > tbody(3) > tr(5)[row-type] is missing. 4: The attribute at table(1) > tbody(3) > tr(7)[row-type] is missing. Actual HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 1fr 1fr;" aria-rowcount="5" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header col-justify-start col-sort-asc" style="grid-column: 1; height: 32px; min-height: 44px;" scope="col" aria-sort="ascending" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item1</div> </div> </th> <th col-index="2" class="column-header col-justify-start col-sort-asc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item2</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="3" role="row" aria-rowindex="2" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >A</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >D</td> </tr> <tr class="fluent-data-grid-row" data-row-index="2" role="row" aria-rowindex="3" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >B</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >C</td> </tr> <tr class="fluent-data-grid-row" data-row-index="5" role="row" aria-rowindex="4" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >C</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >B</td> </tr> <tr class="fluent-data-grid-row" data-row-index="4" role="row" aria-rowindex="5" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >D</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >A</td> </tr> </tbody> </table> Expected HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 1fr 1fr;" aria-rowcount="5" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header col-justify-start col-sort-asc" style="grid-column: 1; height: 32px; min-height: 44px;" scope="col" aria-sort="ascending" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item1</div> </div> </th> <th col-index="2" class="column-header col-justify-start col-sort-asc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item2</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="3" role="row" row-type="default" aria-rowindex="2" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >A</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >D</td> </tr> <tr class="fluent-data-grid-row" data-row-index="2" role="row" row-type="default" aria-rowindex="3" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >B</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >C</td> </tr> <tr class="fluent-data-grid-row" data-row-index="5" role="row" row-type="default" aria-rowindex="4" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >C</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >B</td> </tr> <tr class="fluent-data-grid-row" data-row-index="4" role="row" row-type="default" aria-rowindex="5" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >D</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >A</td> </tr> </tbody> </table>
Microsoft.FluentUI.AspNetCore.Components.Tests.DataGrid.DataGridSortByTests ► DataGridSortByTests_SortByColumnTitle_Descending: tests/Core/FluentAssert.cs#L113
Failed test found in: TestResults/runneradmin_fv-az844-145_2024-12-27_15_20_53.trx Error: Bunit.HtmlEqualException : HTML comparison failed. The following errors were found: 1: The attribute at table(1) > tbody(3) > tr(1)[row-type] is missing. 2: The attribute at table(1) > tbody(3) > tr(3)[row-type] is missing. 3: The attribute at table(1) > tbody(3) > tr(5)[row-type] is missing. 4: The attribute at table(1) > tbody(3) > tr(7)[row-type] is missing. Actual HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 1fr 1fr;" aria-rowcount="5" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header col-justify-start col-sort-desc" style="grid-column: 1; height: 32px; min-height: 44px;" scope="col" aria-sort="descending" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item1</div> </div> </th> <th col-index="2" class="column-header col-justify-start col-sort-desc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item2</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="4" role="row" aria-rowindex="2" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >D</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >A</td> </tr> <tr class="fluent-data-grid-row" data-row-index="5" role="row" aria-rowindex="3" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >C</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >B</td> </tr> <tr class="fluent-data-grid-row" data-row-index="2" role="row" aria-rowindex="4" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >B</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >C</td> </tr> <tr class="fluent-data-grid-row" data-row-index="3" role="row" aria-rowindex="5" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >A</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >D</td> </tr> </tbody> </table> Expected HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 1fr 1fr;" aria-rowcount="5" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header col-justify-start col-sort-desc" style="grid-column: 1; height: 32px; min-height: 44px;" scope="col" aria-sort="descending" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item1</div> </div> </th> <th col-index="2" class="column-header col-justify-start col-sort-desc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Item2</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="4" role="row" row-type="default" aria-rowindex="2" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >D</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >A</td> </tr> <tr class="fluent-data-grid-row" data-row-index="5" role="row" row-type="default" aria-rowindex="3" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >C</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >B</td> </tr> <tr class="fluent-data-grid-row" data-row-index="2" role="row" row-type="default" aria-rowindex="4" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >B</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >C</td> </tr> <tr class="fluent-data-grid-row" data-row-index="3" role="row" row-type="default" aria-rowindex="5" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >A</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >D</td> </tr> </tbody> </table>
Microsoft.FluentUI.AspNetCore.Components.Tests.DataGrid.FluentDataGridColumSelectTests ► FluentDataGrid_ColumSelect_MultiSelect_Customized_Rendering: tests/Core/FluentAssert.cs#L113
Failed test found in: TestResults/runneradmin_fv-az844-145_2024-12-27_15_20_53.trx Error: Bunit.HtmlEqualException : HTML comparison failed. The following errors were found: 1: The attribute at table(1) > tbody(3) > tr(1)[row-type] is missing. 2: The attribute at table(1) > tbody(3) > tr(3)[row-type] is missing. 3: The attribute at table(1) > tbody(3) > tr(5)[row-type] is missing. Actual HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 50px auto;" aria-rowcount="4" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header select-all col-justify-center col-sort-desc" style="grid-column: 1; text-align: center; align-content: center; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div style="cursor: pointer; margin-left: 12px;" >➖</div> </th> <th col-index="2" class="column-header col-justify-start col-sort-desc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Name</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="2" role="row" aria-rowindex="2" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Jean Martin</td> </tr> <tr class="fluent-data-grid-row" data-row-index="3" role="row" aria-rowindex="3" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" >✅</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Kenji Sato</td> </tr> <tr class="fluent-data-grid-row" data-row-index="4" role="row" aria-rowindex="4" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" >✅</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Julie Smith</td> </tr> </tbody> </table> Expected HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 50px auto;" aria-rowcount="4" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header select-all col-justify-center col-sort-desc" style="grid-column: 1; text-align: center; align-content: center; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div style="cursor: pointer; margin-left: 12px;" >➖</div> </th> <th col-index="2" class="column-header col-justify-start col-sort-desc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Name</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="2" role="row" row-type="default" aria-rowindex="2" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Jean Martin</td> </tr> <tr class="fluent-data-grid-row" data-row-index="3" role="row" row-type="default" aria-rowindex="3" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" >✅</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Kenji Sato</td> </tr> <tr class="fluent-data-grid-row" data-row-index="4" role="row" row-type="default" aria-rowindex="4" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" >✅</td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Julie Smith</td> </tr> </tbody> </table>
Microsoft.FluentUI.AspNetCore.Components.Tests.DataGrid.FluentDataGridColumSelectTests ► FluentDataGrid_ColumSelect_MultiSelect_Rendering: tests/Core/FluentAssert.cs#L113
Failed test found in: TestResults/runneradmin_fv-az844-145_2024-12-27_15_20_53.trx Error: Bunit.HtmlEqualException : HTML comparison failed. The following errors were found: 1: The attribute at table(1) > tbody(3) > tr(1)[row-type] is missing. 2: The attribute at table(1) > tbody(3) > tr(3)[row-type] is missing. 3: The attribute at table(1) > tbody(3) > tr(5)[row-type] is missing. Actual HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 50px auto;" aria-rowcount="4" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header select-all col-justify-center col-sort-desc" style="grid-column: 1; text-align: center; align-content: center; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <svg style="width: 20px; fill: var(--accent-fill-rest); cursor: pointer;" focusable="false" viewBox="0 0 20 20" aria-hidden="true" > <title>Some rows are selected.</title> <path d="M6 3a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h8a3 3 0 0 0 3-3V6a3 3 0 0 0-3-3H6ZM4.5 6c0-.83.67-1.5 1.5-1.5h8c.83 0 1.5.67 1.5 1.5v8c0 .83-.67 1.5-1.5 1.5H6A1.5 1.5 0 0 1 4.5 14V6ZM7 6a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H7Z"></path> <path d="M6 3a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h8a3 3 0 0 0 3-3V6a3 3 0 0 0-3-3H6ZM4.5 6c0-.83.67-1.5 1.5-1.5h8c.83 0 1.5.67 1.5 1.5v8c0 .83-.67 1.5-1.5 1.5H6A1.5 1.5 0 0 1 4.5 14V6ZM7 6a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H7Z"></path> </svg> </th> <th col-index="2" class="column-header col-justify-start col-sort-desc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Name</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="2" role="row" aria-rowindex="2" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > <svg style="width: 20px; fill: var(--neutral-fill-inverse-rest);" focusable="false" viewBox="0 0 20 20" aria-hidden="true" > <title>Row unselected</title> <path d="M3 6a3 3 0 0 1 3-3h8a3 3 0 0 1 3 3v8a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V6Zm3-2a2 2 0 0 0-2 2v8c0 1.1.9 2 2 2h8a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2H6Z"></path> </svg> </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Jean Martin</td> </tr> <tr class="fluent-data-grid-row" data-row-index="3" role="row" aria-rowindex="3" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > <svg style="width: 20px; fill: var(--accent-fill-rest);" focusable="false" viewBox="0 0 20 20" aria-hidden="true" row-selected=""> <title>Row selected.</title> <path d="M6 3a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h8a3 3 0 0 0 3-3V6a3 3 0 0 0-3-3H6Zm7.85 4.85-5 5a.5.5 0 0 1-.7 0l-2-2a.5.5 0 0 1 .7-.7l1.65 1.64 4.65-4.64a.5.5 0 0 1 .7.7Z"></path> </svg> </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Kenji Sato</td> </tr> <tr class="fluent-data-grid-row" data-row-index="4" role="row" aria-rowindex="4" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > <svg style="width: 20px; fill: var(--accent-fill-rest);" focusable="false" viewBox="0 0 20 20" aria-hidden="true" row-selected=""> <title>Row selected.</title> <path d="M6 3a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h8a3 3 0 0 0 3-3V6a3 3 0 0 0-3-3H6Zm7.85 4.85-5 5a.5.5 0 0 1-.7 0l-2-2a.5.5 0 0 1 .7-.7l1.65 1.64 4.65-4.64a.5.5 0 0 1 .7.7Z"></path> </svg> </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Julie Smith</td> </tr> </tbody> </table> Expected HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 50px auto;" aria-rowcount="4" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header select-all col-justify-center col-sort-desc" style="grid-column: 1; text-align: center; align-content: center; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <svg style="width: 20px; fill: var(--accent-fill-rest); cursor: pointer;" focusable="false" viewBox="0 0 20 20" aria-hidden="true" > <title>Some rows are selected.</title> <path d="M6 3a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h8a3 3 0 0 0 3-3V6a3 3 0 0 0-3-3H6ZM4.5 6c0-.83.67-1.5 1.5-1.5h8c.83 0 1.5.67 1.5 1.5v8c0 .83-.67 1.5-1.5 1.5H6A1.5 1.5 0 0 1 4.5 14V6ZM7 6a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H7Z"></path> <path d="M6 3a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h8a3 3 0 0 0 3-3V6a3 3 0 0 0-3-3H6ZM4.5 6c0-.83.67-1.5 1.5-1.5h8c.83 0 1.5.67 1.5 1.5v8c0 .83-.67 1.5-1.5 1.5H6A1.5 1.5 0 0 1 4.5 14V6ZM7 6a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H7Z"></path> </svg> </th> <th col-index="2" class="column-header col-justify-start col-sort-desc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Name</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="2" role="row" row-type="default" aria-rowindex="2" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > <svg style="width: 20px; fill: var(--neutral-fill-inverse-rest);" focusable="false" viewBox="0 0 20 20" aria-hidden="true" > <title>Row unselected</title> <path d="M3 6a3 3 0 0 1 3-3h8a3 3 0 0 1 3 3v8a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V6Zm3-2a2 2 0 0 0-2 2v8c0 1.1.9 2 2 2h8a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2H6Z"></path> </svg> </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Jean Martin</td> </tr> <tr class="fluent-data-grid-row" data-row-index="3" role="row" row-type="default" aria-rowindex="3" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > <svg style="width: 20px; fill: var(--accent-fill-rest);" focusable="false" viewBox="0 0 20 20" aria-hidden="true" row-selected=""> <title>Row selected.</title> <path d="M6 3a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h8a3 3 0 0 0 3-3V6a3 3 0 0 0-3-3H6Zm7.85 4.85-5 5a.5.5 0 0 1-.7 0l-2-2a.5.5 0 0 1 .7-.7l1.65 1.64 4.65-4.64a.5.5 0 0 1 .7.7Z"></path> </svg> </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Kenji Sato</td> </tr> <tr class="fluent-data-grid-row" data-row-index="4" role="row" row-type="default" aria-rowindex="4" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > <svg style="width: 20px; fill: var(--accent-fill-rest);" focusable="false" viewBox="0 0 20 20" aria-hidden="true" row-selected=""> <title>Row selected.</title> <path d="M6 3a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h8a3 3 0 0 0 3-3V6a3 3 0 0 0-3-3H6Zm7.85 4.85-5 5a.5.5 0 0 1-.7 0l-2-2a.5.5 0 0 1 .7-.7l1.65 1.64 4.65-4.64a.5.5 0 0 1 .7.7Z"></path> </svg> </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Julie Smith</td> </tr> </tbody> </table>
Microsoft.FluentUI.AspNetCore.Components.Tests.DataGrid.FluentDataGridColumSelectTests ► FluentDataGrid_ColumSelect_SingleSelect_Rendering: tests/Core/FluentAssert.cs#L113
Failed test found in: TestResults/runneradmin_fv-az844-145_2024-12-27_15_20_53.trx Error: Bunit.HtmlEqualException : HTML comparison failed. The following errors were found: 1: The attribute at table(1) > tbody(3) > tr(1)[row-type] is missing. 2: The attribute at table(1) > tbody(3) > tr(3)[row-type] is missing. 3: The attribute at table(1) > tbody(3) > tr(5)[row-type] is missing. Actual HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 50px auto;" aria-rowcount="4" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header select-all col-justify-center col-sort-desc" style="grid-column: 1; text-align: center; align-content: center; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 44px;" scope="col" aria-sort="none" ></th> <th col-index="2" class="column-header col-justify-start col-sort-desc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Name</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="2" role="row" aria-rowindex="2" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > <svg style="width: 20px; fill: var(--neutral-fill-inverse-rest);" focusable="false" viewBox="0 0 20 20" aria-hidden="true" > <title>Row unselected</title> <path d="M10 3a7 7 0 1 0 0 14 7 7 0 0 0 0-14Zm-8 7a8 8 0 1 1 16 0 8 8 0 0 1-16 0Z"></path> </svg> </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Jean Martin</td> </tr> <tr class="fluent-data-grid-row" data-row-index="3" role="row" aria-rowindex="3" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > <svg style="width: 20px; fill: var(--accent-fill-rest);" focusable="false" viewBox="0 0 20 20" aria-hidden="true" row-selected=""> <title>Row selected.</title> <path d="M10 15a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm0-13a8 8 0 1 0 0 16 8 8 0 0 0 0-16Zm-7 8a7 7 0 1 1 14 0 7 7 0 0 1-14 0Z"></path> </svg> </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Kenji Sato</td> </tr> <tr class="fluent-data-grid-row" data-row-index="4" role="row" aria-rowindex="4" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > <svg style="width: 20px; fill: var(--neutral-fill-inverse-rest);" focusable="false" viewBox="0 0 20 20" aria-hidden="true" > <title>Row unselected</title> <path d="M10 3a7 7 0 1 0 0 14 7 7 0 0 0 0-14Zm-8 7a8 8 0 1 1 16 0 8 8 0 0 1-16 0Z"></path> </svg> </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Julie Smith</td> </tr> </tbody> </table> Expected HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 50px auto;" aria-rowcount="4" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header select-all col-justify-center col-sort-desc" style="grid-column: 1; text-align: center; align-content: center; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 44px;" scope="col" aria-sort="none" ></th> <th col-index="2" class="column-header col-justify-start col-sort-desc" style="grid-column: 2; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Name</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="2" role="row" row-type="default" aria-rowindex="2" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > <svg style="width: 20px; fill: var(--neutral-fill-inverse-rest);" focusable="false" viewBox="0 0 20 20" aria-hidden="true" > <title>Row unselected</title> <path d="M10 3a7 7 0 1 0 0 14 7 7 0 0 0 0-14Zm-8 7a8 8 0 1 1 16 0 8 8 0 0 1-16 0Z"></path> </svg> </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Jean Martin</td> </tr> <tr class="fluent-data-grid-row" data-row-index="3" role="row" row-type="default" aria-rowindex="3" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > <svg style="width: 20px; fill: var(--accent-fill-rest);" focusable="false" viewBox="0 0 20 20" aria-hidden="true" row-selected=""> <title>Row selected.</title> <path d="M10 15a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm0-13a8 8 0 1 0 0 16 8 8 0 0 0 0-16Zm-7 8a7 7 0 1 1 14 0 7 7 0 0 1-14 0Z"></path> </svg> </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Kenji Sato</td> </tr> <tr class="fluent-data-grid-row" data-row-index="4" role="row" row-type="default" aria-rowindex="4" > <td col-index="1" class="col-justify-center" style="grid-column: 1; text-align: center; align-content: center; padding-inline-start: calc(((var(--design-unit)* 3) + var(--focus-stroke-width) - var(--stroke-width))* 1px); padding-top: calc(var(--design-unit) * 1.5px); height: 32px;" role="gridcell" tabindex="0" > <svg style="width: 20px; fill: var(--neutral-fill-inverse-rest);" focusable="false" viewBox="0 0 20 20" aria-hidden="true" > <title>Row unselected</title> <path d="M10 3a7 7 0 1 0 0 14 7 7 0 0 0 0-14Zm-8 7a8 8 0 1 1 16 0 8 8 0 0 1-16 0Z"></path> </svg> </td> <td col-index="2" class="col-justify-start" style="grid-column: 2; height: 32px;" role="gridcell" tabindex="0" >Julie Smith</td> </tr> </tbody> </table>
Microsoft.FluentUI.AspNetCore.Components.Tests.DataGrid.FluentDataGridTests ► FluentDataGrid_Default: tests/Core/FluentAssert.cs#L113
Failed test found in: TestResults/runneradmin_fv-az844-145_2024-12-27_15_20_53.trx Error: Bunit.HtmlEqualException : HTML comparison failed. The following errors were found: 1: The attribute at table(1) > tbody(3) > tr(1)[row-type] is missing. 2: The attribute at table(1) > tbody(3) > tr(3)[row-type] is missing. 3: The attribute at table(1) > tbody(3) > tr(5)[row-type] is missing. Actual HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 1fr;" aria-rowcount="4" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header col-justify-start col-sort-desc" style="grid-column: 1; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Name</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="2" role="row" aria-rowindex="2" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >Denis Voituron</td> </tr> <tr class="fluent-data-grid-row" data-row-index="3" role="row" aria-rowindex="3" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >Vincent Baaij</td> </tr> <tr class="fluent-data-grid-row" data-row-index="4" role="row" aria-rowindex="4" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >Bill Gates</td> </tr> </tbody> </table> Expected HTML: <table id="xxx" class="fluent-data-grid" style="grid-template-columns: 1fr;" aria-rowcount="4" > <thead > <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" > <th col-index="1" class="column-header col-justify-start col-sort-desc" style="grid-column: 1; height: 32px; min-height: 44px;" scope="col" aria-sort="none" > <div class="col-title" style="width: calc(100% - 20px);" > <div class="col-title-text" >Name</div> </div> </th> </tr> </thead> <tbody > <tr class="fluent-data-grid-row" data-row-index="2" role="row" row-type="default" aria-rowindex="2" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >Denis Voituron</td> </tr> <tr class="fluent-data-grid-row" data-row-index="3" role="row" row-type="default" aria-rowindex="3" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >Vincent Baaij</td> </tr> <tr class="fluent-data-grid-row" data-row-index="4" role="row" row-type="default" aria-rowindex="4" > <td col-index="1" class="col-justify-start" style="grid-column: 1; height: 32px;" role="gridcell" tabindex="0" >Bill Gates</td> </tr> </tbody> </table>
Build and Test Core Lib
Process completed with exit code 1.
Build and Deploy Demo site
ubuntu-latest pipelines will use ubuntu-24.04 soon. For more details, see https://github.com/actions/runner-images/issues/10636
Build and Deploy Demo site: examples/Demo/Shared/Pages/Lab/IssueTester.razor#L34
The field 'IssueTester._clearToggle' is never used
Build and Deploy Demo site: examples/Demo/Shared/Pages/Lab/IssueTester.razor#L34
The field 'IssueTester._clearToggle' is never used
Build and Deploy Demo site: examples/Demo/Shared/Pages/Lab/IssueTester.razor#L34
The field 'IssueTester._clearToggle' is never used