Akryum / Akryum/floating-vue

testing with jest + vue-test-utils / vitest

未關閉
#954 1 則留言 6 個 reaction 已指派 0 人 在 GitHub 檢視
主要語言
TypeScript
星號
3.5k
分支
341
平均合併
14 分鐘
30 天內合併 PR
8

描述

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?

貢獻指南

開啟貢獻指南

評估

這個 Issue 還沒有評估資料。

把新 issue 寄到你的電子郵件信箱

精選適合新手參與的 GitHub issue 摘要。