Search highlight not working when cell contains multiple HTML elements with text

[wooly]

Bootstraptable version(s) affected

1.22.2

Description

We have a use case where we render multiple pieces of text into a table cell inside separate html elements - imagine two span elements containing different pieces of text.

When searching, the results are filtered correctly but the search highlight isn't working.

I've attached an example whereby the search highlight is initially working (search for item and see everything get highlighted). However, when the breakTheThings variable is changed to true and run again, you'll see that the column now has an additional span containing the word 'Fish'. This breaks the search highlight when you search for 'item' as before, and nothing is highlighted.

Any assistance would be much appreciated!

Cheers.

Example(s)

https://live.bootstrap-table.com/code/wooly/17184

Possible Solutions

No response

Additional Context

No response

[chaskett]

I can confirm.

[wenzhixin]

@wooly @chaskett
https://live.bootstrap-table.com/code/wenzhixin/17978

[chaskett]

Looks great! Thanks @wenzhixin

[wooly]

Indeed thanks @wenzhixin!