github.com/anth0d/nomad@v0.0.0-20221214183521-ae3a0a2cad06/ui/tests/integration/components/job-page/parts/body-test.js (about) 1 import { module, test } from 'qunit'; 2 import { setupRenderingTest } from 'ember-qunit'; 3 import { find, findAll, render } from '@ember/test-helpers'; 4 import hbs from 'htmlbars-inline-precompile'; 5 import { startMirage } from 'nomad-ui/initializers/ember-cli-mirage'; 6 import { componentA11yAudit } from 'nomad-ui/tests/helpers/a11y-audit'; 7 8 module('Integration | Component | job-page/parts/body', function (hooks) { 9 setupRenderingTest(hooks); 10 11 hooks.beforeEach(function () { 12 window.localStorage.clear(); 13 this.server = startMirage(); 14 this.server.createList('namespace', 3); 15 }); 16 17 hooks.afterEach(function () { 18 this.server.shutdown(); 19 window.localStorage.clear(); 20 }); 21 22 test('includes a subnav for the job', async function (assert) { 23 this.set('job', {}); 24 25 await render(hbs` 26 <JobPage::Parts::Body @job={{job}}> 27 <div class="inner-content">Inner content</div> 28 </JobPage::Parts::Body> 29 `); 30 assert.ok(find('[data-test-subnav="job"]'), 'Job subnav is rendered'); 31 }); 32 33 test('the subnav includes the deployments link when the job is a service', async function (assert) { 34 assert.expect(4); 35 36 const store = this.owner.lookup('service:store'); 37 const job = await store.createRecord('job', { 38 id: '["service-job","default"]', 39 type: 'service', 40 }); 41 42 this.set('job', job); 43 44 await render(hbs` 45 <JobPage::Parts::Body @job={{job}}> 46 <div class="inner-content">Inner content</div> 47 </JobPage::Parts::Body> 48 `); 49 50 const subnavLabels = findAll('[data-test-tab]').map((anchor) => 51 anchor.textContent.trim() 52 ); 53 assert.ok( 54 subnavLabels.some((label) => label === 'Definition'), 55 'Definition link' 56 ); 57 assert.ok( 58 subnavLabels.some((label) => label === 'Versions'), 59 'Versions link' 60 ); 61 62 assert.ok( 63 subnavLabels.some((label) => label === 'Deployments'), 64 'Deployments link' 65 ); 66 67 await componentA11yAudit(this.element, assert); 68 }); 69 70 test('the subnav does not include the deployments link when the job is not a service', async function (assert) { 71 const store = this.owner.lookup('service:store'); 72 const job = await store.createRecord('job', { 73 id: '["batch-job","default"]', 74 type: 'batch', 75 }); 76 77 this.set('job', job); 78 79 await render(hbs` 80 <JobPage::Parts::Body @job={{job}}> 81 <div class="inner-content">Inner content</div> 82 </JobPage::Parts::Body> 83 `); 84 85 const subnavLabels = findAll('[data-test-tab]').map((anchor) => 86 anchor.textContent.trim() 87 ); 88 assert.ok( 89 subnavLabels.some((label) => label === 'Definition'), 90 'Definition link' 91 ); 92 assert.ok( 93 subnavLabels.some((label) => label === 'Versions'), 94 'Versions link' 95 ); 96 assert.notOk( 97 subnavLabels.some((label) => label === 'Deployments'), 98 'Deployments link' 99 ); 100 }); 101 102 test('body yields content to a section after the subnav', async function (assert) { 103 this.set('job', {}); 104 105 await render(hbs` 106 <JobPage::Parts::Body @job={{job}}> 107 <div class="inner-content">Inner content</div> 108 </JobPage::Parts::Body> 109 `); 110 111 assert.ok( 112 find('[data-test-subnav="job"] + .section > .inner-content'), 113 'Content is rendered immediately after the subnav' 114 ); 115 }); 116 });