license import { table } from './table' ; function getRowHTML ( row ) { return Array . from ( row . querySelectorAll ( 'td' ) ) . map ( r => r . innerHTML ) ; } function getRowText ( row ) { return Array . from ( row . querySelectorAll ( 'td' ) ) . map ( r => r . textContent ) ; } describe ( 'renderTable' , ( ) => { beforeEach ( ( ) => { document . body . innerHTML = '<div id="container"></div>' ; } ) ; it ( 'renders a table' , ( ) => { const headers = [ 'Col1' , 'Col 2' , '<em>Column 3</em>' , ] ; const values = [ [ 1 , 2 , 3 ] , [ '4' , '5' , '6' ] , [ '<strong>7</strong>' , true , false ] , ] ; const container = document . getElementById ( 'container' ) as HTMLElement ; table ( container , { headers , values } ) ; expect ( document . querySelectorAll ( '.tf-table' ) . length ) . toBe ( 1 ) ; expect ( document . querySelectorAll ( '.tf-table thead tr' ) . length ) . toBe ( 1 ) ; const headerEl = document . querySelectorAll ( '.tf-table thead tr th' ) ; expect ( headerEl [ 0 ] . innerHTML ) . toEqual ( 'Col1' ) ; expect ( headerEl [ 1 ] . innerHTML ) . toEqual ( 'Col 2' ) ; expect ( headerEl [ 2 ] . innerHTML ) . toEqual ( '<em>Column 3</em>' ) ; expect ( headerEl [ 2 ] . textContent ) . toEqual ( 'Column 3' ) ; expect ( document . querySelectorAll ( '.tf-table tbody tr' ) . length ) . toBe ( 3 ) ; const rows = document . querySelectorAll ( '.tf-table tbody tr' ) ; expect ( getRowHTML ( rows [ 0 ] ) ) . toEqual ( [ '1' , '2' , '3' ] ) ; expect ( getRowHTML ( rows [ 1 ] ) ) . toEqual ( [ '4' , '5' , '6' ] ) ; expect ( getRowHTML ( rows [ 2 ] ) ) . toEqual ( [ '<strong>7</strong>' , 'true' , 'false' ] ) ; expect ( getRowText ( rows [ 2 ] ) ) . toEqual ( [ '7' , 'true' , 'false' ] ) ; } ) ; it ( 'requires necessary param' , ( ) => { const container = document . getElementById ( 'container' ) as HTMLElement ; expect ( ( ) => table ( { headers : [ ] } , container ) ) . toThrow ( ) ; expect ( ( ) => table ( { values : [ [ ] ] } , container ) ) . toThrow ( ) ; expect ( ( ) => table ( { } , container ) ) . toThrow ( ) ; } ) ; it ( 'should not throw on empty table' , ( ) => { const container = document . getElementById ( 'container' ) as HTMLElement ; const headers = [ ] ; const values = [ ] ; expect ( ( ) => table ( container , { headers , values } ) ) . not . toThrow ( ) ; expect ( document . querySelectorAll ( '.tf-table' ) . length ) . toBe ( 1 ) ; expect ( document . querySelectorAll ( '.tf-table thead tr' ) . length ) . toBe ( 1 ) ; expect ( document . querySelectorAll ( '.tf-table tbody tr' ) . length ) . toBe ( 0 ) ; } ) ; } ) ;