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  });