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