github.com/blixtra/nomad@v0.7.2-0.20171221000451-da9a1d7bb050/ui/tests/integration/attributes-table-test.js (about) 1 import { findAll } from 'ember-native-dom-helpers'; 2 import { test, moduleForComponent } from 'ember-qunit'; 3 import hbs from 'htmlbars-inline-precompile'; 4 import flat from 'npm:flat'; 5 6 const { flatten } = flat; 7 8 moduleForComponent('attributes-table', 'Integration | Component | attributes table', { 9 integration: true, 10 }); 11 12 const commonAttributes = { 13 key: 'value', 14 nested: { 15 props: 'are', 16 supported: 'just', 17 fine: null, 18 }, 19 so: { 20 are: { 21 deeply: { 22 nested: 'properties', 23 like: 'these ones', 24 }, 25 }, 26 }, 27 }; 28 29 test('should render a row for each key/value pair in a deep object', function(assert) { 30 this.set('attributes', commonAttributes); 31 this.render(hbs`{{attributes-table attributes=attributes}}`); 32 33 const rowsCount = Object.keys(flatten(commonAttributes)).length; 34 assert.equal( 35 this.$('tbody tr').has('td:eq(1)').length, 36 rowsCount, 37 `Table has ${rowsCount} rows with values` 38 ); 39 }); 40 41 test('should render the full path of key/value pair from the root of the object', function(assert) { 42 this.set('attributes', commonAttributes); 43 this.render(hbs`{{attributes-table attributes=attributes}}`); 44 45 assert.equal( 46 this.$('tbody tr:eq(0) td') 47 .get(0) 48 .textContent.trim(), 49 'key', 50 'Simple row renders only the key' 51 ); 52 assert.equal( 53 this.$('tbody tr:eq(0) td') 54 .get(1) 55 .textContent.trim(), 56 'value' 57 ); 58 59 assert.equal( 60 this.$('tbody tr:eq(8) td') 61 .get(0) 62 .textContent.trim(), 63 'so.are.deeply.nested', 64 'Complex row renders the full path to the key' 65 ); 66 assert.equal( 67 this.$('tbody tr:eq(8) td:eq(0) .is-faded') 68 .get(0) 69 .textContent.trim(), 70 'so.are.deeply.', 71 'The prefix is faded to put emphasis on the attribute' 72 ); 73 assert.equal( 74 this.$('tbody tr:eq(8) td') 75 .get(1) 76 .textContent.trim(), 77 'properties' 78 ); 79 }); 80 81 test('should render a row for key/value pairs even when the value is another object', function( 82 assert 83 ) { 84 this.set('attributes', commonAttributes); 85 this.render(hbs`{{attributes-table attributes=attributes}}`); 86 87 const countOfParentRows = countOfParentKeys(commonAttributes); 88 assert.equal( 89 findAll('tbody tr td[colspan="2"]').length, 90 countOfParentRows, 91 'Each key for a nested object gets a row with no value' 92 ); 93 }); 94 95 function countOfParentKeys(obj) { 96 return Object.keys(obj).reduce((count, key) => { 97 const value = obj[key]; 98 return isObject(value) ? count + 1 + countOfParentKeys(value) : count; 99 }, 0); 100 } 101 102 function isObject(value) { 103 return !Array.isArray(value) && value != null && typeof value === 'object'; 104 }