Testing filtering in virtual scroller selectorAugust 18, 2019 at 10:20am
Hey Everyone. I'm new to testing, just started testing our env, and trying to show my bosses that it's worth my time. I'm trying to test our new selector component, and I want to test its filtering mechanism. I wanted to check how many
selector-optiondata-ids there are, but because we use a virtual-scroller, there are elements in the list that are not visible (they are translated out of screen) but are there when I do getAllByTestId. For now i'm doing
expect(selector.__vue__.filteredOptions.length).toBe(4)but I now we shouldn't test implementation details, and these are certainly implementation details. Thanks in advance!
August 19, 2019 at 3:17pm
I assume your virtual scroller is only rendering the visible DOM nodes and it replaces their content as you scroll/filter.
I'm guessing, then, that
getByTestId('your-option-id')is always returning your the same amount of elements - the visible ones. After filtering, the content of those 5 elements would've changed, so you could test that.
Hey , we meet again :D Thanks for answering.
I assumed like you too, but the virtual scroller renders also some elements before and after to make it faster when scrolling, so it doesn't work. The other elements are not visible on the screen because they are translated out of screen
August 20, 2019 at 6:12am