diff --git a/test-support/helpers/finders.js b/test-support/helpers/finders.js index d6f3123..fa95ec9 100644 --- a/test-support/helpers/finders.js +++ b/test-support/helpers/finders.js @@ -13,3 +13,11 @@ export function findLabelByText(text) { return label; } + +export function findByAutoId(name) { + return find(`[data-auto-id="${name}"]`); +} + +export function findInputByName(name) { + return findWithAssert(`input[name="${name}"]`); +} diff --git a/test-support/helpers/interactions.js b/test-support/helpers/interactions.js index 8cc2446..91ea548 100644 --- a/test-support/helpers/interactions.js +++ b/test-support/helpers/interactions.js @@ -1,7 +1,9 @@ import Ember from 'ember'; import { findInputByLabel, - findLabelByText + findLabelByText, + findByAutoId, + findInputByName } from '../helpers/finders'; const { isEmpty } = Ember; @@ -60,3 +62,24 @@ export function selectByLabel(label, optionText) { .then(() => find(`#${selectId}`).trigger('focusout')); } } + +export function clickByAutoId(autoId) { + andThen(() => { + let element = findByAutoId(autoId); + click(element); + }); +} + +export function fillInByAutoId(autoId, value) { + andThen(() => { + let element = findByAutoId(autoId); + fillIn(element, value); + }); +} + +export function fillInByName(name, value) { + andThen(() => { + let element = findInputByName(name); + fillIn(element, value); + }); +} diff --git a/tests/acceptance/finders-test.js b/tests/acceptance/finders-test.js index b2705f2..329b44c 100644 --- a/tests/acceptance/finders-test.js +++ b/tests/acceptance/finders-test.js @@ -7,7 +7,9 @@ import startApp from '../helpers/start-app'; import { findInputByLabel, - findLabelByText + findLabelByText, + findInputByName, + findByAutoId } from '../helpers/finders'; let app; @@ -16,6 +18,7 @@ const { run } = Ember; module('Integration: Finders', { beforeEach() { app = startApp(); + visit('/'); }, afterEach() { @@ -28,7 +31,6 @@ test('#findLabelByText finds the label by the label text', function(assert) { let label; - visit('/'); andThen(function() { label = findLabelByText('Email'); @@ -42,7 +44,6 @@ test('#findInputByLabel finds the input by the label text', function(assert) { let label; let input; - visit('/'); andThen(function() { label = findLabelByText('Name'); input = findInputByLabel(label); @@ -50,3 +51,13 @@ test('#findInputByLabel finds the input by the label text', function(assert) { assert.equal('John Doe', input.val(), 'expected John Doe to be the input value'); }); }); + +test('#findByAutoId find a button with autoId', (assert) => { + let button = findByAutoId('first-target-btn'); + assert.equal(button.length, 1); +}); + +test('#findInputByName find input by name', (assert) => { + let input = findInputByName('node-2-input'); + assert.equal(input.val(), 'John Doe'); +}); diff --git a/tests/acceptance/interactions-test.js b/tests/acceptance/interactions-test.js index 786f1f4..3919f70 100644 --- a/tests/acceptance/interactions-test.js +++ b/tests/acceptance/interactions-test.js @@ -15,7 +15,10 @@ import { clickLink, clickRadioByLabel, fillInByLabel, - selectByLabel + selectByLabel, + clickByAutoId, + fillInByAutoId, + fillInByName } from '../helpers/interactions'; let app; @@ -35,7 +38,7 @@ module('Acceptance: Interactions', { test('#checkByLabel finds a checkbox and checks it', (assert) => { andThen(checkByLabel('This is the second checkbox')); andThen(() => { - const checkedInput = find('#checkbox2:checked'); + let checkedInput = find('#checkbox2:checked'); assert.equal('second_checkbox', checkedInput.val(), `expected the second checkbox to be checked but found ${checkedInput.val()}`); }); @@ -60,7 +63,7 @@ test('#clickLink finds a link by its text and clicks it', function(assert) { andThen(clickLink('First link')); andThen(() => { - const url = currentURL(); + let url = currentURL(); assert.equal(url, '/first-link-target'); }); }); @@ -68,30 +71,30 @@ test('#clickLink finds a link by its text and clicks it', function(assert) { test('#clickRadioByLabel adds checked attribute to corresponding input', (assert) => { andThen(clickRadioByLabel('Label for first radio')); andThen(() => { - const checkedInput = find('input:checked'); + let checkedInput = find('input:checked'); assert.equal('radio_1', checkedInput.val(), 'expected radio 1 to be checked'); }); andThen(clickRadioByLabel('Label for second radio')); andThen(() => { - const checkedInput = find('input:checked'); + let checkedInput = find('input:checked'); assert.equal('radio_2', checkedInput.val(), 'expected radio 2 to be checked'); }); }); test('#fillInByLabel enters text into an input corresponding to a label', function(assert) { - const targetInput = 'form input.node-2'; - const targetValue = 'Jane Doe'; + let targetInput = 'form input.node-2'; + let targetValue = 'Jane Doe'; assert.expect(2); andThen(() => { - const val = find(targetInput).val(); + let val = find(targetInput).val(); assert.notEqual(val, targetValue, 'did not expect the input to contain the target value yet'); }); andThen(fillInByLabel('Name', targetValue)); andThen(() => { - const val = find(targetInput).val(); + let val = find(targetInput).val(); assert.equal(val, targetValue, 'expected the input to contain the target value'); }); }); @@ -99,7 +102,49 @@ test('#fillInByLabel enters text into an input corresponding to a label', functi test('#selectByLabel selects a dropdown option by label and option', (assert) => { andThen(selectByLabel('Label for first select', 'Value 2')); andThen(() => { - const selectedOption = find('option:selected'); + let selectedOption = find('option:selected'); assert.equal('value2', selectedOption.val(), 'expected option 2 to be selected'); }); }); + + +test('#clickByAutoId finds a button by autoId and clicks it', (assert) => { + clickByAutoId('first-target-btn'); + andThen(assertHasMessage(assert, 'First target button clicked')); +}); + +test('#fillInByAutoId fills in input by autoId', (assert) => { + assert.expect(2); + + let targetInput = 'form input.node-2'; + let targetValue = 'Jane Doe'; + + andThen(() => { + let val = find(targetInput).val(); + assert.notEqual(val, targetValue, 'did not expect the input to contain the target value yet'); + }); + + fillInByAutoId('node-2-input', targetValue); + + andThen(() => { + let val = find(targetInput).val(); + assert.equal(val, targetValue, 'expected the input to contain the target value'); + }); +}); + +test('#fillInByName fills input by name', (assert) => { + let targetInput = 'form input.node-2'; + let targetValue = 'Jane Doe'; + + andThen(() => { + let val = find(targetInput).val(); + assert.notEqual(val, targetValue, 'did not expect the input to contain the target value yet'); + }); + + fillInByName('node-2-input', targetValue); + + andThen(() => { + let val = find(targetInput).val(); + assert.equal(val, targetValue, 'expect the input to have the target value'); + }); +}); diff --git a/tests/dummy/app/templates/elements/form.hbs b/tests/dummy/app/templates/elements/form.hbs index 29a0355..f8d553f 100644 --- a/tests/dummy/app/templates/elements/form.hbs +++ b/tests/dummy/app/templates/elements/form.hbs @@ -2,10 +2,10 @@