gaiety/sortable-recipes
1
0
Fork 0
Code Activity

Possibly final tests

Browse source
This commit is contained in:
Ava Wroten 2020-03-15 16:29:38 -05:00
parent 8cb9d9ecf3
commit 3530bb84c4
1 changed files with 104 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

106
ember-ui/tests/integration/components/sortable-group-accessible-test.js
View file

@ -1,13 +1,12 @@
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render } from '@ember/test-helpers';
import { render, find, click, triggerEvent, triggerKeyEvent } from '@ember/test-helpers';
import { hbs } from 'ember-cli-htmlbars';
module('Integration | Component | sortable-group-accessible', function(hooks) {
setupRenderingTest(hooks);
test('it can yield text content', async function(assert) {
// Template block usage:
await render(hbs`
<SortableGroupAccessible>
template block text
@ -16,4 +15,107 @@ module('Integration | Component | sortable-group-accessible', function(hooks) {
assert.equal(this.element.textContent.trim(), 'template block text');
});
test('it can pass splattributes to wrapper div', async function(assert) {
await render(hbs`
<SortableGroupAccessible
class='foo'
data-test-id='wrapper' />
`);
assert.dom('[data-test-id=wrapper]').hasClass('foo');
});
test('it has a wrapper div with a unique id', async function(assert) {
await render(hbs`
<SortableGroupAccessible data-test-id='first' />
<SortableGroupAccessible data-test-id='second' />
`);
assert.dom('[data-test-id=first]').hasAttribute('data-id');
assert.dom('[data-test-id=second]').hasAttribute('data-id');
assert.notEqual(find('[data-test-id=first]').getAttribute('data-id'), find('[data-test-id=second]').getAttribute('data-id'));
});
test('it can yield whether it has group focus or not', async function(assert) {
await render(hbs`
<SortableGroupAccessible
tabindex="0"
data-test-id='wrapper'
as | groupHasFocus |>
<span data-test-id='hasFocusWrapper'>{{groupHasFocus}}</span>
</SortableGroupAccessible>
`);
assert.dom('[data-test-id=hasFocusWrapper]').hasText('false');
await triggerEvent('[data-test-id=wrapper]', 'focus');
assert.dom('[data-test-id=hasFocusWrapper]').hasText('true');
await triggerEvent('[data-test-id=wrapper]', 'blur');
assert.dom('[data-test-id=hasFocusWrapper]').hasText('false');
});
test('it can yield focus action', async function(assert) {
await render(hbs`
<SortableGroupAccessible
tabindex="0"
data-test-id='wrapper'
as | groupHasFocus _ groupActions |>
<span data-test-id='hasFocusWrapper'>{{groupHasFocus}}</span>
<button role="button" data-test-id='focusButton' {{action groupActions.handleFocus}}>Focus</button>
</SortableGroupAccessible>
`);
await click('[data-test-id=focusButton]');
assert.dom('[data-test-id=hasFocusWrapper]').hasText('true');
});
test('it yields selected index while arrow keying up/down', async function(assert) {
this.models = ['foo', 'bar'];
await render(hbs`
<SortableGroupAccessible
tabindex="0"
data-test-id='wrapper'
@models={{models}}
as | groupHasFocus selectedIndex |>
<span data-test-id='selectedIndexWrapper'>{{selectedIndex}}</span>
</SortableGroupAccessible>
`);
assert.dom('[data-test-id=selectedIndexWrapper]').hasText('0');
await triggerEvent('[data-test-id=wrapper]', 'focus');
await triggerKeyEvent('[data-test-id=wrapper]', 'keyup', 'ArrowDown');
assert.dom('[data-test-id=selectedIndexWrapper]').hasText('1', 'Can select down');
await triggerKeyEvent('[data-test-id=wrapper]', 'keyup', 'ArrowDown');
assert.dom('[data-test-id=selectedIndexWrapper]').hasText('1', 'Does not extend past array length');
await triggerKeyEvent('[data-test-id=wrapper]', 'keyup', 'ArrowUp');
assert.dom('[data-test-id=selectedIndexWrapper]').hasText('0', 'Can select up');
await triggerKeyEvent('[data-test-id=wrapper]', 'keyup', 'ArrowUp');
assert.dom('[data-test-id=selectedIndexWrapper]').hasText('0', 'Can select up');
await triggerKeyEvent('[data-test-id=wrapper]', 'keyup', 'ArrowUp');
assert.dom('[data-test-id=selectedIndexWrapper]').hasText('0', 'Does not extend beyond 0');
});
test('it yields selected index while arrow keying up/down', async function(assert) {
this.models = ['foo', 'bar'];
await render(hbs`
<SortableGroupAccessible
tabindex="0"
data-test-id='wrapper'
@models={{models}}
as | groupHasFocus selectedIndex |>
<span data-test-id='selectedIndexWrapper'>{{selectedIndex}}</span>
</SortableGroupAccessible>
`);
assert.dom('[data-test-id=selectedIndexWrapper]').hasText('0');
});
});