github.com/Ilhicas/nomad@v1.0.4-0.20210304152020-e86851182bc3/ui/tests/integration/components/gauge-chart-test.js (about)

     1  import { find, render } 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 { componentA11yAudit } from 'nomad-ui/tests/helpers/a11y-audit';
     6  import { create } from 'ember-cli-page-object';
     7  import gaugeChart from 'nomad-ui/tests/pages/components/gauge-chart';
     8  
     9  const GaugeChart = create(gaugeChart());
    10  
    11  module('Integration | Component | gauge chart', function(hooks) {
    12    setupRenderingTest(hooks);
    13  
    14    const commonProperties = () => ({
    15      value: 5,
    16      total: 10,
    17      label: 'Gauge',
    18    });
    19  
    20    test('presents as an svg, a formatted percentage, and a label', async function(assert) {
    21      const props = commonProperties();
    22      this.setProperties(props);
    23  
    24      await render(hbs`
    25        <GaugeChart
    26          @value={{value}}
    27          @total={{total}}
    28          @label={{label}} />
    29      `);
    30  
    31      assert.equal(GaugeChart.label, props.label);
    32      assert.equal(GaugeChart.percentage, '50%');
    33      assert.ok(GaugeChart.svgIsPresent);
    34  
    35      await componentA11yAudit(this.element, assert);
    36    });
    37  
    38    test('the width of the chart is determined based on the container and the height is a function of the width', async function(assert) {
    39      const props = commonProperties();
    40      this.setProperties(props);
    41  
    42      await render(hbs`
    43        <div style="width:100px">
    44          <GaugeChart
    45            @value={{value}}
    46            @total={{total}}
    47            @label={{label}} />
    48        </div>
    49      `);
    50  
    51      const svg = find('[data-test-gauge-svg]');
    52  
    53      assert.equal(window.getComputedStyle(svg).width, '100px');
    54      assert.equal(svg.getAttribute('height'), 50);
    55    });
    56  });