87ab332bce
This commit adds 2 ember component/helpers and a service to contain the shared functionality for matching/rendering content dependent on state identifiers. Currently a `service.state` method has been added to easily make manual state objects, but these are built towards using `xstate` to manage UI state in some of our future components. We've added some tests here, and we aren't currently using these components anywhere in this commit.
34 lines
924 B
JavaScript
34 lines
924 B
JavaScript
import { module, test } from 'qunit';
|
|
import { setupRenderingTest } from 'ember-qunit';
|
|
import { render } from '@ember/test-helpers';
|
|
import { hbs } from 'ember-cli-htmlbars';
|
|
|
|
module('Integration | Component | state', function(hooks) {
|
|
setupRenderingTest(hooks);
|
|
|
|
test('it renders', async function(assert) {
|
|
// Set any properties with this.set('myProperty', 'value');
|
|
// Handle any actions with this.set('myAction', function(val) { ... });
|
|
|
|
this.set('state', {
|
|
matches: function(id) {
|
|
return id === 'idle';
|
|
},
|
|
});
|
|
await render(hbs`
|
|
<State @state={{state}} @matches="idle">
|
|
Currently Idle
|
|
</State>
|
|
`);
|
|
|
|
assert.equal(this.element.textContent.trim(), 'Currently Idle');
|
|
await render(hbs`
|
|
<State @state={{state}} @matches="loading">
|
|
Currently Idle
|
|
</State>
|
|
`);
|
|
|
|
assert.equal(this.element.textContent.trim(), '');
|
|
});
|
|
});
|