@exadel/esl/modules/esl-carousel/test/core/esl-carousel.slide.events.test.js

Exadel Smart Library (ESL) is the lightweight custom elements library that provide a set of super-flexible components

var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
import { createDummyCarousel } from '../common/esl-carousel.dummy';
import { ESLCarouselSlideEvent } from '../../core/esl-carousel.events';
import { ESLCarouselDirection } from '../../core/esl-carousel.types';
jest.mock('../../../esl-utils/dom/ready', () => ({
    onDocumentReady: (cb) => cb()
}));
describe('ESLCarouselRenderer: Slide change events created correctly', () => {
    const beforeEventTrap = jest.fn();
    const afterEventTrap = jest.fn();
    document.addEventListener(ESLCarouselSlideEvent.BEFORE, beforeEventTrap);
    document.addEventListener(ESLCarouselSlideEvent.AFTER, afterEventTrap);
    const { $carousel } = createDummyCarousel(5);
    describe('3 slides visible, no loop', () => {
        beforeEach(() => {
            beforeEventTrap.mockReset();
            afterEventTrap.mockReset();
        });
        beforeAll(() => __awaiter(void 0, void 0, void 0, function* () {
            $carousel.count = '3';
            $carousel.loop = 'false';
            yield Promise.resolve();
        }));
        test('ESLCarouselSlideEvent: Initial slide triggered correct events', () => __awaiter(void 0, void 0, void 0, function* () {
            const request = $carousel.renderer.navigate({ index: 0, direction: ESLCarouselDirection.NEXT }, { activator: 'user', stepDuration: 0 });
            expect(beforeEventTrap).toHaveBeenCalledTimes(1);
            expect(afterEventTrap).toHaveBeenCalledTimes(0);
            expect(beforeEventTrap).toHaveBeenLastCalledWith(expect.objectContaining({
                type: ESLCarouselSlideEvent.BEFORE,
                indexesAfter: [0, 1, 2],
                direction: ESLCarouselDirection.NEXT,
                activator: 'user'
            }));
            yield request;
            expect(afterEventTrap).toHaveBeenCalledTimes(1);
            expect(afterEventTrap).toHaveBeenLastCalledWith(expect.objectContaining({
                type: ESLCarouselSlideEvent.AFTER,
                indexesAfter: [0, 1, 2],
                direction: ESLCarouselDirection.NEXT,
                activator: 'user'
            }));
        }));
        test('ESLCarouselSlideEvent: correct events triggered in the middle state', () => __awaiter(void 0, void 0, void 0, function* () {
            const request = $carousel.renderer.navigate({ index: 1, direction: ESLCarouselDirection.NEXT }, { activator: 'user', stepDuration: 0 });
            expect(beforeEventTrap).toHaveBeenCalledTimes(1);
            expect(afterEventTrap).toHaveBeenCalledTimes(0);
            expect(beforeEventTrap).toHaveBeenLastCalledWith(expect.objectContaining({
                type: ESLCarouselSlideEvent.BEFORE,
                indexesBefore: [0, 1, 2],
                indexesAfter: [1, 2, 3],
                direction: ESLCarouselDirection.NEXT,
                activator: 'user'
            }));
            yield request;
            expect(afterEventTrap).toHaveBeenCalledTimes(1);
            expect(afterEventTrap).toHaveBeenLastCalledWith(expect.objectContaining({
                type: ESLCarouselSlideEvent.AFTER,
                indexesBefore: [0, 1, 2],
                indexesAfter: [1, 2, 3],
                direction: ESLCarouselDirection.NEXT,
                activator: 'user'
            }));
        }));
        test('ESLCarouselSlideEvent: Last slide triggered correct events', () => __awaiter(void 0, void 0, void 0, function* () {
            const request = $carousel.renderer.navigate({ index: 2, direction: ESLCarouselDirection.NEXT }, { activator: 'user', stepDuration: 0 });
            expect(beforeEventTrap).toHaveBeenCalledTimes(1);
            expect(afterEventTrap).toHaveBeenCalledTimes(0);
            expect(beforeEventTrap).toHaveBeenLastCalledWith(expect.objectContaining({
                type: ESLCarouselSlideEvent.BEFORE,
                indexesBefore: [1, 2, 3],
                indexesAfter: [2, 3, 4],
                direction: ESLCarouselDirection.NEXT,
                activator: 'user'
            }));
            yield request;
            expect(afterEventTrap).toHaveBeenCalledTimes(1);
            expect(afterEventTrap).toHaveBeenLastCalledWith(expect.objectContaining({
                type: ESLCarouselSlideEvent.AFTER,
                indexesBefore: [1, 2, 3],
                indexesAfter: [2, 3, 4],
                direction: ESLCarouselDirection.NEXT,
                activator: 'user'
            }));
        }));
    });
});