Skip to content

Commit

Permalink
Add new test helpers
Browse files Browse the repository at this point in the history
* For #8
* Adds `findByAutoId`, `findInputByName`, `clickByAutoId`,
* Change `const` to `let` in test files
* `fillInByAutoId`, `fillInByName`
  • Loading branch information
rsocci committed Jul 13, 2016
1 parent 5394ad6 commit de97569
Show file tree
Hide file tree
Showing 5 changed files with 103 additions and 16 deletions.
8 changes: 8 additions & 0 deletions test-support/helpers/finders.js
Original file line number Diff line number Diff line change
Expand Up @@ -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}"]`);
}
25 changes: 24 additions & 1 deletion test-support/helpers/interactions.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,9 @@
import Ember from 'ember';
import {
findInputByLabel,
findLabelByText
findLabelByText,
findByAutoId,
findInputByName
} from '../helpers/finders';

const { isEmpty } = Ember;
Expand Down Expand Up @@ -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);
});
}
17 changes: 14 additions & 3 deletions tests/acceptance/finders-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,9 @@ import startApp from '../helpers/start-app';

import {
findInputByLabel,
findLabelByText
findLabelByText,
findInputByName,
findByAutoId
} from '../helpers/finders';

let app;
Expand All @@ -16,6 +18,7 @@ const { run } = Ember;
module('Integration: Finders', {
beforeEach() {
app = startApp();
visit('/');
},

afterEach() {
Expand All @@ -28,7 +31,6 @@ test('#findLabelByText finds the label by the label text', function(assert) {

let label;

visit('/');
andThen(function() {
label = findLabelByText('Email');

Expand All @@ -42,11 +44,20 @@ test('#findInputByLabel finds the input by the label text', function(assert) {
let label;
let input;

visit('/');
andThen(function() {
label = findLabelByText('Name');
input = findInputByLabel(label);

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');
});
65 changes: 55 additions & 10 deletions tests/acceptance/interactions-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,10 @@ import {
clickLink,
clickRadioByLabel,
fillInByLabel,
selectByLabel
selectByLabel,
clickByAutoId,
fillInByAutoId,
fillInByName
} from '../helpers/interactions';

let app;
Expand All @@ -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()}`);
});
Expand All @@ -60,46 +63,88 @@ 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');
});
});

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');
});
});

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');
});
});
4 changes: 2 additions & 2 deletions tests/dummy/app/templates/elements/form.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,10 @@
<form class='node-4 post' id='post_1'>
John Doe
<label class='node-1' for='name'>Name</label>
<input class='node-2' id='name' value='John Doe'>
<input data-auto-id='node-2-input' class='node-2' id='name' value='John Doe' name='node-2-input'>
<label class='node-3' for='email'>Email</label>
<input class='node-5' id='email' value='[email protected]'>
<button {{action "buttonClicked" "First target button clicked"}}>First Target Button</button>
<button data-auto-id="first-target-btn" {{action "buttonClicked" "First target button clicked"}}>First Target Button</button>
</form>

<form class='node-6 post' id='post_2'>
Expand Down

0 comments on commit de97569

Please sign in to comment.