amis2/__tests__/renderers/Carousel.test.tsx

import React = require('react');
import {render, fireEvent} from 'react-testing-library';
import '../../src/themes/default';
import {
    render as amisRender
} from '../../src/index';
import { makeEnv } from '../helper';

test('Renderer:carousel', async () => {
    const {
        container
    } = render(amisRender({
        type: 'carousel',
        controlsTheme: 'light',
        width: '500',
        height: '300',
        options: [
            {
                image: 'https://video-react.js.org/assets/poster.png',
                title: '标题',
                titleClassName: 'block',
                description: '描述',
                descriptionClassName: 'block'
            },
            {
                html: '<div style="width: 100%; height: 300px; background: #e3e3e3; text-align: center; line-height: 300px;">carousel data</div>'
            },
            {
                image: 'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg'
            }
        ],
        className: 'show'
    }, {}, makeEnv({
    })));

    const image = document.querySelector('div.a-Carousel-item');
    fireEvent.mouseEnter(image as HTMLDivElement);
    const leftArrow = document.querySelector('div.a-Carousel-leftArrow')
    fireEvent.click(leftArrow as HTMLDivElement);
    const rightArrow = document.querySelector('div.a-Carousel-rightArrow')
    fireEvent.click(rightArrow as HTMLDivElement);

    expect(container).toMatchSnapshot();
});