github.com/anuvu/nomad@v0.8.7-atom1/ui/tests/integration/job-page/parts/body-test.js (about)

     1  import { run } from '@ember/runloop';
     2  import { getOwner } from '@ember/application';
     3  import { test, moduleForComponent } from 'ember-qunit';
     4  import { click, find, findAll } from 'ember-native-dom-helpers';
     5  import wait from 'ember-test-helpers/wait';
     6  import hbs from 'htmlbars-inline-precompile';
     7  import sinon from 'sinon';
     8  import { clickTrigger } from 'ember-power-select/test-support/helpers';
     9  import { startMirage } from 'nomad-ui/initializers/ember-cli-mirage';
    10  
    11  moduleForComponent('job-page/parts/body', 'Integration | Component | job-page/parts/body', {
    12    integration: true,
    13    beforeEach() {
    14      window.localStorage.clear();
    15      this.server = startMirage();
    16      this.server.createList('namespace', 3);
    17    },
    18    afterEach() {
    19      this.server.shutdown();
    20      window.localStorage.clear();
    21    },
    22  });
    23  
    24  test('includes a subnav for the job', function(assert) {
    25    this.set('job', {});
    26    this.set('onNamespaceChange', () => {});
    27  
    28    this.render(hbs`
    29      {{#job-page/parts/body job=job onNamespaceChange=onNamespaceChange}}
    30        <div class="inner-content">Inner content</div>
    31      {{/job-page/parts/body}}
    32    `);
    33  
    34    return wait().then(() => {
    35      assert.ok(find('[data-test-subnav="job"]'), 'Job subnav is rendered');
    36    });
    37  });
    38  
    39  test('the subnav includes the deployments link when the job is a service', function(assert) {
    40    const store = getOwner(this).lookup('service:store');
    41    let job;
    42  
    43    run(() => {
    44      job = store.createRecord('job', {
    45        id: 'service-job',
    46        type: 'service',
    47      });
    48    });
    49  
    50    this.set('job', job);
    51    this.set('onNamespaceChange', () => {});
    52  
    53    this.render(hbs`
    54      {{#job-page/parts/body job=job onNamespaceChange=onNamespaceChange}}
    55        <div class="inner-content">Inner content</div>
    56      {{/job-page/parts/body}}
    57    `);
    58  
    59    return wait().then(() => {
    60      const subnavLabels = findAll('[data-test-tab]').map(anchor => anchor.textContent);
    61      assert.ok(subnavLabels.some(label => label === 'Definition'), 'Definition link');
    62      assert.ok(subnavLabels.some(label => label === 'Versions'), 'Versions link');
    63      assert.ok(subnavLabels.some(label => label === 'Deployments'), 'Deployments link');
    64    });
    65  });
    66  
    67  test('the subnav does not include the deployments link when the job is not a service', function(assert) {
    68    const store = getOwner(this).lookup('service:store');
    69    let job;
    70  
    71    run(() => {
    72      job = store.createRecord('job', {
    73        id: 'batch-job',
    74        type: 'batch',
    75      });
    76    });
    77  
    78    this.set('job', job);
    79    this.set('onNamespaceChange', () => {});
    80  
    81    this.render(hbs`
    82      {{#job-page/parts/body job=job onNamespaceChange=onNamespaceChange}}
    83        <div class="inner-content">Inner content</div>
    84      {{/job-page/parts/body}}
    85    `);
    86  
    87    return wait().then(() => {
    88      const subnavLabels = findAll('[data-test-tab]').map(anchor => anchor.textContent);
    89      assert.ok(subnavLabels.some(label => label === 'Definition'), 'Definition link');
    90      assert.ok(subnavLabels.some(label => label === 'Versions'), 'Versions link');
    91      assert.notOk(subnavLabels.some(label => label === 'Deployments'), 'Deployments link');
    92    });
    93  });
    94  
    95  test('body yields content to a section after the subnav', function(assert) {
    96    this.set('job', {});
    97    this.set('onNamespaceChange', () => {});
    98  
    99    this.render(hbs`
   100      {{#job-page/parts/body job=job onNamespaceChange=onNamespaceChange}}
   101        <div class="inner-content">Inner content</div>
   102      {{/job-page/parts/body}}
   103    `);
   104  
   105    return wait().then(() => {
   106      assert.ok(
   107        find('[data-test-page-content] .section > .inner-content'),
   108        'Content is rendered in a section in a gutter menu'
   109      );
   110      assert.ok(
   111        find('[data-test-subnav="job"] + .section > .inner-content'),
   112        'Content is rendered immediately after the subnav'
   113      );
   114    });
   115  });
   116  
   117  test('onNamespaceChange action is called when the namespace changes in the nested gutter menu', function(assert) {
   118    const namespaceSpy = sinon.spy();
   119  
   120    this.set('job', {});
   121    this.set('onNamespaceChange', namespaceSpy);
   122  
   123    this.render(hbs`
   124      {{#job-page/parts/body job=job onNamespaceChange=onNamespaceChange}}
   125        <div class="inner-content">Inner content</div>
   126      {{/job-page/parts/body}}
   127    `);
   128  
   129    return wait().then(() => {
   130      clickTrigger('[data-test-namespace-switcher]');
   131      click(findAll('.ember-power-select-option')[1]);
   132  
   133      return wait().then(() => {
   134        assert.ok(namespaceSpy.calledOnce, 'Switching namespaces calls the onNamespaceChange action');
   135      });
   136    });
   137  });