admin.dukany.io/public/assets/vendor_components/mixitup-v3/tests/unit/factory.js

'use strict';

require('jsdom-global')();

const chai    = require('chai');
const dom     = require('../mock/dom');
const dataset = require('../mock/dataset');
const mixitup = require('../../dist/mixitup.js');

describe('mixitup()', () => {
    it('should throw an error if no container reference', () => {
        chai.assert.throws(() => mixitup(), Error, mixitup.messages.errorFactoryInvalidContainer());
    });

    it('should throw an error if a null container reference is passed', () => {
        chai.assert.throws(() => mixitup(null), Error, mixitup.messages.errorFactoryInvalidContainer());
    });

    it('should throw an error if an invalid container reference is passed', () => {
        chai.assert.throws(() => mixitup({}), Error, mixitup.messages.errorFactoryInvalidContainer());
    });

    it('should throw an error if an invalid reference or selector is passed', function() {
        chai.assert.throws(() => mixitup(false), Error, mixitup.messages.errorFactoryInvalidContainer());
    });

    it('should throw an error if an invalid configuration option is passed', function() {
        let container = dom.getContainer();

        chai.assert.throws(() => {
            mixitup(container, {
                animations: {}
            });
        }, TypeError);
    });

    it('should accept an element reference as a container', () => {
        let container = dom.getContainer();
        let mixer = mixitup(container);

        chai.assert.isOk(mixer);

        mixer.destroy();
    });

    it('should accept a container selector', () => {
        let frag = document.createDocumentFragment();
        let container = dom.getContainer();

        frag.appendChild(container);

        let mixer = mixitup('.mixitup-container', {}, frag);
        let state = mixer.getState();

        chai.assert.isOk(mixer);
        chai.assert.equal(state.container, frag.querySelector('.mixitup-container'));

        mixer.destroy();
    });

    it('should accept a container and valid configuration object', function() {
        let container = dom.getContainer();
        let mixer = mixitup(container, {
            selectors: {
                target: '[data-ref="mix"]'
            },
            controls: {
                enable: false
            }
        });

        let state = mixer.getState();

        chai.assert.isOk(mixer);
        chai.assert.equal(state.activeFilter.selector, '[data-ref="mix"]');

        mixer.destroy();
    });

    it('should throw an error if the container selector yields no element', () => {
        chai.assert.throws(() => mixitup('.invalid-container-selector'), Error, mixitup.messages.errorFactoryContainerNotFound());
    });

    it('should return an instance of a facade by default', () => {
        let container = dom.getContainer();
        let mixer = mixitup(container);

        chai.assert.instanceOf(mixer, mixitup.Facade);

        mixer.destroy();
    });

    it('should return an instance of a mixer if debug mode enabled', () => {
        let container = dom.getContainer();
        let mixer = mixitup(container, {
            debug: {
                enable: true
            },
            controls: {
                enable: false
            }
        });

        chai.assert.instanceOf(mixer, mixitup.Mixer);

        mixer.destroy();
    });

    it('should return a single instance of a mixer, wrapping the first element if multiple elements passed', () => {
        let elementList = [
            dom.getContainer(),
            dom.getContainer()
        ];

        let mixer = mixitup(elementList, {
            debug: {
                enable: true
            },
            controls: {
                enable: false
            }
        });

        chai.assert.instanceOf(mixer, mixitup.Mixer);
        chai.assert.equal(mixer.getState().container, elementList[0]);

        mixer.destroy();
    });

    it('should return an instance of a collection if multiple elements passed and `returnCollection` specified', () => {
        let elementList = [
            dom.getContainer(),
            dom.getContainer()
        ];

        let collection = mixitup(elementList, void(0), void(0), true);

        chai.assert.instanceOf(collection, mixitup.Collection);
        chai.assert.instanceOf(collection[0], mixitup.Facade);
        chai.assert.instanceOf(collection[1], mixitup.Facade);

        collection.mixitup('destroy');
    });

    it('should add a unique ID to the container if no ID present', () => {
        let container = dom.getContainer();
        let mixer = mixitup(container);
        let state = mixer.getState();

        chai.assert.equal(container.id, state.id);

        mixer.destroy();
    });

    it('should use any existing ID on the container as the mixer ID if present', () => {
        let container = dom.getContainer();
        let id = 'test-id';

        container.id = id;

        let mixer = mixitup(container);
        let state = mixer.getState();

        chai.assert.equal(id, state.id);

        mixer.destroy();
    });

    it('should not allow multiple instance to be instantiated on a single container', () => {
        let container = dom.getContainer();

        let mixer1 = mixitup(container, {
            debug: {
                enable: true
            },
            controls: {
                enable: false
            }
        });

        let mixer2 = mixitup(container, {
            debug: {
                enable: true,
                showWarnings: false
            },
            controls: {
                enable: false
            }
        });

        let facade = mixitup(container);

        chai.assert.equal(mixer1, mixer2);
        chai.assert.notEqual(facade, mixer1);
        chai.assert.notEqual(facade, mixer2);

        mixer1.destroy();
    });

    it('should respect a `load.filter` configuration option of none', () => {
        let container = dom.getContainer();
        let mixer = mixitup(container, {
            load: {
                filter: 'none'
            }
        });

        let state = mixer.getState();

        chai.assert.equal(state.activeFilter.selector, '');
        chai.assert.equal(state.totalShow, 0);
        chai.assert.equal(state.hide[0].style.display, 'none');

        mixer.destroy();
    });

    it('should respect a `load.filter` configuration option of a single selector', () => {
        let container = dom.getContainer();
        let mixer = mixitup(container, {
            load: {
                filter: '.category-a'
            }
        });

        let state = mixer.getState();

        chai.assert.equal(state.activeFilter.selector, '.category-a');
        chai.assert.equal(state.totalShow, 3);

        mixer.destroy();
    });

    it('should respect a `load.filter` configuration option of a compound selector', () => {
        let container = dom.getContainer();
        let mixer = mixitup(container, {
            load: {
                filter: '.category-a.category-c'
            }
        });

        let state = mixer.getState();

        chai.assert.equal(state.activeFilter.selector, '.category-a.category-c');
        chai.assert.equal(state.totalShow, 1);

        mixer.destroy();
    });

    it('should respect a `load.sort` configuration option', () => {
        let idsByPublishedDate = dataset.slice().sort((a, b) => {
            let dateA = a.published;
            let dateB = b.published;

            if (dateA < dateB) {
                return -1;
            }

            if (dateA > dateB) {
                return 1;
            }

            return 0;
        }).map(item => item.id.toString());

        let container = dom.getContainer();
        let mixer = mixitup(container, {
            load: {
                sort: 'published'
            }
        });

        let state = mixer.getState();
        let targetIds = state.show.map(el => el.id);

        chai.assert.deepEqual(targetIds, idsByPublishedDate);

        mixer.destroy();
    });

    it('should add a `layout.containerClassName` class if specified and be reflected in state', () => {
        let container = dom.getContainer();
        let mixer = mixitup(container, {
            layout: {
                containerClassName: 'grid'
            }
        });

        let state = mixer.getState();

        chai.assert.equal(state.activeContainerClassName, 'grid');

        mixer.destroy();
    });
});