Grid- General Questions

Hello, Parag,

Regarding the questions:

1) Is there any event or attribute to uniquely identify row inside the grid? I wanted to check a scenario in which if there are multiple records inside the grid and in one of the row one of the columns is empty, then it should highlight it. - This can be achieved using the cell rendered by checking if there is a value, and if not to add an additional style(className):

https://stackblitz.com/edit/react-zyhgrz?file=index.html

2) Is unit testing possible for Grid using Jest? If yes, Can you please provide sample example? Yes, the Grid can be tested with Enzyme Jest, in fact, we are testing it internally with Jest. As for an example, it is a standard test:





Regards,
Stefan
Progress Telerik

Hi Stefan,

Do you have any documentation to test Kendo controls using Jest. 

 

Regards,

Parag

 

Hello, Parag,

As testing of our components has not specific requirements compare to a standard React components it is not covered directly in the documentation.

Still, we will consider adding an article which can be helpful when testing the components.

Regards,
Stefan
Progress Telerik

Hi Stefan,

Thanks for the reply.

 

As mentioned by you in earlier post, that you're also using jest for unit testing.

 

Do you any example for below scenario's or any related scenarios

• Clicking add new button will add new row to grid
• Removing row from grid when click on remove button
• checking value inside the control placed inside grid cell

Regards,

Parag

 

 

Hello, Parag,

Currently, we do not have these specific tests as they are connected with actions outside of the Grid.

Still, I can suggest the following approaches:

1) Make a test that will add a new record and check if the ''tr" elements inside the Grid are with 1 more.
2) With the remove, test, if the elements are with 1 less after the button, is clicked.
3) This will strongly depend on the use case and how the control is added and bound.

Regards,
Stefan
Progress Telerik

Hi Stefan,

 

Thanks for the quick reply.

In case of grid,we are performing some operation using onRowClick event, but when we try to unit test the same function, Jest is not calling that function. Can you please provide your input on this?

Below is the code snippet in Jest

Jest
const wrapper = mount(<ErrorGrid />);

wrapper.setProps({ errorGrid });
const spy = jest.spyOn(wrapper.instance(), "rowClick");

wrapper.update();
const dataitem = {
"errorCode": 1,
"errorDescription": "Required data is missing within this field.",
"errorLevel": 5,
"fieldID": "Testid",
"fieldName": "*testID",
"fieldTabMapping": 1
};

wrapper.find("GridRow").first().
simulate("click", dataitem);
expect(spy).toHaveBeenCalledTimes(0);

After execution the above unit test returns 0 time called.

Component

<Grid
                        style={{ margin: '0px 0px 5px 20px', height: '133px', width: '100%' }}
                        data={this.state.errorGrid}
                        onRowClick={this.rowClick}
                        resizable
                    />

Regards,

Parag

 

 

Hello, Parag,

I can suggest, just setting a variable counter for example, and on rowClick to increase its value:




Regards,
Stefan
Progress Telerik