github.com/aminovpavel/nomad@v0.11.8/ui/tests/integration/toggle-test.js (about)

     1  import { find, settled } from '@ember/test-helpers';
     2  import { module, test } from 'qunit';
     3  import { setupRenderingTest } from 'ember-qunit';
     4  import hbs from 'htmlbars-inline-precompile';
     5  import sinon from 'sinon';
     6  import { create } from 'ember-cli-page-object';
     7  import togglePageObject from 'nomad-ui/tests/pages/components/toggle';
     8  
     9  const Toggle = create(togglePageObject());
    10  
    11  module('Integration | Component | toggle', function(hooks) {
    12    setupRenderingTest(hooks);
    13  
    14    const commonProperties = () => ({
    15      isActive: false,
    16      isDisabled: false,
    17      label: 'Label',
    18      onToggle: sinon.spy(),
    19    });
    20  
    21    const commonTemplate = hbs`
    22      {{#toggle
    23        isActive=isActive
    24        isDisabled=isDisabled
    25        onToggle=onToggle}}
    26        {{label}}
    27      {{/toggle}}
    28    `;
    29  
    30    test('presents as a label with an inner checkbox and display span, and text', async function(assert) {
    31      const props = commonProperties();
    32      this.setProperties(props);
    33      await this.render(commonTemplate);
    34  
    35      assert.equal(Toggle.label, props.label, `Label should be ${props.label}`);
    36      assert.ok(Toggle.isPresent);
    37      assert.notOk(Toggle.isActive);
    38      assert.ok(find('[data-test-toggler]'));
    39      assert.equal(
    40        find('[data-test-input]').tagName.toLowerCase(),
    41        'input',
    42        'The input is a real HTML input'
    43      );
    44      assert.equal(
    45        find('[data-test-input]').getAttribute('type'),
    46        'checkbox',
    47        'The input type is checkbox'
    48      );
    49    });
    50  
    51    test('the isActive property dictates the active state and class', async function(assert) {
    52      const props = commonProperties();
    53      this.setProperties(props);
    54      await this.render(commonTemplate);
    55  
    56      assert.notOk(Toggle.isActive);
    57      assert.notOk(Toggle.hasActiveClass);
    58  
    59      this.set('isActive', true);
    60      await settled();
    61  
    62      assert.ok(Toggle.isActive);
    63      assert.ok(Toggle.hasActiveClass);
    64    });
    65  
    66    test('the isDisabled property dictates the disabled state and class', async function(assert) {
    67      const props = commonProperties();
    68      this.setProperties(props);
    69      await this.render(commonTemplate);
    70  
    71      assert.notOk(Toggle.isDisabled);
    72      assert.notOk(Toggle.hasDisabledClass);
    73  
    74      this.set('isDisabled', true);
    75      await settled();
    76  
    77      assert.ok(Toggle.isDisabled);
    78      assert.ok(Toggle.hasDisabledClass);
    79    });
    80  
    81    test('toggling the input calls the onToggle action', async function(assert) {
    82      const props = commonProperties();
    83      this.setProperties(props);
    84      await this.render(commonTemplate);
    85  
    86      await Toggle.toggle();
    87      assert.equal(props.onToggle.callCount, 1);
    88    });
    89  });