github.com/Ilhicas/nomad@v1.0.4-0.20210304152020-e86851182bc3/ui/tests/integration/components/job-page/parts/children-test.js (about)

     1  import { assign } from '@ember/polyfills';
     2  import hbs from 'htmlbars-inline-precompile';
     3  import { findAll, find, click, render } from '@ember/test-helpers';
     4  import sinon from 'sinon';
     5  import { module, test } from 'qunit';
     6  import { setupRenderingTest } from 'ember-qunit';
     7  import { startMirage } from 'nomad-ui/initializers/ember-cli-mirage';
     8  import { componentA11yAudit } from 'nomad-ui/tests/helpers/a11y-audit';
     9  
    10  module('Integration | Component | job-page/parts/children', function(hooks) {
    11    setupRenderingTest(hooks);
    12  
    13    hooks.beforeEach(function() {
    14      window.localStorage.clear();
    15      this.store = this.owner.lookup('service:store');
    16      this.server = startMirage();
    17      this.server.create('namespace');
    18    });
    19  
    20    hooks.afterEach(function() {
    21      this.server.shutdown();
    22      window.localStorage.clear();
    23    });
    24  
    25    const props = (job, options = {}) =>
    26      assign(
    27        {
    28          job,
    29          sortProperty: 'name',
    30          sortDescending: true,
    31          currentPage: 1,
    32          gotoJob: () => {},
    33        },
    34        options
    35      );
    36  
    37    test('lists each child', async function(assert) {
    38      this.server.create('job', 'periodic', {
    39        id: 'parent',
    40        childrenCount: 3,
    41        createAllocations: false,
    42      });
    43  
    44      await this.store.findAll('job');
    45  
    46      const parent = this.store.peekAll('job').findBy('plainId', 'parent');
    47  
    48      this.setProperties(props(parent));
    49  
    50      await render(hbs`
    51        <JobPage::Parts::Children
    52          @job={{job}}
    53          @sortProperty={{sortProperty}}
    54          @sortDescending={{sortDescending}}
    55          @currentPage={{currentPage}}
    56          @gotoJob={{gotoJob}} />
    57      `);
    58  
    59      assert.equal(
    60        findAll('[data-test-job-name]').length,
    61        parent.get('children.length'),
    62        'A row for each child'
    63      );
    64    });
    65  
    66    test('eventually paginates', async function(assert) {
    67      const pageSize = 10;
    68      window.localStorage.nomadPageSize = pageSize;
    69  
    70      this.server.create('job', 'periodic', {
    71        id: 'parent',
    72        childrenCount: 11,
    73        createAllocations: false,
    74      });
    75  
    76      await this.store.findAll('job');
    77  
    78      const parent = this.store.peekAll('job').findBy('plainId', 'parent');
    79  
    80      this.setProperties(props(parent));
    81  
    82      await render(hbs`
    83        <JobPage::Parts::Children
    84          @job={{job}}
    85          @sortProperty={{sortProperty}}
    86          @sortDescending={{sortDescending}}
    87          @currentPage={{currentPage}}
    88          @gotoJob={{gotoJob}} />
    89      `);
    90  
    91      const childrenCount = parent.get('children.length');
    92      assert.ok(childrenCount > pageSize, 'Parent has more children than one page size');
    93      assert.equal(findAll('[data-test-job-name]').length, pageSize, 'Table length maxes out at 10');
    94      assert.ok(find('.pagination-next'), 'Next button is rendered');
    95  
    96      assert.ok(
    97        new RegExp(`1.10.+?${childrenCount}`).test(find('.pagination-numbers').textContent.trim())
    98      );
    99  
   100      await componentA11yAudit(this.element, assert);
   101    });
   102  
   103    test('is sorted based on the sortProperty and sortDescending properties', async function(assert) {
   104      this.server.create('job', 'periodic', {
   105        id: 'parent',
   106        childrenCount: 3,
   107        createAllocations: false,
   108      });
   109  
   110      await this.store.findAll('job');
   111  
   112      const parent = this.store.peekAll('job').findBy('plainId', 'parent');
   113  
   114      this.setProperties(props(parent));
   115  
   116      await render(hbs`
   117        <JobPage::Parts::Children
   118          @job={{job}}
   119          @sortProperty={{sortProperty}}
   120          @sortDescending={{sortDescending}}
   121          @currentPage={{currentPage}}
   122          @gotoJob={{gotoJob}} />
   123      `);
   124  
   125      const sortedChildren = parent.get('children').sortBy('name');
   126      const childRows = findAll('[data-test-job-name]');
   127  
   128      sortedChildren.reverse().forEach((child, index) => {
   129        assert.equal(
   130          childRows[index].textContent.trim(),
   131          child.get('name'),
   132          `Child ${index} is ${child.get('name')}`
   133        );
   134      });
   135  
   136      await this.set('sortDescending', false);
   137  
   138      sortedChildren.forEach((child, index) => {
   139        assert.equal(
   140          childRows[index].textContent.trim(),
   141          child.get('name'),
   142          `Child ${index} is ${child.get('name')}`
   143        );
   144      });
   145    });
   146  
   147    test('gotoJob is called when a job row is clicked', async function(assert) {
   148      const gotoJobSpy = sinon.spy();
   149  
   150      this.server.create('job', 'periodic', {
   151        id: 'parent',
   152        childrenCount: 1,
   153        createAllocations: false,
   154      });
   155  
   156      await this.store.findAll('job');
   157  
   158      const parent = this.store.peekAll('job').findBy('plainId', 'parent');
   159  
   160      this.setProperties(
   161        props(parent, {
   162          gotoJob: gotoJobSpy,
   163        })
   164      );
   165  
   166      await render(hbs`
   167        <JobPage::Parts::Children
   168          @job={{job}}
   169          @sortProperty={{sortProperty}}
   170          @sortDescending={{sortDescending}}
   171          @currentPage={{currentPage}}
   172          @gotoJob={{gotoJob}} />
   173      `);
   174  
   175      await click('tr.job-row');
   176  
   177      assert.ok(
   178        gotoJobSpy.withArgs(parent.get('children.firstObject')).calledOnce,
   179        'Clicking the job row calls the gotoJob action'
   180      );
   181    });
   182  });