diff --git a/tests/integration/did-change-attrs-test.js b/tests/integration/did-change-attrs-test.js index 5636f31..aea8380 100644 --- a/tests/integration/did-change-attrs-test.js +++ b/tests/integration/did-change-attrs-test.js @@ -1,110 +1,112 @@ import Ember from 'ember'; -import { test, moduleForComponent } from 'ember-qunit'; +import { module, test } from 'qunit'; +import { setupRenderingTest } from 'ember-qunit'; +import { render } from 'ember-test-helpers'; import hbs from 'htmlbars-inline-precompile'; import DidChangeAttrs from 'ember-did-change-attrs'; -function registerComponent(testSuite, hash, klass = Ember.Component) { - testSuite.register('component:x-changer', klass.extend(DidChangeAttrs, hash)); +function registerComponent(owner, hash, klass = Ember.Component) { + owner.register('component:x-changer', klass.extend(DidChangeAttrs, hash)); } -moduleForComponent('x-changer', 'Integration | DidChangeAttrs', { - integration: true -}); - -test('Basic usage', function(assert) { - let changedAttrs, didChangeAttrsCallCount = 0; +module('Integration | DidChangeAttrs', function(hooks) { + setupRenderingTest(hooks); - registerComponent(this, { - didChangeAttrsConfig: { - attrs: ['email', 'isAdmin'] - }, + test('Basic usage', async function(assert) { + let changedAttrs, didChangeAttrsCallCount = 0; - didChangeAttrs(changes) { - this._super(...arguments); + registerComponent(this.owner, { + didChangeAttrsConfig: { + attrs: ['email', 'isAdmin'] + }, - didChangeAttrsCallCount++; - changedAttrs = changes; - } - }); + didChangeAttrs(changes) { + this._super(...arguments); - this.set('name', 'Tomster'); - this.set('email', 'ember@hamster.org'); - this.set('isAdmin', false); + didChangeAttrsCallCount++; + changedAttrs = changes; + } + }); - this.render(hbs`{{x-changer email=email isAdmin=isAdmin name=name}}`); + this.set('name', 'Tomster'); + this.set('email', 'ember@hamster.org'); + this.set('isAdmin', false); - assert.equal(didChangeAttrsCallCount, 0, '`didChangeAttrs` is not called on initial render'); + await render(hbs`{{x-changer email=email isAdmin=isAdmin name=name}}`); - this.set('email', 'emberjs@hamster.org'); - assert.equal(didChangeAttrsCallCount, 1, '`didChangeAttrs` is called when an attribute changed'); + assert.equal(didChangeAttrsCallCount, 0, '`didChangeAttrs` is not called on initial render'); - assert.deepEqual(changedAttrs, { - email: { - previous: 'ember@hamster.org', - current: 'emberjs@hamster.org' - } - }, '`changedAttrs` contains the attribute changes'); + this.set('email', 'emberjs@hamster.org'); + assert.equal(didChangeAttrsCallCount, 1, '`didChangeAttrs` is called when an attribute changed'); - this.set('name', 'TheTomster'); - assert.equal(didChangeAttrsCallCount, 1, '`didChangeAttrs` is not called when an untracked attribute is changed'); -}); + assert.deepEqual(changedAttrs, { + email: { + previous: 'ember@hamster.org', + current: 'emberjs@hamster.org' + } + }, '`changedAttrs` contains the attribute changes'); -test('Custom isEqual', function(assert) { - let changedAttrs, didChangeAttrsCallCount = 0; + this.set('name', 'TheTomster'); + assert.equal(didChangeAttrsCallCount, 1, '`didChangeAttrs` is not called when an untracked attribute is changed'); + }); - registerComponent(this, { - didChangeAttrsConfig: { - attrs: ['user', 'isAdmin'], - isEqual(key, a, b) { - if (key === 'user') { - return (a && b) ? a.id === b.id : a === b; + test('Custom isEqual', async function(assert) { + let changedAttrs, didChangeAttrsCallCount = 0; + + registerComponent(this.owner, { + didChangeAttrsConfig: { + attrs: ['user', 'isAdmin'], + isEqual(key, a, b) { + if (key === 'user') { + return (a && b) ? a.id === b.id : a === b; + } + return a === b; } - return a === b; + }, + + didChangeAttrs(changes) { + this._super(...arguments); + + didChangeAttrsCallCount++; + changedAttrs = changes; } - }, + }); - didChangeAttrs(changes) { - this._super(...arguments); + this.set('user', { name: 'Tomster', id: '123' }); + this.set('isAdmin', false); - didChangeAttrsCallCount++; - changedAttrs = changes; - } - }); + await render(hbs`{{x-changer user=user isAdmin=isAdmin}}`); - this.set('user', { name: 'Tomster', id: '123' }); - this.set('isAdmin', false); + assert.equal(didChangeAttrsCallCount, 0, '`didChangeAttrs` is not called on initial render'); - this.render(hbs`{{x-changer user=user isAdmin=isAdmin}}`); + this.set('user', { name: 'TheTomster', id: '123' }); - assert.equal(didChangeAttrsCallCount, 0, '`didChangeAttrs` is not called on initial render'); + assert.equal(didChangeAttrsCallCount, 0, '`didChangeAttrs` is not called because user entities are equal'); - this.set('user', { name: 'TheTomster', id: '123' }); + this.set('user', { name: 'Zoey', id: '456' }); - assert.equal(didChangeAttrsCallCount, 0, '`didChangeAttrs` is not called because user entities are equal'); + assert.equal(didChangeAttrsCallCount, 1, '`didChangeAttrs` is called because user entities are not equal'); + assert.deepEqual(changedAttrs, { + user: { + previous: { + id: '123', + name: 'Tomster' + }, + current: { + id: '456', + name: 'Zoey' + } + } + }, '`user` included in `changedAttrs` because `user.id` is different'); - this.set('user', { name: 'Zoey', id: '456' }); + this.set('isAdmin', true); - assert.equal(didChangeAttrsCallCount, 1, '`didChangeAttrs` is called because user entities are not equal'); - assert.deepEqual(changedAttrs, { - user: { - previous: { - id: '123', - name: 'Tomster' - }, - current: { - id: '456', - name: 'Zoey' + assert.equal(didChangeAttrsCallCount, 2, '`didChangeAttrs` is called because isAdmin changed'); + assert.deepEqual(changedAttrs, { + isAdmin: { + previous: false, + current: true } - } - }, '`user` included in `changedAttrs` because `user.id` is different'); - - this.set('isAdmin', true); - - assert.equal(didChangeAttrsCallCount, 2, '`didChangeAttrs` is called because isAdmin changed'); - assert.deepEqual(changedAttrs, { - isAdmin: { - previous: false, - current: true - } - }, '`isAdmin` included in `changedAttrs` because it changed'); + }, '`isAdmin` included in `changedAttrs` because it changed'); + }); });