Problems with Vue and TypeScript

[iandevlin]

Please provide some detailed documentation on how one can set this up to work with TypeScript. The current documentation says that "Vue Testing Library does not require any configuration to be used." but this does not appear to be the case.

At the moment no matter what I try (even examples that exist in your documentation) TypeScript constantly complains about TS2339: Property X does not exist on type 'HTMLElement', where X is any one of the functions such as toBeVisible', 'toHaveClass etc.

For example, the following code throws this error:

import { render } from '@testing-library/vue';
import Component from '@/components/MyComponent/MyComponent.vue';

test('Component Test', async () => {
    const { getByTestId } = render(Component);
    expect(getByTestId('test-id').toHaveClass('test-class'));
});

(I have also tried adding import '@testing-library/jest-dom'; as I read something somewhere that indicates that one needs to do this, but it had no effect).

Now I may of course be missing something obvious, and I apologise if I am, but I have spent a number of hours trying to get this to work, to no avail.

Is there some extra configuration that I need to add somewhere? If so, where?

Any help would be appreciated. Thanks in advance.

[afontcu]

Hi!

Looks like the issue is related to jest-dom, not Vue Testing Library. As stated in their docs, there's no additional config to work with TS other than load jset-dom from a .ts file. Can you double check this is the case?

Thanks

[iandevlin]

Hello! Well crap, I apologise for posting here if it's clearly the wrong place. And yes, I have done what they say there, but to no avail. I will annoy them about it now, my apologies again and thanks for the help regardless!

[afontcu]

No prob! Thanks :)