Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Testing - The Next Frontier
Search
Robert Jackson
March 10, 2016
Programming
1
66
Testing - The Next Frontier
Talk given at the Boston Ember meetup on 2016-03-10.
Robert Jackson
March 10, 2016
Tweet
Share
More Decks by Robert Jackson
See All by Robert Jackson
😂 of TypeScript
rwjblue
0
340
Testing: The Modern Way
rwjblue
0
41
Glimmer ✨ as a Gateway to Ember 🐹
rwjblue
0
59
Testing: The Future... Today?
rwjblue
0
61
Rails Developer's Intro to Ember
rwjblue
1
180
A tale of two pods
rwjblue
3
830
Ember 2.0 - RFC Recap
rwjblue
6
670
Ember CLI Addons
rwjblue
7
800
RAILS + EMBER.JS + EMBER-CLI = ❤
rwjblue
10
1.8k
Other Decks in Programming
See All in Programming
効率的な開発手段として VRTを活用する
ishkawa
0
160
Modern Angular with Signals and Signal Store:New Rules for Your Architecture @enterJS Advanced Angular Day 2025
manfredsteyer
PRO
0
250
なぜ適用するか、移行して理解するClean Architecture 〜構造を超えて設計を継承する〜 / Why Apply, Migrate and Understand Clean Architecture - Inherit Design Beyond Structure
seike460
PRO
3
790
Webの外へ飛び出せ NativePHPが切り拓くPHPの未来
takuyakatsusa
2
580
VS Code Update for GitHub Copilot
74th
2
670
はじめてのWeb API体験 ー 飲食店検索アプリを作ろうー
akinko_0915
0
130
レベル1の開発生産性向上に取り組む − 日々の作業の効率化・自動化を通じた改善活動
kesoji
0
270
Goで作る、開発・CI環境
sin392
0
260
20250708_JAWS_opscdk
takuyay0ne
2
120
Composerが「依存解決」のためにどんな工夫をしているか #phpcon
o0h
PRO
1
330
AIプログラマーDevinは PHPerの夢を見るか?
shinyasaita
1
240
新メンバーも今日から大活躍!SREが支えるスケールし続ける組織のオンボーディング
honmarkhunt
5
8.3k
Featured
See All Featured
RailsConf 2023
tenderlove
30
1.1k
Building an army of robots
kneath
306
45k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Visualization
eitanlees
146
16k
GraphQLの誤解/rethinking-graphql
sonatard
71
11k
Being A Developer After 40
akosma
90
590k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
7
750
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
For a Future-Friendly Web
brad_frost
179
9.8k
Side Projects
sachag
455
42k
Building Flexible Design Systems
yeseniaperezcruz
328
39k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
Transcript
Testing: The Next Frontier?
None
Who the heck is this guy? • Ember Core Team
• Twitch • General Open Source Addict twitter: rwjblue github: rwjblue
Thank You!!
What are we talking about?
State of Testing Today • Acceptance • Integration • Unit
Acceptance moduleForAcceptance('Acceptance | login'); test('visiting /login', function(assert) { visit('/login'); andThen(function()
{ assert.equal(currentURL(), '/login'); }); });
Integration moduleForComponent('pretty-color', { integration: true }); test('button click', function(assert) {
this.render(hbs`{{magic-title}}`); this.$('button').click(); assert.equal(this.$().text(), 'This is Magic'); });
Unit moduleFor('route:application'); test('perform the right query', function(assert) { let route
= this.subject(); let result = route._queryString(); assert.equal(result, '?awesome=sauce'); });
Great, :shipit:
The End
Seriously?
• Built for a globals world. • “magic” `andThen` •
No ability to stub/mock services. Acceptance Test Issues
None
• Completely ignorant about async • Manual triggering of user
interaction • Much less “tailored” API Unit/Integration Test Issues
None
Now what?
emberjs/rfcs#119
• Use `async` / `await` • Consistent interface • Extendability
• Backwards Compatibility Grand Testing Unification
None
None
None
Acceptance moduleForAcceptance('Can see things'); test('clicking redirects', async function(assert) { await
visit('/things'); let list = find('.thing-item'); assert.equal(list.length, 5); await click('.thing-item[data-id=1]'); assert.equal(this.currentRouteName, 'other- thing'); });
Integration moduleForIntegration('post-display'); test('expand when clicked', async function(assert) { await render(hbs`{{post-display}}`);
await click('.post-item'); assert.equal( this.find('.post-created-at').textContent, '2016-01-05' ); });
• Overriding a service • Registering custom test helpers •
Registering custom waiters • Accessing service instances General Testing Concerns
• Hooks for work before/after tests. • Accessing general test
information General Testing Concerns
Overriding a Service import Mock from 'somewhere/else'; moduleForAcceptance('something', { beforeEach()
{ this.owner.register('service:stripe', Mock); } });
Registering Custom Helpers import selectCategory from '../helpers/select-category'; import loginAsAdmin from
'../helpers/login-as-admin'; moduleForAcceptance('Can see things', { beforeEach() { this.registerHelpers({ loginAsAdmin, selectCategory }); } });
Custom Helpers // tests/helpers/login-as-admin'; import { testHelper } from 'ember-qunit';
export default testHelper(async function() { await this.click('.login-now'); await this.fillIn('.username', 'rwjblue'); await this.fillIn('.password', 'moar beerz plz'); await this.click('.submit'); });
Custom Helpers import selectCategory from '../helpers/select-category'; import loginAsAdmin from '../helpers/login-as-admin';
moduleForAcceptance('Can see things', { beforeEach() { this.registerHelpers({ loginAsAdmin, selectCategory }); } });
Custom Waiters import { testWaiter } from 'ember-test-helpers'; import {
hasPendingTransactions } from 'app- name/services/transactions'; export default testWaiter(function() { return hasPendingTransactions(); });
Custom Waiters import transactionWaiter from '../waiters/pending-transactions'; test('stuff happens', async function(assert)
{ // Normally done in setup, but slides.... this.registerWaiter(transactionWaiter); await click('.foo'); // all pending transactions are completed here... });
Accessing Services test('foo', function(assert) { this.store = this.owner.lookup('service:store'); this.store.push(....); });
General Hooks // */tests/configuration.js import { TestConfig } from 'ember-test-helpers';
export default class extends TestConfig { beforeSuite() {} beforeEach(testType, testContext) {} afterEach(testType, testContext) {} }
General Hooks // liquid-fire's addon-test-support/configuration.js import { TestConfig } from
'ember-test-helpers'; import runningTransitionWaiter from './waiters/running-transition'; import randoHelper from './helpers/rando'; export default class extends TestConfig { beforeEach() { this.registerWaiter(runningTransitionWaiter); this.registerHelper('randoHelper', randoHelper); } }
General Hooks // mirage's addon-test-support/configuration.js import { TestConfig } from
'ember-test-helpers'; import setup from 'ember-cli-mirage/setup-server'; export default class extends TestConfiguration { beforeEach() { this.server = setup(this.owner); } }
Test Information import { testHelper } from 'ember-qunit'; export default
testHelper(function() { if (this.testInfo.type === 'acceptance') { // acceptance test stuff here } else { // integration/unit test stuff here } });
The End