使用Jest對Swiper進行測試
P粉805931281
P粉805931281 2023-08-31 22:35:14
0
1
537

我有一個元件,它使用swiper/react。 在編寫測試案例時,我無法模擬onSlideChange中取得的swiper事件。 我無法通過onSlideChangeHandler函數中的if條件。 有人可以幫忙嗎?謝謝!

import { Swiper, SwiperSlide } from 'swiper/react'; export default function Abcxyz(props: PropsType) { … … const onSlideChangeHandler = (swiper) => { const activeSlideIndex = swiper.activeIndex; const slides = swiper.slides; if (slides[activeSlideIndex]?.id === 'hybrid printer bundle') { visibleConfigOptionsStore.setVisibleConfigOptions( slides[activeSlideIndex].id ); } }; return (  onSlideChangeHandler(swiper)} > ) }

嘗試了一些方法,但目前沒有任何效果。

P粉805931281
P粉805931281

全部回覆 (1)
P粉384679266

由於您不想測試Swiper本身,只想驗證當onSlideChange被觸發時,您的處理程序是否執行,您可以按照以下步驟進行:

  1. 模擬Swiper,以便您可以使用testId和click事件來觸發onSlideChange
jest.mock('swiper/react', () => ({ Swiper: ({ children, onSlideChange }: { children: React.ReactNode; onSlideChange: () => void }) => ( 
{children}
), }));
  1. 現在在您的測試中觸發事件並進行任何斷言:
fireEvent.click(screen.getByTestId('swiper'));
    最新下載
    更多>
    網站特效
    網站源碼
    網站素材
    前端模板
    關於我們 免責聲明 Sitemap
    PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!