I can't seem to figure out why a very simple integration test is not passing
Given an ember data model setting.js
export default class SettingModel extends Model {
@attr('string') name;
@attr('number') value;
}
I am rendering this model with a component
<MyComponent @setting=
@name=
@value=
@values=
@saveSetting= />
The component renders all the possible values (@values
) and applies an active
class on the one which equals the current value
<div class="btn " >
</div>
I wanted to write a simple test where clicking another button updates the active class, but the last assertion always fails. The active class is never updated. In this example, I have used ember-cli mirage
test('renders correctly', async function(assert) {
this.server.get('/settings/:id', () => ({ settings: { id: 1, name: "settingName", value: 1 }}), 200);
let setting = await this.owner.lookup('service:store').findRecord('setting', 1);
this.set('setting', setting);
this.set('name', setting.get('name'));
this.set('value', setting.get('value'));
this.set('values', [0, 1, 2]);
this.set('saveSettingFn', () => {});
await render(hbs`<MyComponent @setting=
@name=
@value=
@values=
@saveSetting= />`);
// middle option active
assert.ok(this.element.querySelectorAll('.btn')[1].getAttribute('class').includes('active'), 'second button active');
// click the first button
await click('.btn');
// first option active
assert.ok(this.element.querySelectorAll('.btn')[0].getAttribute('class').includes('active'), 'first button active');
});
I've created an example project here with a failing test https://github.com/spicalous/component-test-example/blob/master/tests/integration/components/my-component-test.js#L55
- It looks like the value on the model has been saved
- I have tried using
waitFor
test helper - I have tried
await settled();
Any help is appreciated! Thank you!
Aucun commentaire:
Enregistrer un commentaire