github.com/anth0d/nomad@v0.0.0-20221214183521-ae3a0a2cad06/ui/tests/integration/components/breadcrumbs-test.js (about) 1 /* eslint-disable ember-a11y-testing/a11y-audit-called */ 2 import { module, test } from 'qunit'; 3 import { setupRenderingTest } from 'ember-qunit'; 4 import { click, findAll, render } from '@ember/test-helpers'; 5 import { hbs } from 'ember-cli-htmlbars'; 6 7 module('Integration | Component | breadcrumbs', function (hooks) { 8 setupRenderingTest(hooks); 9 10 test('it declaratively renders a list of registered crumbs', async function (assert) { 11 this.set('isRegistered', false); 12 this.set('toggleCrumb', () => this.set('isRegistered', !this.isRegistered)); 13 await render(hbs` 14 <Breadcrumbs as |bb|> 15 <ul> 16 {{#each bb as |crumb|}} 17 <li data-test-crumb={{crumb.args.crumb}}>{{crumb.args.crumb}}</li> 18 {{/each}} 19 </ul> 20 </Breadcrumbs> 21 <button data-test-button type="button" {{on "click" toggleCrumb}}>Toggle</button> 22 <Breadcrumb @crumb={{'Zoey'}} /> 23 {{#if this.isRegistered}} 24 <Breadcrumb @crumb={{'Tomster'}} /> 25 {{/if}} 26 `); 27 28 assert 29 .dom('[data-test-crumb]') 30 .exists({ count: 1 }, 'We register one crumb'); 31 assert 32 .dom('[data-test-crumb]') 33 .hasText('Zoey', 'The first registered crumb is Zoey'); 34 35 await click('[data-test-button]'); 36 const crumbs = await findAll('[data-test-crumb]'); 37 38 assert 39 .dom('[data-test-crumb]') 40 .exists({ count: 2 }, 'The second crumb registered successfully'); 41 assert 42 .dom(crumbs[0]) 43 .hasText( 44 'Zoey', 45 'Breadcrumbs maintain the order in which they are declared' 46 ); 47 assert 48 .dom(crumbs[1]) 49 .hasText( 50 'Tomster', 51 'Breadcrumbs maintain the order in which they are declared' 52 ); 53 54 await click('[data-test-button]'); 55 assert 56 .dom('[data-test-crumb]') 57 .exists({ count: 1 }, 'We deregister one crumb'); 58 assert 59 .dom('[data-test-crumb]') 60 .hasText( 61 'Zoey', 62 'Zoey remains in the template after Tomster deregisters' 63 ); 64 }); 65 66 test('it can register complex crumb objects', async function (assert) { 67 await render(hbs` 68 <Breadcrumbs as |bb|> 69 <ul> 70 {{#each bb as |crumb|}} 71 <li data-test-crumb>{{crumb.args.crumb.name}}</li> 72 {{/each}} 73 </ul> 74 </Breadcrumbs> 75 <Breadcrumb @crumb={{hash name='Tomster'}} /> 76 `); 77 78 assert 79 .dom('[data-test-crumb]') 80 .hasText( 81 'Tomster', 82 'We can access the registered breadcrumbs in the template' 83 ); 84 }); 85 });