I have a Vue 2 project that uses v-calendar and I'd like to test it using @testing-library/vue. The library encourages you to use getByRole and specify a name to narrow down the results but here I can't since the DOM comes from an external library. I can't either use getByTestId for the same reason. The content of the button is an SVG so getByText is not possible neither.

Is it ok in this specific case to use the container returned from the render method and do container.querySelector('vc-nav-arrow is-left')?

<div role="button" class="vc-arrow is-left">
  <svg data-v-63f7b5ec="" width="26px" height="26px" viewBox="0 -1 16 34" class="vc-svg-icon"><path data-v-63f7b5ec="" d="M11.196 10c0 0.143-0.071 0.304-0.179 0.411l-7.018 7.018 7.018 7.018c0.107 0.107 0.179 0.268 0.179 0.411s-0.071 0.304-0.179 0.411l-0.893 0.893c-0.107 0.107-0.268 0.179-0.411 0.179s-0.304-0.071-0.411-0.179l-8.321-8.321c-0.107-0.107-0.179-0.268-0.179-0.411s0.071-0.304 0.179-0.411l8.321-8.321c0.107-0.107 0.268-0.179 0.411-0.179s0.304 0.071 0.411 0.179l0.893 0.893c0.107 0.107 0.179 0.25 0.179 0.411z"></path></svg>
</div>