github.com/anth0d/nomad@v0.0.0-20221214183521-ae3a0a2cad06/ui/tests/integration/components/job-diff-test.js (about) 1 import { findAll, find, render } from '@ember/test-helpers'; 2 import { module, test } from 'qunit'; 3 import { setupRenderingTest } from 'ember-qunit'; 4 import hbs from 'htmlbars-inline-precompile'; 5 import cleanWhitespace from '../../utils/clean-whitespace'; 6 import { componentA11yAudit } from 'nomad-ui/tests/helpers/a11y-audit'; 7 8 module('Integration | Component | job diff', function (hooks) { 9 setupRenderingTest(hooks); 10 11 const commonTemplate = hbs` 12 <div class="boxed-section"> 13 <div class="boxed-section-body is-dark"> 14 <JobDiff @diff={{diff}} /> 15 </div> 16 </div> 17 `; 18 19 test('job field diffs', async function (assert) { 20 assert.expect(5); 21 22 this.set('diff', { 23 ID: 'test-case-1', 24 Type: 'Edited', 25 Objects: null, 26 Fields: [ 27 field('Removed Field', 'deleted', 12), 28 field('Added Field', 'added', 'Foobar'), 29 field('Edited Field', 'edited', 512, 256), 30 ], 31 }); 32 33 await render(commonTemplate); 34 35 assert.equal( 36 findAll('[data-test-diff-section-label]').length, 37 5, 38 'A section label for each line, plus one for the group' 39 ); 40 assert.equal( 41 cleanWhitespace( 42 find( 43 '[data-test-diff-section-label="field"][data-test-diff-field="added"]' 44 ).textContent 45 ), 46 '+ Added Field: "Foobar"', 47 'Added field is rendered correctly' 48 ); 49 assert.equal( 50 cleanWhitespace( 51 find( 52 '[data-test-diff-section-label="field"][data-test-diff-field="edited"]' 53 ).textContent 54 ), 55 '+/- Edited Field: "256" => "512"', 56 'Edited field is rendered correctly' 57 ); 58 assert.equal( 59 cleanWhitespace( 60 find( 61 '[data-test-diff-section-label="field"][data-test-diff-field="deleted"]' 62 ).textContent 63 ), 64 '- Removed Field: "12"', 65 'Removed field is rendered correctly' 66 ); 67 68 await componentA11yAudit(this.element, assert); 69 }); 70 71 test('job object diffs', async function (assert) { 72 assert.expect(9); 73 74 this.set('diff', { 75 ID: 'test-case-2', 76 Type: 'Edited', 77 Objects: [ 78 { 79 Name: 'ComplexProperty', 80 Type: 'Edited', 81 Objects: null, 82 Fields: [ 83 field('Prop 1', 'added', 'prop-1-value'), 84 field('Prop 2', 'none', 'prop-2-is-the-same'), 85 field('Prop 3', 'edited', 'new value', 'some old value'), 86 field('Prop 4', 'deleted', 'delete me'), 87 ], 88 }, 89 { 90 Name: 'DeepConfiguration', 91 Type: 'Added', 92 Objects: [ 93 { 94 Name: 'VP Props', 95 Type: 'Added', 96 Objects: null, 97 Fields: [ 98 field('Engineering', 'added', 'Regina Phalange'), 99 field('Customer Support', 'added', 'Jerome Hendricks'), 100 field('HR', 'added', 'Jack Blue'), 101 field('Sales', 'added', 'Maria Lopez'), 102 ], 103 }, 104 ], 105 Fields: [field('Executive Prop', 'added', 'in charge')], 106 }, 107 { 108 Name: 'DatedStuff', 109 Type: 'Deleted', 110 Objects: null, 111 Fields: [field('Deprecated', 'deleted', 'useless')], 112 }, 113 ], 114 Fields: null, 115 }); 116 117 await render(commonTemplate); 118 119 assert.ok( 120 cleanWhitespace( 121 find( 122 '[data-test-diff-section-label="object"][data-test-diff-field="added"]' 123 ).textContent 124 ).startsWith('+ DeepConfiguration {'), 125 'Added object starts with a JSON block' 126 ); 127 assert.ok( 128 cleanWhitespace( 129 find( 130 '[data-test-diff-section-label="object"][data-test-diff-field="edited"]' 131 ).textContent 132 ).startsWith('+/- ComplexProperty {'), 133 'Edited object starts with a JSON block' 134 ); 135 assert.ok( 136 cleanWhitespace( 137 find( 138 '[data-test-diff-section-label="object"][data-test-diff-field="deleted"]' 139 ).textContent 140 ).startsWith('- DatedStuff {'), 141 'Removed object starts with a JSON block' 142 ); 143 144 assert.ok( 145 cleanWhitespace( 146 find( 147 '[data-test-diff-section-label="object"][data-test-diff-field="added"]' 148 ).textContent 149 ).endsWith('}'), 150 'Added object ends the JSON block' 151 ); 152 assert.ok( 153 cleanWhitespace( 154 find( 155 '[data-test-diff-section-label="object"][data-test-diff-field="edited"]' 156 ).textContent 157 ).endsWith('}'), 158 'Edited object starts with a JSON block' 159 ); 160 assert.ok( 161 cleanWhitespace( 162 find( 163 '[data-test-diff-section-label="object"][data-test-diff-field="deleted"]' 164 ).textContent 165 ).endsWith('}'), 166 'Removed object ends the JSON block' 167 ); 168 169 assert.equal( 170 findAll( 171 '[data-test-diff-section-label="object"][data-test-diff-field="added"] > [data-test-diff-section-label]' 172 ).length, 173 this.diff.Objects[1].Objects.length + this.diff.Objects[1].Fields.length, 174 'Edited block contains each nested field and object' 175 ); 176 177 assert.equal( 178 findAll( 179 '[data-test-diff-section-label="object"][data-test-diff-field="added"] [data-test-diff-section-label="object"] [data-test-diff-section-label="field"]' 180 ).length, 181 this.diff.Objects[1].Objects[0].Fields.length, 182 'Objects within objects are rendered' 183 ); 184 185 await componentA11yAudit(this.element, assert); 186 }); 187 188 function field(name, type, newVal, oldVal) { 189 switch (type) { 190 case 'added': 191 return { 192 Annotations: null, 193 New: newVal, 194 Old: '', 195 Type: 'Added', 196 Name: name, 197 }; 198 case 'deleted': 199 return { 200 Annotations: null, 201 New: '', 202 Old: newVal, 203 Type: 'Deleted', 204 Name: name, 205 }; 206 case 'edited': 207 return { 208 Annotations: null, 209 New: newVal, 210 Old: oldVal, 211 Type: 'Edited', 212 Name: name, 213 }; 214 } 215 return { 216 Annotations: null, 217 New: newVal, 218 Old: oldVal, 219 Type: 'None', 220 Name: name, 221 }; 222 } 223 });