@schukai/monster/test/cases/dom/events.mjs

Monster is a simple library for creating fast, robust and lightweight websites.

'use strict';

import {expect} from "chai"

import {fireEvent, findTargetElementFromEvent, fireCustomEvent} from "../../../source/dom/events.mjs";
import {initJSDOM} from "../../util/jsdom.mjs";

describe('Events', function () {

    before(async function () {
        await initJSDOM();
    })

    describe('findTargetElementFromEvent()', function () {

        it('find object', function (done) {
            let container = document.createElement('div');
            container.setAttribute('data-monster', 'hello');
            let div = document.createElement('div');
            container.appendChild(div);
            div.addEventListener('click', (event) => {
                let e = findTargetElementFromEvent(event, 'data-monster');
                expect(e.getAttribute('data-monster')).to.be.equal('hello')
                done();
            })
            setTimeout(() => {
                fireEvent(div, 'click');
            }, 0)

        });

    });

    describe('fireEvent()', function () {
        it('should fire a click event', function (done) {
            let div = document.createElement('div');
            div.addEventListener('click', () => {
                done();
            })
            fireEvent(div, 'click');
        });

        it('should fire a touch event', function (done) {
            let div = document.createElement('div');
            div.addEventListener('touch', () => {
                done();
            })
            fireEvent(div, 'touch');
        });

        it('should fire a touch event on collection', function (done) {
            let div = document.createElement('div');
            div.addEventListener('touch', () => {
                done();
            })

            div.appendChild(document.createElement('div'));
            let collection = div.querySelectorAll('div');


            fireEvent(collection, 'touch');
        });

        it('should fire a touch event', function (done) {
            let div = document.createElement('div');
            div.addEventListener('touch', () => {
                done();
            })

            div.appendChild(document.createElement('div'));
            let collection = div.querySelectorAll('div');


            fireEvent(collection, 'touch');
        });

        it('should throw error', function () {
            expect(() => fireEvent({}, 'touch')).to.throw(Error);

        });
    });

    describe('fireCustomEvent()', function () {
        it('should fire a click event', function (done) {
            let div = document.createElement('div');
            div.addEventListener('click', () => {
                done();
            })
            fireCustomEvent(div, 'click');
        });

        it('should fire a touch event', function (done) {
            let div = document.createElement('div');
            div.addEventListener('touch', () => {
                done();
            })
            fireCustomEvent(div, 'touch');
        });

        it('should fire a touch event on collection1', function (done) {
            let div = document.createElement('div');
            div.addEventListener('touch', (e) => {
                if (e.detail.detail !== 'hello world') {
                    done('error');
                }
                done();
            })

            div.appendChild(document.createElement('div'));
            let collection = div.querySelectorAll('div');

            fireCustomEvent(collection, 'touch', "hello world");
        });

        it('should fire a touch event on collection2', function (done) {
            let div = document.createElement('div');
            div.addEventListener('touch', (e) => {
                if (e.detail.a !== 'hello world') {
                    done('error');
                }
                done();
            })

            div.appendChild(document.createElement('div'));
            let collection = div.querySelectorAll('div');

            fireCustomEvent(collection, 'touch', {a: "hello world"});
        });

        it('should fire a touch event', function (done) {
            let div = document.createElement('div');
            div.addEventListener('touch', () => {
                done();
            })

            div.appendChild(document.createElement('div'));
            let collection = div.querySelectorAll('div');


            fireCustomEvent(collection, 'touch');
        });

        it('should throw error', function () {
            expect(() => fireCustomEvent({}, 'touch')).to.throw(Error);
        });
    });


});