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