/* eslint-env jquery,jasmine */

function clearList(idLista) {
    $('.rup_list-multiorder-dialog').remove();
    $('.ui-dialog').remove();
    $('#' + idLista).rup_list('destroy');
    $('#content').html('');
    $('#content').nextAll().remove();
}

describe('Test rup_list', () => {

    beforeAll((done) => {
        if ($('#content').length == 0) {
            $('body').append('<div id="content" class="container mt-4"></div>');
        }
        testutils.loadCss(done);
    });

    afterEach((done) => {
        clearList('rup-list');
        done();
    });


    describe('> Creación', () => {
        beforeEach((done) => {
        	listGen.createList('rup-list', 'listFilterForm', () => {
             done();
        	});
        });
        it('> Debe tener header y footer : ', () => {
            expect($('#rup-list-header').length).toBe(1);
            expect($('#rup-list-footer').length).toBe(1);
        });
        it('> El cuerpo de la lista debe estar vacío : ', () => {
            expect($('#rup-list').children().length).toBe(0);
        });
    });


    describe('> Funcionamiento', () => {

        describe('> Filtrado', () => {
            beforeEach((done) => {
                listGen.createList('rup-list', 'listFilterForm', () => {
                    
                    $('#rup-list').on('load', () => {
                    	done();
                    });
                    
                    $('#listFilterForm').find('#listFilterEdad').val(25);
                    $('#listFilterForm').find('#listFilterAceptar').click();
                });
            });
            it('> Filtra correctamente : ', () => {
                expect($('#rup-list').children().length).toBe(3);
                expect($('#usuario_value_25').text()).toBe('user25');
                expect($('#usuario_value_15').text()).toBe('user15');
                expect($('#usuario_value_5').text()).toBe('user5');
            });
        });


        describe('> Ordenación', () => {
            beforeEach((done) => {
                listGen.createList('rup-list', 'listFilterForm', () => {
                    $('#rup-list').on('load', () => {
                        $('#rup-list-header-sidx').rup_combo('setRupValue', 'EDAD');
                        $('#rup-list').off('load');
                        $('#rup-list').on('load', () => {
                        	done();
                        });
                        
                    });
                    $('#rup-list').rup_list('filter');
                    
                });
            });
            it('> Aparecen ordenados por el campo especificado :', () => {

	                    expect($('#rup-list > div:eq(0)').is('#rup-list-itemTemplate_12')).toBeTruthy();
	                    expect($('#rup-list > div:eq(1)').is('#rup-list-itemTemplate_2')).toBeTruthy();
	                    expect($('#rup-list > div:eq(2)').is('#rup-list-itemTemplate_1')).toBeTruthy();
	                    expect($('#rup-list > div:eq(3)').is('#rup-list-itemTemplate_8')).toBeTruthy();
	                    expect($('#rup-list > div:eq(4)').is('#rup-list-itemTemplate_21')).toBeTruthy();
                


            });
            describe('>  Se invierte la ordenación mediante el botón definido para ello', () => {
                beforeEach((done) => {
                	$('#rup-list').on('load', () => {
                		$('#rup-list-header-sord').click();
                		$('#rup-list').on('load', () => {
                			done();
                		});
                	});
                    
                });
                it('> La ordenacion se invierte: ', () => {
                    expect($('#rup-list > div:eq(0)').is('#rup-list-itemTemplate_9')).toBeTruthy();
                    expect($('#rup-list > div:eq(1)').is('#rup-list-itemTemplate_8')).toBeTruthy();
                    expect($('#rup-list > div:eq(2)').is('#rup-list-itemTemplate_7')).toBeTruthy();
                    expect($('#rup-list > div:eq(3)').is('#rup-list-itemTemplate_6')).toBeTruthy();
                    expect($('#rup-list > div:eq(4)').is('#rup-list-itemTemplate_5')).toBeTruthy();
                });
            });
        });


        describe('> Paginación', () => {
            beforeEach((done) => {
                listGen.createList('rup-list', 'listFilterForm', () => {
                    $('#rup-list').rup_list('filter');
                    done();
                });
            });
            describe('> Página siguiente', () => {
                beforeEach((done) => {
                    $('#rup-list').on('load', () => {
                        $('#rup-list-header-page-next').click();
                         $('#rup-list').on('load', () => {
                            done();
                         });
                          
                    });
                });
                it('> Ha cambiado la página activa en la navegación:', () => {
                    expect($('.page.active').attr('data-page')).toBe('2');
                });
                it('> Se activa la opción de página anterior', () => {
                    expect($('#rup-list-header-page-prev').is('.disabled')).toBeFalsy();
                });
                it('> Están los registros esperados:', () => {
                    expect($('#rup-list-itemTemplate_14').length).toBe(1);
                    expect($('#rup-list-itemTemplate_15').length).toBe(1);
                    expect($('#rup-list-itemTemplate_16').length).toBe(1);
                    expect($('#rup-list-itemTemplate_17').length).toBe(1);
                    expect($('#rup-list-itemTemplate_18').length).toBe(1);
                });
                describe('> Funcionalidad en la última página', () => {
                    beforeEach(() => {});
                    it('> El control para ir a la página siguiente está deshabilitado:', () => {
                        expect($('#rup-list-header-page-next').is('.disabled')).toBeFalsy();
                    });
                });
            });
            describe('> Página anterior', () => {
                beforeEach((done) => {
                  //  $('#rup-list').on('load', () => {
                        $('#rup-list').off('load');
                       	$('#rup-list').on('load', () => {
                    		done();
                    	});
                        $('#rup-list-header-page-prev').click();
                    //});
                    $('#rup-list-header-page-next').click();
                });
                it('> Cambia la página activa en el nav: ', () => {
                    expect($('.page.active').attr('data-page')).toBe('1');
                });
                it('> Están los registros esperados:', () => {
                    expect($('#rup-list-itemTemplate_1').length).toBe(1);
                    expect($('#rup-list-itemTemplate_10').length).toBe(1);
                    expect($('#rup-list-itemTemplate_11').length).toBe(1);
                    expect($('#rup-list-itemTemplate_12').length).toBe(1);
                    expect($('#rup-list-itemTemplate_13').length).toBe(1);
                });
                describe('> Funcionamiento primera página', () => {
                    it('> Se desactiva la opción de página anterior', () => {
                        expect($('#rup-list-header-page-prev').is('.disabled')).toBeTruthy();
                    });
                });
            });
            describe('> Acceso directo a página desde el nav', () => {
                beforeEach((done) => {
                   	$('#rup-list').on('load', () => {
                   		$('.page[data-page="2"]', $('#rup-list-header')).click();
                   		$('#rup-list').on('load', () => {
                   			done();
                   		});
                	});
                    
                });
                describe('> Se marca la página correcta en el nav', () => {
                    it('> Ha cambiado la página activa en la navegación:', () => {
                        expect($('.page.active').attr('data-page')).toBe('2');
                    });
                });
                it('> Se activa la opción de página anterior', () => {
                    expect($('#rup-list-header-page-prev').is('.disabled')).toBeFalsy();
                });
            });
        });


        describe('> Elementos por página', () => {
            beforeEach((done) => {
                listGen.createList('rup-list', 'listFilterForm', () => {
                    $('#rup-list').on('load', () => {
                        $('#rup-list').off('load');
                       	$('#rup-list').on('load', () => {
                    		done();
                    	});
                        $('#rup-list-header-rowNum').rup_combo('setRupValue', '10');
                    });
                    $('#rup-list').rup_list('filter');
                });
            });
            it('> Varía el número de elementos por página:', () => {
                expect($('#rup-list').children().length).toBe(10);
            });
            it('> Varía el número de páginas: ', () => {
                expect($('.page:last', $('#rup-list-header')).attr('data-page')).toBe('4');
            });
            describe('> Navegamos a la última página', () => {
                beforeEach((done) => {
                	$('#rup-list').off('load');
                	$('#rup-list').on('load', () => {
                		done();
                	});
                    $('.page[data-page="4"]', $('#rup-list-header')).click();
                });
                it('> Hay el número de elementos esperados:', () => {
               		expect($('#rup-list').children().length).toBe(2);
                });
            });
        });


        describe('> Aparición de los separadores ("...") en la paginación', () => {
            beforeEach((done) => {
                
                listGen.createList('rup-list', 'listFilterForm', () => {
                	done();
                });
            });

            describe('> Separador del inicio', () => {
                beforeEach((done) => {
                    $('#rup-list').on('load', () => {
                        $('#rup-list').off('load');
                       	$('#rup-list').on('load', () => {
                    		done();
                    	});
                        $('.page[data-page="7"]', $('#rup-list-header')).click();
                    });
                    $('#rup-list').rup_list('filter');
                });
                it('> No aparece el separador del final: ', () => {
                    expect($('.pagination', $('#rup-list-header-nav')).children().eq(-4).text()).toBe('6');
                });
                it('> Aparece el separador del inicio: ', () => {
                    expect($('.pagination', $('#rup-list-header-nav')).children().eq(2).text()).toBe('...');
                });
            });
            describe('> Separador del final', () => {
                beforeEach((done) => {
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    $('#rup-list').rup_list('filter');
                });
                it('> Aparece el separador del final: ', () => {
                    expect($('.pagination', $('#rup-list-header-nav')).children().eq(-3).text()).toBe('...');
                });
                it('> No aparece el separador del inicio: ', () => {
                    expect($('.pagination', $('#rup-list-header-nav')).children().eq(3).text()).toBe('2');
                });
            });
            describe('> Ambos separadores', () => {
                beforeEach((done) => {
                    $('#rup-list').on('load', () => {
                        $('#rup-list').off('load');
                        $('#rup-list').on('load', () => {
                            $('#rup-list').off('load');
                           	$('#rup-list').on('load', () => {
                        		done();
                        	});
                            $('.page[data-page="4"]', $('#rup-list-header')).click();
                        });
                        $('.page[data-page="3"]', $('#rup-list-header')).click();
                    });
                    $('#rup-list').rup_list('filter');
                });
                it('> Aparece el separador del final: ', () => {
                    expect($('.pagination', $('#rup-list-header-nav')).children().eq(-3).text()).toBe('...');
                });
                it('> Aparece el separador del inicio: ', () => {
                    expect($('.pagination', $('#rup-list-header-nav')).children().eq(2).text()).toBe('...');
                });
            });
        });


        describe('> Control de errores', () => {
            beforeEach((done) => {
                listGen.createList('rup-list', 'listFilterForm', () => {
                    $('#rup-list').on('load', () => {
                        done();
                    });
                    $('#listFilterForm').find('#listFilterUsuario').val('user20');
                    $('#listFilterForm').find('#listFilterAceptar').click();
                });
            });
            it('> Aparece el feedback con el error:', () => {
                expect($('#rup-list-feedback').hasClass('rup-feedback_image_error')).toBeTruthy();
                expect($('#rup-list-feedback').text()).toBe('Error de prueba');
            });
            it('> No se muestra el componente de listado:', () => {
                expect($('#rup-list-header').css('display')).toBe('none');
                expect($('#rup-list').css('display')).toBe('none');
                expect($('#rup-list-footer').css('display')).toBe('none');
            });
        });


        describe('> Selección y multiselección', () => {
            beforeEach((done) => {
                listGen.createList('rup-list', 'listFilterForm', () => {
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    $('#rup-list').rup_list('filter');
                });
            });
            describe('> Creación y funcionamiento del groupButton', () => {
                it('> Se crea el botón:', () => {
                    expect($('button#rup-list-display-selectables', $('#rup-list-header')).length).toBe(1);
                    expect($('button#rup-list-display-selectables', $('#rup-list-header')).text().trim()).toBe('Opciones de seleccion:');
                    expect($('button#rup-list-display-selectables', $('#rup-list-footer')).length).toBe(1);
                    expect($('button#rup-list-display-selectables', $('#rup-list-footer')).text().trim()).toBe('Opciones de seleccion:');
                });
                describe('> Funcionamiento del botón', () => {
                    beforeEach(() => {
                        $('#rup-list-display-selectables', $('#rup-list-header')).click();
                    });
                    it('> Deben mostrarse las opciones de selección:', () => {
                        expect($('.dropdown-menu[aria-labelledby="rup-list-display-selectables"]', $('#rup-list-header')).is(':visible')).toBeTruthy();
                    });
                });
            });
            describe('> Funcionalidad de las opciones', () => {
                beforeEach(() => {
                    $('#rup-list-display-selectables', $('#rup-list-header')).click();
                });
                describe('> Opción Seleccionar página', () => {
                    beforeEach((done) => {
                        
                        $('#rup-list').on('listAfterMultiselection', () => {
                        	done();
                        });
                        $('.selectable-selectPage', $('#rup-list-header')).click();
                    });
                    it('> Los elementos de la pagina se han seleccionado:', () => {
                        $('#rup-list').children().toArray().forEach((elem) => {
                            expect($(elem).hasClass('rup_list-item-selected')).toBeTruthy();
                        });
                    });
                    describe('> Si vamos a la página siguiente', () => {
                        beforeEach((done) => {
                        	$('#rup-list').off('load');
                        	$('#rup-list').on('load', () => {
                        		done();
                        	});
                            $('#rup-list-header-page-next', $('#rup-list-header')).click();
                        });
                        it('> Los elementos no están seleccionados', () => {
                        	
	                            $('#rup-list').children().toArray().forEach((elem) => {
	                                expect($(elem).hasClass('rup_list-item-selected')).toBeFalsy();
	                            });
                        	
                        });
                        describe('> Si volvemos a la pagina anterior', () => {
                            beforeEach((done) => {
                            	$('#rup-list').off('load');
                            	$('#rup-list').on('load', () => {
                            		done();
                            	});
                                $('#rup-list-header-page-prev', $('#rup-list-header')).click();
                            });
                            it('> Los elementos de la pagina siguen estando seleccionados', () => {
                            	
	                                $('#rup-list').children().toArray().forEach((elem) => {
	                                expect($(elem).hasClass('rup_list-item-selected')).toBeTruthy();
	                               
                            	});
                            });
                        });
                    });
                });
                describe('> Opción Deseleccionar página', () => {
                    beforeEach((done) => {
                        $('#rup-list').on('listAfterMultiselection', () => {
                            $('#rup-list').off('listAfterMultiselection');
                            $('#rup-list').on('listAfterMultiselection', () => {
                            	done();
                            });
                            $('.selectable-deselectPage', $('#rup-list-header')).click();
                        });
                        $('.selectable-selectPage', $('#rup-list-header')).click();
                    });
                    it('> Los elementos no están seleccionados', () => {
                        $('#rup-list').children().toArray().forEach((elem) => {
                            expect($(elem).hasClass('rup_list-item-selected')).toBeFalsy();
                        });
                    });
                });
                describe('> Opción Seleccionar todo', () => {
                    beforeEach(() => {
                        
                        $('#rup-list').on('listAfterMultiselection', () => {
                        	//done();
                        });
                        $('.selectable-selectAll', $('#rup-list-header')).click();
                    });
                    it('> Los elementos de la pagina se han seleccionado:', () => {
                        $('#rup-list').children().toArray().forEach((elem) => {
                            expect($(elem).hasClass('rup_list-item-selected')).toBeTruthy();
                        });
                    });
                    describe('> Si deseleccionamos la página', () => {
                        beforeEach(() => {
                            
                         
                            $('.selectable-deselectPage', $('#rup-list-header')).click();
                        });
                        it('> Los elementos estan deseleccionados', () => {
                            $('#rup-list').children().toArray().forEach((e) => {
                                expect($(e).hasClass('rup_list-item-selected')).toBeFalsy();
                            });
                        });
                        describe('> Y filtramos', () => {
                            beforeEach((done) => {
                            	$('#rup-list').off('load');
                            	$('#rup-list').on('load', () => {
                            		done();
                            	});
                                $('#rup-list').rup_list('filter');
                            });
                            it('> Los elementos deben estar deseleccionados:', () => {
                                $('#rup-list').children().toArray().forEach((e) => {
	                             expect($(e).hasClass('rup_list-item-selected')).toBeFalsy();
                            	});
                            });
                        });
                    });
                    describe('> Si vamos a la página siguiente', () => {
                        beforeEach((done) => {
                        	$('#rup-list').off('load');
                        	$('#rup-list').on('load', () => {
                        		done();
                        	});
                            $('#rup-list-header-page-next', $('#rup-list-header')).click();
                        });
                        it('> Los elementos no están seleccionados', () => {
                            $('#rup-list').children().toArray().forEach((elem) => {
                            	expect($(elem).hasClass('rup_list-item-selected')).toBeTruthy();
                        	});
                        });
                    });
                });
                describe('> Opción Deseleccionar todo', () => {
                    beforeEach((done) => {
                        $('#rup-list').on('listAfterMultiselection', () => {
                            $('#rup-list').off('listAfterMultiselection');
                            
                            $('#rup-list').on('listAfterMultiselection', () => {
                            	done();
                            });
                            $('.selectable-deselectAll', $('#rup-list-header')).click();
                        });
                        $('.selectable-selectAll', $('#rup-list-header')).click();
                    });
                    it('> Los elementos de la pagina se han seleccionado:', () => {
                        $('#rup-list').children().toArray().forEach((elem) => {
                            expect($(elem).hasClass('rup_list-item-selected')).toBeFalsy();
                        });
                    });
                    describe('> Si vamos a la página siguiente', () => {
                        beforeEach((done) => {
                        	$('#rup-list').off('load');
                        	$('#rup-list').on('load', () => {
                        		done();
                        	});
                            $('#rup-list-header-page-next', $('#rup-list-header')).click();
                        });
                        it('> Los elementos no están seleccionados', () => {
	                            $('#rup-list').children().toArray().forEach((elem) => {
	                                expect($(elem).hasClass('rup_list-item-selected')).toBeFalsy();
	                            });
                        });
                    });
                });
            });
        });


        describe('> Multiordenación', () => {
            beforeEach((done) => {
            	listGen.createListMultiorder('rup-list', 'listFilterForm', () => {
            		done();
            	});
            });

            describe('> Creación del summary y el botón de edición de la ordenación', () => {
                it('> Debe crear el summary con los dos valores por defecto:', () => {
                    let sum = $('.rup_list-multiorder-summary').toArray();
                    sum.forEach((elem) => {
                        let children = $('.badge', $(elem)).toArray();
                        expect(children.length).toBe(2);
                        expect($(children[0]).text().trim()).toBe('Edad');
                        expect($('span.mdi-chevron-up', $(children[0])).length).toBe(1);
                        expect($(children[1]).text().trim()).toBe('Usuario');
                        expect($('span.mdi-chevron-down', $(children[1])).length).toBe(1);
                    });

                });
                it('> Debe crear el botón:', () => {
                    let ctx = $('.rup_list-mord-dialogbtn:first').toArray();

                    ctx.forEach((elem) => {
                        expect($(elem).hasClass('mdi-pencil')).toBeTruthy();
                    });
                });
            });
            describe('> Funcionamiento del dialogo de edición de la ordenación', () => {
                beforeEach((done) => {

                    $('#rup-list').on('load', () => {
                        $('.rup_list-mord-dialogbtn:first').click();
                        done();
                    });
                    $('#rup-list').rup_list('filter');
                });

                it('> Se muestra el dialogo:', () => {
                    expect($('.rup_list-mord-dialog').is(':visible')).toBeTruthy();
                });
                it('> Los campos de la ordenación por defecto están convertidos a líneas:', () => {
                    let ctx = $('.rup_list-ord-line').toArray();
                    expect($(ctx[0]).data('ordvalue')).toBe('EDAD');
                    expect($('.rup_list-mord', $(ctx[0])).data('direction')).toBe('asc');
                    expect($(ctx[1]).data('ordvalue')).toBe('USUARIO');
                    expect($('.rup_list-mord', $(ctx[1])).data('direction')).toBe('desc');
                });

                describe('> Los botones se convierten en líneas', () => {
                    beforeEach((done) => {
                        $('#rup-list').off('load');
                       	$('#rup-list').on('load', () => {
                    		done();
                    	});
                        $('button[data-ordvalue="CODCLIENTE"]').click();
                    });
                    it('> Desaparece el botón:', () => {
                        expect($('button[data-ordvalue="CODCLIENTE"]').length).toBe(0);
                    });
                    it('> Aparece la línea: ', () => {
                        expect($('.rup_list-ord-line[data-ordvalue="CODCLIENTE"]').length).toBe(1);
                    });
                    it('> Los cambios se reflejan en el summary:', () => {
                        let ctx = $('.rup_list-multiorder-summary').toArray();
                        ctx.forEach((menu) => {
                            expect($('.badge:contains(Codigo cliente)', $(menu)).length).toBe(1);
                        });
                    });
                });
                describe('> Las lineas se convierten en botones', () => {
                    beforeEach((done) => {
                        $('#rup-list').off('load');
                       	$('#rup-list').on('load', () => {
                    		done();
                    	});
                        $('.rup_list-mord-remove', $('[data-ordValue="USUARIO"]')).click();
                    });
                    it('> Desaparece la línea: ', () => {
                        expect($('.rup_list-ord-line[data-ordValue="USUARIO"]').length).toBe(0);
                    });
                    it('> Aparece el botón: ', () => {
                        expect($('button[data-ordValue="USUARIO"]').length).toBe(1);
                    });
                    it('> Los cambios se reflejan en el summary:', () => {
                        let ctx = $('.rup_list-multiorder-summary').toArray();
                        ctx.forEach((menu) => {
                            expect($('.badge:contains(Usuario)', $(menu)).length).toBe(0);
                        });
                    });
                });
            });
            describe('> Funcionamiento del multiSort', () => {
                describe('> Ordenación con el valor por defecto', () => {
                    beforeEach((done) => {
                       	$('#rup-list').on('load', () => {
                    		done();
                    	});
                        $('#rup-list').rup_list('filter');
                    });
                    it('> Deben aparecer los resultados esperados:', () => {
                        let cards = $('#rup-list').children().toArray();
                        expect(cards[0].id).toBe('rup-list-itemTemplate_12');
                        expect(cards[1].id).toBe('rup-list-itemTemplate_2');
                        expect(cards[2].id).toBe('rup-list-itemTemplate_8');
                        expect(cards[3].id).toBe('rup-list-itemTemplate_21');
                        expect(cards[4].id).toBe('rup-list-itemTemplate_1');
                    });
                });
                describe('> Ordenación con todos los valores de ordenación', () => {
                    beforeEach((done) => {
                        $('#rup-list').on('load', () => {
                            $('#rup-list').off('load');
                           	$('#rup-list').on('load', () => {
                        		done();
                        	});
                            $('#rup-list').on('rup_list-mord-dialogOpen', () => {
                                setTimeout(() => {
                                    $('button[data-ordValue="CODCLIENTE"]').click();
                                    $('.ui-dialog-buttonset > button').click();
                                }, 500);
                            });
                            $('.rup_list-mord-dialogbtn:first').click();
                        });
                        $('#rup-list').rup_list('filter');
                    });
                    it('> Deben aparecer los resultados esperados:', () => {
                        let cards = $('#rup-list').children().toArray();
                        expect(cards[0].id).toBe('rup-list-itemTemplate_12');
                        expect(cards[1].id).toBe('rup-list-itemTemplate_2');
                        expect(cards[2].id).toBe('rup-list-itemTemplate_8');
                        expect(cards[3].id).toBe('rup-list-itemTemplate_21');
                        expect(cards[4].id).toBe('rup-list-itemTemplate_1');
                    });
                });
                describe('> Ordenación con un valor ascendente y otro descendente', () => {
                    beforeEach((done) => {
                        $('#rup-list').on('load', () => {
                            $('#rup-list').off('load');
                           	$('#rup-list').on('load', () => {
                        		done();
                        	});
                            $('#rup-list').on('rup_list-mord-dialogOpen', () => {
                                setTimeout(() => {
                                    $('.rup_list-mord', $('[data-ordValue="EDAD"]')).click();
                                    $('.ui-dialog-buttonset > button').click();
                                }, 500);
                            });
                            $('.rup_list-mord-dialogbtn:first').click();
                        });
                        $('#rup-list').rup_list('filter');
                    });
                    it('> Deben aparecer los resultados esperados:', () => {
                        let cards = $('#rup-list').children().toArray();
                        expect(cards[0].id).toBe('rup-list-itemTemplate_10');
                        expect(cards[1].id).toBe('rup-list-itemTemplate_4');
                        expect(cards[2].id).toBe('rup-list-itemTemplate_9');
                        expect(cards[3].id).toBe('rup-list-itemTemplate_3');
                        expect(cards[4].id).toBe('rup-list-itemTemplate_23');
                    });
                });
            });
        });

        describe('> Carga Scroll x5', () => {
            beforeAll((done) => {
                testutils.loadCss(done);
            });
            beforeEach((done) => {
                listGen.createListScrollx5('rup-list', 'listFilterForm', () => {
                    $('#rup-list').rup_list('filter');
                    $('#rup-list').on('load', () => {
                        $('#rup-list').off('load');
                       	$('#rup-list').on('load', () => {
                    		done();
                    	});
                        $('html, body').animate({
                            scrollTop: 500
                        }, 500);
                    });
                });
                $('window, body').css({
                    'height': '2000px'
                });
            });
            afterEach(() => {
                window.scrollTo(0, 0);
                clearList('rup-list');
            });
            it('> La Funcionalidad de carga:', () => {
                expect($('#rup-list').children().length).toEqual(10);
            });
            it('> El bloque de paginación debe desaparecer:', () => {
                expect($('#rup-list-header-nav').is(':visible')).toBe(false);
                expect($('#rup-list-footer-nav').is(':visible')).toBe(false);
            });
        });

        describe('> Carga Scroll x10', () => {
            beforeAll((done) => {
                testutils.loadCss(done);
            });
            beforeEach((done) => {
                listGen.createListScrollx10('rup-list', 'listFilterForm', () => {
                    $('#rup-list').rup_list('filter');
                    $('#rup-list').on('load', () => {
                        $('#rup-list').off('load');
                       	$('#rup-list').on('load', () => {
                    		done();
                    	});
                        $('html, body').animate({
                            scrollTop: 1000
                        }, 500);
                    });
                });
                $('window, body').css({
                    'height': '5000px'
                });
            });
            afterEach(() => {
                window.scrollTo(0, 0);
                clearList('rup-list');
            });
            it('> La Funcionalidad de carga:', () => {
                expect($('#rup-list').children().length).toEqual(20);
            });
            it('> El bloque de paginación debe desaparecer:', () => {
                expect($('#rup-list-header-nav').is(':visible')).toBe(false);
                expect($('#rup-list-footer-nav').is(':visible')).toBe(false);
            });
        });

        describe('> Header Sticky', () => {
            beforeAll((done) => {
                testutils.loadCss(done);
            });
            beforeEach((done) => {
                listGen.createHeaderSticky('rup-list', 'listFilterForm', () => {
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    $('#rup-list').rup_list('filter');
                });
                $('window, body').css({
                    'height': '2000px'
                });
                $('html, body').animate({
                    scrollTop: 500
                }, 500);
            });
            afterAll(() => {
                window.scrollTo(0, 0);
            });
            it('> El header debe tener el class:', () => {
                expect($('#rup-list-header').hasClass('rup_list-sticky')).toEqual(true);
            });
        });

        describe('> Transiciones carga filas configurable', () => {
            beforeAll((done) => {
                testutils.loadCss(done);
            });
            beforeEach((done) => {
                listGen.createShowHide('rup-list', 'listFilterForm', () => {
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    $('#rup-list').rup_list('filter');
                });
            });

            describe('> Transición SHOW', () => {
                var spyShow;
                var callsCounterWithArgs = 0;
                var opcionesShow = {
                    animation: 'fade',
                    delay: 1000
                };
                beforeEach((done) => {
                	$('#rup-list').off('load');
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    spyShow = spyOn($.fn, 'show').and.callThrough();
                    $('#listFilterForm').find('#listFilterAceptar').click();
                });
                it('> Tiene que haber sido llamado SHOW con los argumentos:', () => {
                    for (let i = 0; i < spyShow.calls.count(); i++) {
                        if (spyShow.calls.argsFor(i).length != 0) {
                            if (spyShow.calls.argsFor(i)[0] == opcionesShow.animation) {
                                if (spyShow.calls.argsFor(i)[2] == opcionesShow.delay) {
                                    callsCounterWithArgs++;
                                }
                            }
                        }
                    }
                    expect(spyShow).toHaveBeenCalled();
                    expect(callsCounterWithArgs).toEqual($('#rup-list').children().length);
                });
            });

            describe('> Transición HIDE', () => {
                var spyHide;
                var callsCounterWithArgs = 0;
                var opcionesHide = {
                    animation: 'fade',
                    delay: 1000
                };
                beforeEach((done) => {
                	$('#rup-list').off('load');
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    spyHide = spyOn($.fn, 'hide').and.callThrough();
                    $('#listFilterForm').find('#listFilterAceptar').click();
                });
                it('> Tiene que haber sido llamado HIDE con los argumentos:', () => {
                    for (let i = 0; i < spyHide.calls.count(); i++) {
                        if (spyHide.calls.argsFor(i).length != 0) {
                            if (spyHide.calls.argsFor(i)[0] == opcionesHide.animation) {
                                if (spyHide.calls.argsFor(i)[2] == opcionesHide.delay) {
                                    callsCounterWithArgs++;
                                }
                            }
                        }
                    }
                    expect(spyHide).toHaveBeenCalled();
                    expect(callsCounterWithArgs).toEqual($('#rup-list').children().length);
                });
            });
        });

        describe('> Impresión HTML', () => {
            var spyAjax;
            beforeAll((done) => {
                testutils.loadCss(done);
            });
            beforeEach((done) => {
                listGen.createImpresionHTML('rup-list', 'listFilterForm', () => {
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    $('#rup-list').rup_list('filter');
                });
                spyAjax = spyOn($, 'rup_ajax').and.callThrough();
            });
            it('> Tiene que aparecer el bóton "Imprimir":', () => {
                expect($('#listPrint').length).toEqual(1);
            });
            it('> Ajax con cantidad de los elementos 32:', () => {
                $('#listPrint').click();
                expect(Number(JSON.parse(spyAjax.calls.argsFor(0)[0].data).rows)).toEqual(5);
                expect(Number(JSON.parse(spyAjax.calls.argsFor(1)[0].data).rows)).toEqual(32);
            });
        });

        describe('> SuperSelect', () => {
            var keyPress = (key, callback) => {
                var event = document.createEvent('Event');
                event.keyCode = key;
                event.key = key;
                event.initEvent('keydown');
                document.dispatchEvent(event);
                if (callback) {
                    callback();
                }
            };
            var keyUp = (key, callback) => {
                var event = document.createEvent('Event');
                event.keyCode = key;
                event.key = key;
                event.initEvent('keyup');
                document.dispatchEvent(event);
                if (callback) {
                    callback();
                }
            };
            beforeAll((done) => {
                testutils.loadCss(done);
            });
            beforeEach((done) => {
                listGen.createSuperSelect('rup-list', 'listFilterForm', () => {
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    $('#rup-list').rup_list('filter');
                });
            });
            it('> Tiene que aparecer el class .list-item:', () => {
                expect($('#rup-list').children().hasClass('list-item')).toBeTruthy();
            });
            it('> Tiene que aparecer el attr rup-list-selector="enabled":', () => {
                expect($('#rup-list').children().attr('rup-list-selector')).toEqual('enabled');
            });
            describe('> Al hacer click tiene que seleccionar solo un elemento en la misma pagina', () => {
                it('> Puede estar solo un elemento elegido:', () => {
                    for (let i = 0; i < $('.list-item').length; i++) {
                        $('.list-item').eq(i).click();
                        if ($('.list-item').eq(i).hasClass('rup_list-item-selected')) {
                            for (let x = 0; x < $('.list-item').length; x++) {
                                if ($('.list-item').eq(x).attr('id') != $('.list-item').eq(i).attr('id')) {
                                    expect($('.list-item').eq(x).hasClass('rup_list-item-selected')).toBeFalse();
                                }
                            }
                        }
                    }
                });
            });
            describe('> Mantener lo seleccionado manualmente entre páginas', () => {
                beforeEach((done) => {
                    $('#rup-list').off('load');
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    $('.list-item').eq(0).click();
                    $('#rup-list-header-page-next').click();
                });
                it('> En la página siguiente no debe haber seleccionados:', () => {
                    expect($('.rup_list-item-selected').length).toBe(0);
                });
                describe('> Volver a la página anterior', () => {
                    beforeEach((done) => {
                        $('#rup-list').off('load');
                       	$('#rup-list').on('load', () => {
                    		done();
                    	});
                        $('#rup-list-header-page-prev').click();
                    });
                    it('> Debe haber un elemento seleccionado:', () => {
                        expect($('.rup_list-item-selected').length).toBe(1);
                    });
                });
            });

            describe('> Seleccionar con Control', () => {
                describe('> Seleccionar dos elementos', () => {
                    beforeEach(() => {
                        keyPress(17, () => {
                            $('.list-item').eq(0).click();
                            $('.list-item').eq(2).click();
                        });
                    });
                    it('> Los elementos seleccionados deben tener un class .rup_list-item-selected:', () => {
                        expect($('.list-item').eq(0).hasClass('rup_list-item-selected')).toBeTruthy();
                        expect($('.list-item').eq(1).hasClass('rup_list-item-selected')).toBeFalse();
                        expect($('.list-item').eq(2).hasClass('rup_list-item-selected')).toBeTruthy();
                        expect($('.list-item').eq(3).hasClass('rup_list-item-selected')).toBeFalse();
                        expect($('.list-item').eq(4).hasClass('rup_list-item-selected')).toBeFalse();
                    });
                });
                describe('> Seleccionar dos elementos en dos paginas', () => {
                    beforeEach((done) => {
                        $('#rup-list').off('load');
                       	$('#rup-list').on('load', () => {
                    		done();
                    	});
                        keyPress(17, () => {
                            $('.list-item').eq(0).click();
                            $('.list-item').eq(2).click();
                        });
                        $('#rup-list-header-page-next').click();

                    });
                    describe('> Seleccionar en la segunda pagina', () => {
                        beforeEach((done) => {
                            keyPress(17, () => {
                                $('.list-item').eq(1).click();
                                $('.list-item').eq(3).click();
                            });
                            setTimeout(done, 200);
                        });
                        it('> En la segunda pagina los elementos seleccionados deben tener el class .rup_list-item-selected:', () => {
                            expect($('.list-item').eq(0).hasClass('rup_list-item-selected')).toBeFalse();
                            expect($('.list-item').eq(1).hasClass('rup_list-item-selected')).toBeTruthy();
                            expect($('.list-item').eq(2).hasClass('rup_list-item-selected')).toBeFalse();
                            expect($('.list-item').eq(3).hasClass('rup_list-item-selected')).toBeTruthy();
                            expect($('.list-item').eq(4).hasClass('rup_list-item-selected')).toBeFalse();
                        });
                        describe('> Al volver a la primera deben mantenerse en el estado selectable', () => {
                            beforeEach((done) => {
                                $('#rup-list').off('load');
                               	$('#rup-list').on('load', () => {
                            		done();
                            	});
                                $('#rup-list-header-page-prev').click();
                            });
                            it('> Los elementos seleccionados deben tener un class .rup_list-item-selected:', () => {
                                expect($('.list-item').eq(0).hasClass('rup_list-item-selected')).toBeTruthy();
                                expect($('.list-item').eq(1).hasClass('rup_list-item-selected')).toBeFalse();
                                expect($('.list-item').eq(2).hasClass('rup_list-item-selected')).toBeTruthy();
                                expect($('.list-item').eq(3).hasClass('rup_list-item-selected')).toBeFalse();
                                expect($('.list-item').eq(4).hasClass('rup_list-item-selected')).toBeFalse();
                            });
                        });
                        describe('> Click sin Control', () => {
                            beforeEach((done) => {
                                keyUp(17, () => {
                                    $('.list-item').eq(0).click();
                                });
                                done();
                            });
                            it('> Ahora solo un elemento debe estar seleccionado:', () => {
                                expect($('.list-item').eq(0).hasClass('rup_list-item-selected')).toBeTruthy();
                                expect($('.list-item').eq(1).hasClass('rup_list-item-selected')).toBeFalse();
                                expect($('.list-item').eq(2).hasClass('rup_list-item-selected')).toBeFalse();
                                expect($('.list-item').eq(3).hasClass('rup_list-item-selected')).toBeFalse();
                                expect($('.list-item').eq(4).hasClass('rup_list-item-selected')).toBeFalse();
                            });
                        });
                    });
                });
            });
            describe('> Seleccionar con Shift', () => {
                beforeEach((done) => {
                	$('#rup-list').off('load');
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    $('#rup-list').rup_list('filter');
                });
                describe('> Seleccionar tres elementos', () => {
                    beforeEach(() => {
                        keyPress(16, () => {
                            $('.list-item').eq(0).click();
                            $('.list-item').eq(2).click();
                        });
                    });
                    it('> Los elementos seleccionados deben tener un class .rup_list-item-selected:', () => {
                        expect($('.list-item').eq(0).hasClass('rup_list-item-selected')).toBeTruthy();
                        expect($('.list-item').eq(1).hasClass('rup_list-item-selected')).toBeTruthy();
                        expect($('.list-item').eq(2).hasClass('rup_list-item-selected')).toBeTruthy();
                        expect($('.list-item').eq(3).hasClass('rup_list-item-selected')).toBeFalse();
                        expect($('.list-item').eq(4).hasClass('rup_list-item-selected')).toBeFalse();
                    });
                });
                describe('> Click sin Shift', () => {
                    beforeEach((done) => {
                    	$('#rup-list').off('load');
                       	$('#rup-list').on('load', () => {
                    		done();
                    	});
                        $('#rup-list').rup_list('filter');
                    });
                    it('> Ahora solo un elemento debe estar seleccionado:', () => {
                        keyUp(16, () => {
                            $('.list-item').eq(1).click();
                        });
                        expect($('.list-item').eq(0).hasClass('rup_list-item-selected')).toBeFalse();
                        expect($('.list-item').eq(1).hasClass('rup_list-item-selected')).toBeTruthy();
                        expect($('.list-item').eq(2).hasClass('rup_list-item-selected')).toBeFalse();
                        expect($('.list-item').eq(3).hasClass('rup_list-item-selected')).toBeFalse();
                        expect($('.list-item').eq(4).hasClass('rup_list-item-selected')).toBeFalse();
                    });
                });
            });
            describe('> Seleccionar con Control + Shift', () => {
                beforeEach((done) => {
                	$('#rup-list').off('load');
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    $('#rup-list').rup_list('filter');
                });
                describe('> Seleccionar dos rangos de los elementos no cercanos', () => {
                    beforeEach(() => {
                        keyPress(17, () => {
                            keyPress(16, () => {
                                $('.list-item').eq(0).click();
                                $('.list-item').eq(1).click();
                                keyUp(16);
                            });
                            keyUp(17);
                        });
                    });
                    it('> Deben tener el class:', () => {
                        expect($('.list-item').eq(0).hasClass('rup_list-item-selected')).toBeTruthy();
                        expect($('.list-item').eq(1).hasClass('rup_list-item-selected')).toBeTruthy();
                        expect($('.list-item').eq(2).hasClass('rup_list-item-selected')).toBeFalse();
                        expect($('.list-item').eq(3).hasClass('rup_list-item-selected')).toBeFalse();
                        expect($('.list-item').eq(4).hasClass('rup_list-item-selected')).toBeFalse();
                    });
                    describe('> Seleccionar el segundo rango', () => {
                        beforeEach(() => {
                            keyPress(17, () => {
                                $('.list-item').eq(3).click();
                                keyPress(16, () => {
                                    $('.list-item').eq(4).click();
                                    keyUp(16);
                                });
                                keyUp(17);
                            });
                        });
                        it('> Deben tener el class:', () => {
                            expect($('.list-item').eq(0).hasClass('rup_list-item-selected')).toBeTruthy();
                            expect($('.list-item').eq(1).hasClass('rup_list-item-selected')).toBeTruthy();
                            expect($('.list-item').eq(2).hasClass('rup_list-item-selected')).toBeFalse();
                            expect($('.list-item').eq(3).hasClass('rup_list-item-selected')).toBeTruthy();
                            expect($('.list-item').eq(4).hasClass('rup_list-item-selected')).toBeTruthy();
                        });
                    });
                });
                describe('> Seleccionar un elemento dentro de un rango y luego seleccionar todo el rango', () => {
                    beforeEach(() => {
                        keyPress(17, () => {
                            $('.list-item').eq(0).click();
                            $('.list-item').eq(1).click();
                            keyUp();
                        });
                    });
                    it('> Los elementos seleccionados deben tener el clase:', () => {
                        expect($('.list-item').eq(0).hasClass('rup_list-item-selected')).toBeTruthy();
                        expect($('.list-item').eq(1).hasClass('rup_list-item-selected')).toBeTruthy();
                        expect($('.list-item').eq(2).hasClass('rup_list-item-selected')).toBeFalse();
                        expect($('.list-item').eq(3).hasClass('rup_list-item-selected')).toBeFalse();
                        expect($('.list-item').eq(4).hasClass('rup_list-item-selected')).toBeFalse();
                    });
                    describe('> Seleccionar todo el rango', () => {
                        beforeEach(() => {
                            keyPress(17, () => {
                                keyPress(16, () => {
                                    $('.list-item').eq(4).click();
                                });
                                keyUp(17);
                            });
                        });
                        it('> Los elementos (todos) seleccionados deben tener el clase:', () => {
                            expect($('.list-item').eq(0).hasClass('rup_list-item-selected')).toBeTruthy();
                            expect($('.list-item').eq(1).hasClass('rup_list-item-selected')).toBeTruthy();
                            expect($('.list-item').eq(2).hasClass('rup_list-item-selected')).toBeTruthy();
                            expect($('.list-item').eq(3).hasClass('rup_list-item-selected')).toBeTruthy();
                            expect($('.list-item').eq(4).hasClass('rup_list-item-selected')).toBeTruthy();
                        });
                    });
                });
            });
        });

        describe('> MultiFilter', () => {
            beforeAll((done) => {
                testutils.loadCss(done);
            });
            beforeEach((done) => {
                listGen.createMultiFilter('rup-list', 'listFilterForm', () => {
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    $('#rup-list').rup_list('filter');
                });
            });
            it('Tiene que aparecer el botón dropdown', () => {
                expect($('#listFilterForm').find('#listFilterAceptar_dropdown').length).toEqual(1);
            });
            describe('> Click al botón dropdown', () => {
                var spyAjax;
                beforeEach(() => {
                   	
                    $('#rup-list').rup_list('filter');
                    $('#listFilterForm').find('#listFilterAceptar_dropdown').click();
                });
                it('Tiene que aparecer el dialog', () => {
                    expect($('#rup-list_dropdownDialog').is(':visible')).toBeTruthy();
                });
                describe('> Cancelar', () => {
                    beforeEach(() => {
                       
                        $('#rup-list').rup_list('filter');
                        $('#rup_dialogCancelar').click();
                    });
                    it('Tiene que desaparecer el dialgo', () => {
                        expect($('#rup-list_dropdownDialog').is(':visible')).toBeFalsy();
                    });
                });
                describe('> Aplicar', () => {
                    beforeEach(() => {
                       	
                        $('#rup-list').rup_list('filter');
                        spyAjax = spyOn($, 'rup_ajax').and.callThrough();
                        $('#rup-list_dropdownDialog').find('a.rup-combobox-toggle').click();
                    });
                    it('Tiene que hacer un ajax', () => {
                        for (let i = 0; i < spyAjax.calls.count(); i++) {
                            if (spyAjax.calls.argsFor(i)[0].url != '/demo/list/filter') {
                                expect(spyAjax.calls.argsFor(i)).toExist();
                            }
                        }
                    });
                    it('Filter por dereco', () => {
                        expect($('#listFilterForm').find('input').eq(2).val()).toEqual('20');
                    });
                    describe('Eligir un filtro', () => {
                        beforeEach(() => {
                           
                            $('#rup-list').rup_list('filter');
                            $('#rup-list_dropdownDialog_combo_label').rup_autocomplete('set', 'Filter 1', 'Filter 1');
                            $('#rup-list_dropdownDialog_btn_apply').click();
                        });
                        it('El filtro elegido tiene que aparecer en autocomlete', () => {
                            expect($('#rup-list_dropdownDialog_combo_label').val()).toEqual('Filter 1');
                        });
                    });
                });
                describe('> Guardar', () => {
                    beforeEach((done) => {
                    	$('#rup-list').off('load');
                       	$('#rup-list').on('load', () => {
                    		done();
                    	});
                        $('#rup-list').rup_list('filter');
                        $('#listFilterForm').find('input').val('');
                        $('#listFilterForm').find('input').eq(2).val('20');
                        $('#rup-list_dropdownDialog_combo_label').val('TestFilter');
                        $('#rup-list_dropdownDialog_btn_save').click();
                    });
                    it('Tiene que aparecer el feedback', () => {
                        expect($('#rup-list_dropdownDialog_feedback').is(':visible')).toBeTruthy();
                    });
                });
            });
        });

        describe('> Loader configurable', () => {
            var spyLoader;
            beforeAll((done) => {
                testutils.loadCss(done);
            });
            beforeEach((done) => {
                listGen.createLoader('rup-list', 'listFilterForm', () => {
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    $('#rup-list').rup_list('filter');
                });
            });
            describe('> Pasamos a la pagina siguiente para que aparezca el loader', () => {
                beforeEach((done) => {
                	$('#rup-list').off('load');
                   	$('#rup-list').on('load', () => {
                		done();
                	});
                    $('#rup-list').rup_list('filter');
                    spyLoader = spyOn($.fn, 'prepend').and.callThrough();
                    $('#rup-list-header-page-next').click();
                });
                it('Loader debe tener el contenido diferente', () => {
                    for (let i = 0; i < spyLoader.calls.count(); i++) {
                        if ($(spyLoader.calls.argsFor(i)[0]).hasClass('rup_list-overlay')) {
                            expect($(spyLoader.calls.argsFor(i)[0])[0].innerText).toEqual('loading...');
                        }
                    }
                });
            });
        });
    });
    
    a11y.describes();
});