Skip to content

Instantly share code, notes, and snippets.

@jonpitch
Last active July 27, 2016 19:24
Show Gist options
  • Save jonpitch/6e3259b377cb0f9a27d6950a84203640 to your computer and use it in GitHub Desktop.
Save jonpitch/6e3259b377cb0f9a27d6950a84203640 to your computer and use it in GitHub Desktop.
write better ember tests - page object
// without page object - bad
test('here is a test that does not use a page object', function(assert) {
this.render(hbs`{{my-component}}`);
const $button = this.$('#some-button-id');
const $description = this.$('p');
assert.ok($button.is(':visible'), 'I see the button');
assert.equal($description.text().trim(), 'Some text', 'The text is shown correctly');
});
// basic page object - better
test('here is another test with a basic page object', function(assert) {
this.render(hbs`{{my-component}}`);
const page = {
$button: this.$('#some-button-id'),
$description: this.$('p')
};
assert.ok(page.$button.is(':visible'), 'I see the button');
assert.equal(page.$description.text().trim(), 'Some text', 'The text is shown correctly');
});
// page.js
import PageObject, {
text,
isVisible
} from 'frontend/tests/page-object';
export default PageObject.create({
// some button
button: {
scope: '#some-button-id',
isVisible: isVisible()
},
// some p tag
description: {
scope: 'p',
text: text()
}
});
// the test
import page from 'app/tests/pages/something';
test('here is a test using ember-cli-page-object', function(assert) {
this.render(hbs`{{my-component}}`);
assert.ok(page.button.isVisible, 'I see the button');
assert.equal(page.description.text, 'Some text', 'The text is shown correctly');
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment