import { DOM, IBindingContext, createBindingContext, ViewController } from 'mframejs';
import { JSDOM } from 'jsdom';
import { RepeatAttribute } from '../../../src/mframejs/attribute/repeatAttribute';



let tempNode: any;
let repeatAttribute: RepeatAttribute;
let bindingContext: IBindingContext;



describe('repeatAttribute "x of string"', () => {


    beforeAll(() => {
        const window = new JSDOM('').window;
        DOM.setConfig(window, window.document);
        tempNode = DOM.document.createElement('div');
        tempNode.setAttribute('repeat.for', 'a of string');
        tempNode.innerHTML = '${a}';
        repeatAttribute = new RepeatAttribute();
        bindingContext = createBindingContext({
            string: 'hello'
        });
        repeatAttribute.$bindingContext = bindingContext;
        repeatAttribute.$element = tempNode;
        repeatAttribute.$attribute = tempNode.getAttributeNode('repeat.for');
        repeatAttribute.$controller = ({
            getView() {
                return new ViewController(null, null);
            }
        } as any);

    });



    it('call created', () => {
        expect(repeatAttribute.created()).toBe(undefined);
    });



    it('call attached', () => {
        DOM.document.body.appendChild(tempNode);
        expect(repeatAttribute.attached()).toBe(undefined);
    });



    it('test elements', async () => {
        await DOM.waitFor(0);
        expect(DOM.document.body.children.length).toBe(5);
    });



    it('test elements content', () => {
        expect(DOM.document.body.children[0].innerHTML).toBe('h');
        expect(DOM.document.body.children[2].innerHTML).toBe('l');
        expect(DOM.document.body.children[4].innerHTML).toBe('o');
    });



    it('set to 20', async () => {
        bindingContext.$context.string = 'hellohellohellohello';
        await DOM.waitFor(0);
        expect(DOM.document.body.children.length).toBe(20);
    });



    it('set to 2', async () => {
        bindingContext.$context.string = 'ol';
        await DOM.waitFor(0);
        expect(DOM.document.body.children.length).toBe(2);
    });



    it('set to 0', async () => {
        bindingContext.$context.string = '';
        await DOM.waitFor(0);
        expect(DOM.document.body.children.length).toBe(0);
    });



    it('set to 100', async () => {
        bindingContext.$context.string = 'hellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohello';
        await DOM.waitFor(0);
        expect(DOM.document.body.children.length).toBe(100);
    });



    it('set to null', async () => {
        bindingContext.$context.string = null;
        await DOM.waitFor(0);
        expect(DOM.document.body.children.length).toBe(0);
    });


    it('set to 100', async () => {
        bindingContext.$context.string = 'hellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohello';
        await DOM.waitFor(0);
        expect(DOM.document.body.children.length).toBe(100);
    });



    it('set to undefined', async () => {
        bindingContext.$context.string = undefined;
        await DOM.waitFor(0);
        expect(DOM.document.body.children.length).toBe(0);
    });


    it('set to 100', async () => {
        bindingContext.$context.string = 'hellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohello';
        await DOM.waitFor(0);
        expect(DOM.document.body.children.length).toBe(100);
    });


    it('detach', async () => {
        repeatAttribute.detached();
    });


    it('check i removed all', async () => {
        await DOM.waitFor(0);
        expect(DOM.document.body.children.length).toBe(0);
    });



});