I'm writing the unit testing in react testing library.
I have a function that returns an object. under the I have a dom element in a key-value pair I tried searching in google. couldn't able to find the solution.
here is the function
export const transformResponse = (result: ISearchResponse, tab: ITabOption, searchText: string) => {
let response: IOption[];
// do some logics
response = (result as IClassicSearchResponse).queryResults.map((item: any) => {
return {
value: item.id,
label: item.Name,
renderElement: formatResult(item, searchText),
};
});
return response;
};
under the formatResult
method I'm returning the dom element
const formatResult = (entity: any, searchText: string) => {
const name =entity.Name;
return (
<div data-testid="entitySearch-data">
<span
style={{
fontSize: '11px',
marginLeft: '5px',
}}
>
sample name
</span>
</div>
);
};
here you can find my test case
const mockResponse = [
{
"value": "40577570",
"label": "test",
"renderElement": {
"type": "div",
"key": null,
"ref": null,
"props": {
"data-testid": "entitySearch-data",
"style": {
"padding": "0",
"display": "table",
"width": "100%"
},
"children": [
{
"type": "span",
"key": null,
"ref": null,
"props": {
"style": {
"padding": "4px 0px 4px 0px",
"display": "table-cell",
"width": "85%"
},
"children": [
{
"type": "span",
"key": null,
"ref": null,
"props": {
"children": {
"type": "b",
"key": null,
"ref": null,
"props": {
"children": {
"type": "span",
"key": null,
"ref": null,
"props": {
"children": [
"",
{
"type": "span",
"key": "0-1",
"ref": null,
"props": {
"className": "css-f3tk0d",
"children": "test"
},
"_owner": null
},
", Inc."
]
},
"_owner": null
}
},
"_owner": null
}
},
"_owner": null
},
{
"type": "div",
"key": null,
"ref": null,
"props": {
"children": {
"type": "span",
"key": null,
"ref": null,
"props": {
"children": [
"",
{
"type": "span",
"key": "0-1",
"ref": null,
"props": {
"className": "css-f3tk0d",
"children": "test"
},
"_owner": null
},
"GS:test"
]
},
"_owner": null
}
},
"_owner": null
},
{
"type": "div",
"key": null,
"ref": null,
"props": {
"children": "test Exchanges | test"
},
"_owner": null
}
]
},
"_owner": null
},
{
"type": "span",
"key": null,
"ref": null,
"props": {
"children": {
"type": "div",
"key": null,
"ref": null,
"props": {
"children": {
"type": "span",
"key": null,
"ref": null,
"props": {
"children": {
"type": "b",
"key": null,
"ref": null,
"props": {
"children": [
" ",
"Public Company",
" "
]
},
"_owner": null
}
},
"_owner": null
}
},
"_owner": null
}
},
"_owner": null
}
]
},
"_owner": null
},
}
]
it('transform response', () => {
const result = transformResponse(mockResult, mockTab, 'test');
expect(result).toBe(mockResponse);
});