Akryum / Akryum/floating-vue

testing with jest + vue-test-utils / vitest

Abierto
#954 1 comentario 6 reacciones 0 asignados Ver en GitHub
Lenguaje dominante
TypeScript
Estrellas
3.5k
Forks
341
Merge medio
14 min
PR fusionados (30 d)
8

Descripción

Hello,

Would someone have an idea on how to properly test floating-vue implementation using jest/vue-test-utils ?

I was using v-tooltip and testing the tooltip content text with the following assertion as advised [here](https://github.com/vuejs/vue-test-utils/issues/1421#issuecomment-581100966).

```js
it('displays an explanation tooltip when a book cannot be rent', async () => {
const wrapper = renderedComponent({ isAvailableForRent: false });

const button = wrapper.get('[data-testid="rent-button"]');
await button.trigger('mouseenter');

await new Promise((resolve) => {
requestAnimationFrame(() => {
expect(wrapper.text()).toContain('the book is currently taken');
resolve();
});
});
});
```

It worked.

I am upgrading to floating-vue, while using it as a `directive` the test no longer pass, reading from the source is that `nextFrame() requestAnimationFrame ` is used in `Popper.vue` component which is itself used by the directive, so I dont get why it does not work.

I'd love to add a "how to test" section to the docs if anyone has a clue?

Guía de contribución

Abrir la guía de contribución

Evaluación

Este issue todavía no se ha evaluado.

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.