How to Bunit GridEvents RowSelected

[Daniele Cordioli]

Hello 

I have a SfGrid like this 

<SfGrid ID="Grid" @ref="Grid" DataSource="@Models" AllowSorting="true" AllowFiltering="true" AllowPaging="true" Toolbar="@ToolbarItemsGrid" Width="auto" ShowColumnChooser="true" AllowExcelExport="true" AllowPdfExport="true">

            <GridFilterSettings Mode="FilterBarMode.Immediate" ImmediateModeDelay="300">

            </GridFilterSettings>

            <GridEvents OnToolbarClick="ToolbarClick" RowSelected="RowSelectHandler" TValue="@Model"></GridEvents>

            <GridColumns>

                <GridColumn Field=@nameof( Model.Id) HeaderText="Id" IsPrimaryKey="true" Width="auto" Visible="false" FilterSettings="@(new FilterSettings() { Operator = Operator.Contains })"></GridColumn>

                <GridColumn Field=@nameof( Model.Code) HeaderText="Codice" Width="auto" FilterSettings="@(new FilterSettings() { Operator = Operator.Contains })"></GridColumn>

                <GridColumn Field=@nameof( Model.Description) HeaderText="Descrizione" Width="50%" FilterSettings="@(new FilterSettings() { Operator = Operator.Contains })"></GridColumn>

            </GridColumns>

        </SfGrid>

I want to test the RowSelected handler

How can I trigger the event RowSelected in unit testing with BUnit?

Thanks & Regards

[Vignesh Natarajan]

Hi Daniele,  

 

Thanks for contacting Syncfusion support.  

 

Query: “I want to test the RowSelected handler How can I trigger the event RowSelected in unit testing with BUnit?” 

 

We understand your requirement to test the event handler in Grid component. RowSelected event will be triggered when a record is selected. We can programmatically select the records using SelectRowAsync method of Grid. 

 

So we have rendered the Grid component in BUnit test and called SelectRowAsync method, so that (Selected Record) text is displayed in Markup. Refer the below code example.  

   

[Index.razor] 

<div>@text</div> 

  

<SfGrid @ref="Grid" DataSource="@Orders" AllowSorting="true" AllowFiltering="true" AllowPaging="true" Width="auto" ShowColumnChooser="true" AllowExcelExport="true" AllowPdfExport="true"> 

    <GridFilterSettings Mode="FilterBarMode.Immediate" ImmediateModeDelay="300"></GridFilterSettings> 

    <GridEvents OnToolbarClick="ToolbarClick" RowSelected="RowSelectHandler" TValue="Order"></GridEvents> 

    <GridColumns> 

        <GridColumn Field=@nameof(Order.OrderID) HeaderText="OrderID" ClipMode="ClipMode.EllipsisWithTooltip" IsPrimaryKey="true" TextAlign="TextAlign.Right" Width="120"></GridColumn> 

        <GridColumn Field=@nameof(Order.CustomerID) HeaderText="Customer Name" ClipMode="ClipMode.EllipsisWithTooltip" Width="120"></GridColumn> 

        <GridColumn Field=@nameof(Order.CheckedVal) HeaderText="Customer Name" ClipMode="ClipMode.EllipsisWithTooltip" Width="120"></GridColumn> 

        <GridColumn Field=@nameof(Order.OrderDate) HeaderText=" Order Date" EditType="EditType.DatePickerEdit" ClipMode="ClipMode.EllipsisWithTooltip" Format="d" TextAlign="TextAlign.Right" Width="130" Type="ColumnType.Date"></GridColumn> 

        <GridColumn Field=@nameof(Order.Freight) HeaderText="Freight" Format="C2" TextAlign="TextAlign.Right" Width="120"></GridColumn> 

    </GridColumns> 

</SfGrid> 

  

  

@code{ 

    public string text { get; set; } = ""; 

    public SfGrid<Order> Grid; 

    public void RowSelectHandler(RowSelectEventArgs<Order> Args) 

    { 

        text = "Selected Record"; 

    } 

 

[UnitTest1.cs] 

 

[Test]       public async Task TestMethod1()       {           //render the component           var cut = RenderComponent<Index>();           //selectrowasync method is used to select a record. where rowselected event will be triggered                await cut.InvokeAsync(async () => await cut.Instance.Grid.SelectRowAsync(0));           //diplsyaed Selected record text in markup using RowSelected event.            Assert.IsTrue(cut.Markup.Contains("Selected Record"));       }

 

 

For your convenience we have attached the sample, which can be downloaded from below 

 

Sample: https://www.syncfusion.com/downloads/support/forum/171305/ze/Serversample-1418582547.zip 

 

Please get back to us if you have further queries.  

 

Regards, 

Vignesh Natarajan