diff --git a/tests/acceptance/ember-keyboard-test.js b/tests/acceptance/ember-keyboard-test.js
index 689407369..9bcb57ea4 100644
--- a/tests/acceptance/ember-keyboard-test.js
+++ b/tests/acceptance/ember-keyboard-test.js
@@ -2,6 +2,7 @@ import { click, fillIn, blur, visit } from '@ember/test-helpers';
import { setupApplicationTest } from 'ember-qunit';
import { set } from '@ember/object';
import { module, test } from 'qunit';
+import { gte } from 'ember-compatibility-helpers';
import {
mouseDown,
@@ -17,100 +18,102 @@ import { getValues, getMouseValues, getTouchValues } from '../helpers/get-values
module('Acceptance | ember keyboard', function(hooks) {
setupApplicationTest(hooks);
- test('test standard functionality', async function(assert) {
- assert.expect(11);
+ if (gte('3.10.0')) {
+ test('test standard functionality', async function(assert) {
+ assert.expect(11);
- await visit('/test-scenario')
+ await visit('/test-scenario')
- await mouseDown('left');
- assert.deepEqual(getMouseValues(), [1], 'left mouse');
+ await mouseDown('left');
+ assert.deepEqual(getMouseValues(), [1], 'left mouse');
- await mouseDown('right');
- assert.deepEqual(getMouseValues(), [11], 'right mouse');
+ await mouseDown('right');
+ assert.deepEqual(getMouseValues(), [11], 'right mouse');
- await mouseDown('middle');
- assert.deepEqual(getMouseValues(), [1], 'middle mouse');
+ await mouseDown('middle');
+ assert.deepEqual(getMouseValues(), [1], 'middle mouse');
- await touchStart();
- assert.deepEqual(getTouchValues(), [1], 'touch event');
+ await touchStart();
+ assert.deepEqual(getTouchValues(), [1], 'touch event');
- await keyDown('ArrowRight');
- assert.deepEqual(getValues(), [1, 1, 1], 'equal responders all respond');
+ await keyDown('ArrowRight');
+ assert.deepEqual(getValues(), [1, 1, 1], 'equal responders all respond');
- await fillIn(`${hook('counter-first')} ${hook('counter-priority-input')}`, '1');
+ await fillIn(`${hook('counter-first')} ${hook('counter-priority-input')}`, '1');
- await blur(`${hook('counter-first')} ${hook('counter-priority-input')}`);
+ await blur(`${hook('counter-first')} ${hook('counter-priority-input')}`);
- await keyDown('ArrowRight');
- assert.deepEqual(getValues(), [2, 1, 1], 'highest responder responds first');
+ await keyDown('ArrowRight');
+ assert.deepEqual(getValues(), [2, 1, 1], 'highest responder responds first');
- await click(`${hook('counter-second')} ${hook('counter-first-responder-toggle')}`);
+ await click(`${hook('counter-second')} ${hook('counter-first-responder-toggle')}`);
- await keyDown('ArrowRight');
- assert.deepEqual(getValues(), [2, 2, 1], 'first responder responds first');
+ await keyDown('ArrowRight');
+ assert.deepEqual(getValues(), [2, 2, 1], 'first responder responds first');
- await click(`${hook('counter-second')} ${hook('counter-lax-priority-toggle')}`);
+ await click(`${hook('counter-second')} ${hook('counter-lax-priority-toggle')}`);
- await keyDown('ArrowRight');
- assert.deepEqual(getValues(), [3, 3, 1], 'lax priority does not block lower priority responders');
+ await keyDown('ArrowRight');
+ assert.deepEqual(getValues(), [3, 3, 1], 'lax priority does not block lower priority responders');
- await click(`${hook('counter-first')} ${hook('counter-activated-toggle')}`);
+ await click(`${hook('counter-first')} ${hook('counter-activated-toggle')}`);
- await keyDown('ArrowRight');
- assert.deepEqual(getValues(), [3, 4, 2], 'deactivating a responder removes it from the stack');
+ await keyDown('ArrowRight');
+ assert.deepEqual(getValues(), [3, 4, 2], 'deactivating a responder removes it from the stack');
- await keyDown('ArrowRight+ctrl+shift');
- assert.deepEqual(getValues(), [3, 104, 102], 'modifier keys work');
+ await keyDown('ArrowRight+ctrl+shift');
+ assert.deepEqual(getValues(), [3, 104, 102], 'modifier keys work');
- await keyUp('KeyR');
- assert.deepEqual(getValues(), [3, 0, 0], 'keyUp works');
- });
+ await keyUp('KeyR');
+ assert.deepEqual(getValues(), [3, 0, 0], 'keyUp works');
+ });
- test('test event propagation', async function(assert) {
- assert.expect(6);
+ test('test event propagation', async function(assert) {
+ assert.expect(6);
- const keyboardService = getService('keyboard');
- set(keyboardService, 'isPropagationEnabled', true);
+ const keyboardService = getService('keyboard');
+ set(keyboardService, 'isPropagationEnabled', true);
- await visit('/test-scenario');
- await keyDown('ArrowRight');
- assert.deepEqual(getValues(), [1, 1, 1], 'equal responders all respond');
+ await visit('/test-scenario');
+ await keyDown('ArrowRight');
+ assert.deepEqual(getValues(), [1, 1, 1], 'equal responders all respond');
- await fillIn(`${hook('counter-first')} ${hook('counter-priority-input')}`, '1');
- await blur(`${hook('counter-first')} ${hook('counter-priority-input')}`);
+ await fillIn(`${hook('counter-first')} ${hook('counter-priority-input')}`, '1');
+ await blur(`${hook('counter-first')} ${hook('counter-priority-input')}`);
- await keyDown('ArrowRight');
- assert.deepEqual(getValues(), [2, 2, 2], 'highest responder responds first, lower responders follow');
+ await keyDown('ArrowRight');
+ assert.deepEqual(getValues(), [2, 2, 2], 'highest responder responds first, lower responders follow');
- await fillIn(`${hook('counter-second')} ${hook('counter-priority-input')}`, '1');
- await blur(`${hook('counter-second')} ${hook('counter-priority-input')}`);
- await click(`${hook('counter-first')} ${hook('counter-stop-immediate-propagation-toggle')}`);
+ await fillIn(`${hook('counter-second')} ${hook('counter-priority-input')}`, '1');
+ await blur(`${hook('counter-second')} ${hook('counter-priority-input')}`);
+ await click(`${hook('counter-first')} ${hook('counter-stop-immediate-propagation-toggle')}`);
- await keyDown('ArrowRight');
- assert.deepEqual(getValues(), [3, 2, 3], 'highest responder responds first and stops immediate propagation, lower responders follow');
+ await keyDown('ArrowRight');
+ assert.deepEqual(getValues(), [3, 2, 3], 'highest responder responds first and stops immediate propagation, lower responders follow');
- await click(`${hook('counter-first')} ${hook('counter-stop-immediate-propagation-toggle')}`);
- await click(`${hook('counter-first')} ${hook('counter-stop-propagation-toggle')}`);
+ await click(`${hook('counter-first')} ${hook('counter-stop-immediate-propagation-toggle')}`);
+ await click(`${hook('counter-first')} ${hook('counter-stop-propagation-toggle')}`);
- await keyDown('ArrowRight');
- assert.deepEqual(getValues(), [4, 3, 3], 'highest responders responds first and block propagation to lower priority responders');
+ await keyDown('ArrowRight');
+ assert.deepEqual(getValues(), [4, 3, 3], 'highest responders responds first and block propagation to lower priority responders');
- await click(`${hook('counter-first')} ${hook('counter-activated-toggle')}`);
+ await click(`${hook('counter-first')} ${hook('counter-activated-toggle')}`);
- await keyDown('ArrowRight');
- assert.deepEqual(getValues(), [4, 4, 4], 'deactivating a responder removes it from the stack, deactivated responders do not block propagation');
+ await keyDown('ArrowRight');
+ assert.deepEqual(getValues(), [4, 4, 4], 'deactivating a responder removes it from the stack, deactivated responders do not block propagation');
- await fillIn(`${hook('counter-first')} ${hook('counter-priority-input')}`, '2');
- await blur(`${hook('counter-first')} ${hook('counter-priority-input')}`);
- await click(`${hook('counter-first')} ${hook('counter-stop-propagation-toggle')}`);
- await click(`${hook('counter-first')} ${hook('counter-activated-toggle')}`);
- await click(`${hook('counter-first')} ${hook('counter-first-responder-toggle')}`);
- await click(`${hook('counter-second')} ${hook('counter-first-responder-toggle')}`);
- await click(`${hook('counter-second')} ${hook('counter-stop-immediate-propagation-toggle')}`);
+ await fillIn(`${hook('counter-first')} ${hook('counter-priority-input')}`, '2');
+ await blur(`${hook('counter-first')} ${hook('counter-priority-input')}`);
+ await click(`${hook('counter-first')} ${hook('counter-stop-propagation-toggle')}`);
+ await click(`${hook('counter-first')} ${hook('counter-activated-toggle')}`);
+ await click(`${hook('counter-first')} ${hook('counter-first-responder-toggle')}`);
+ await click(`${hook('counter-second')} ${hook('counter-first-responder-toggle')}`);
+ await click(`${hook('counter-second')} ${hook('counter-stop-immediate-propagation-toggle')}`);
- await click(`${hook('counter-third')} ${hook('counter-first-responder-toggle')}`);
+ await click(`${hook('counter-third')} ${hook('counter-first-responder-toggle')}`);
- await keyDown('ArrowRight');
- assert.deepEqual(getValues(), [5, 5, 4], 'first responders get called in priority order.');
- });
+ await keyDown('ArrowRight');
+ assert.deepEqual(getValues(), [5, 5, 4], 'first responders get called in priority order.');
+ });
+ }
});
diff --git a/tests/acceptance/keyboard-test.js b/tests/acceptance/keyboard-test.js
index cd5013fe5..1c0fd24e7 100644
--- a/tests/acceptance/keyboard-test.js
+++ b/tests/acceptance/keyboard-test.js
@@ -1,66 +1,68 @@
import { visit } from '@ember/test-helpers';
import { setupApplicationTest } from 'ember-qunit';
import { module, test } from 'qunit';
-
import { keyDown, keyUp, keyPress } from 'ember-keyboard/test-support/test-helpers';
-
import { textChanged } from '../helpers/text-changed';
+import { gte } from 'ember-compatibility-helpers';
module('Acceptance | ember keyboard | keyboard', function(hooks) {
setupApplicationTest(hooks);
- hooks.beforeEach(async function() {
- await visit('/test-scenario/keyboard');
- });
+ if (gte('3.10.0')) {
- module('keyDown', function() {
- module('Arrow keys', function() {
- test('Left is pressed', async function(assert) {
- assert.expect(2);
+ hooks.beforeEach(async function() {
+ await visit('/test-scenario/keyboard');
+ });
- await textChanged(assert,
- () => keyDown('ArrowLeft'), {
- selectorName: 'counter-counter',
- beforeValue: '0',
- afterValue: '-1',
- });
+ module('keyDown', function() {
+ module('Arrow keys', function() {
+ test('Left is pressed', async function(assert) {
+ assert.expect(2);
+
+ await textChanged(assert,
+ () => keyDown('ArrowLeft'), {
+ selectorName: 'counter-counter',
+ beforeValue: '0',
+ afterValue: '-1',
+ });
+ });
});
});
- });
- module('keyUp', function() {
- module('Letters are pressed', function() {
- module('R is configured to reset the counter', function(hooks) {
- hooks.beforeEach(async function() {
- await keyDown('ArrowRight');
+ module('keyUp', function() {
+ module('Letters are pressed', function() {
+ module('R is configured to reset the counter', function(hooks) {
+ hooks.beforeEach(async function() {
+ await keyDown('ArrowRight');
+ });
+
+ test('the counter is cleared', async function(assert) {
+ assert.expect(2);
+
+ await textChanged(assert,
+ () => keyUp('KeyR'), {
+ selectorName: 'counter-counter',
+ beforeValue: '1',
+ afterValue: '0'
+ });
+ });
});
+ });
+ });
- test('the counter is cleared', async function(assert) {
+ module('keyPress', function() {
+ module('Numbers are pressed', function() {
+ test('pressing 5 sets the the counter', async function(assert) {
assert.expect(2);
await textChanged(assert,
- () => keyUp('KeyR'), {
+ () => keyPress('Digit5'), {
selectorName: 'counter-counter',
- beforeValue: '1',
- afterValue: '0'
+ beforeValue: '0',
+ afterValue: '5'
});
});
});
});
- });
-
- module('keyPress', function() {
- module('Numbers are pressed', function() {
- test('pressing 5 sets the the counter', async function(assert) {
- assert.expect(2);
-
- await textChanged(assert,
- () => keyPress('Digit5'), {
- selectorName: 'counter-counter',
- beforeValue: '0',
- afterValue: '5'
- });
- });
- });
- });
+ }
});
diff --git a/tests/acceptance/mouse-down-test.js b/tests/acceptance/mouse-down-test.js
index 9c4f81de1..c044dc155 100644
--- a/tests/acceptance/mouse-down-test.js
+++ b/tests/acceptance/mouse-down-test.js
@@ -1,87 +1,89 @@
import { visit } from '@ember/test-helpers';
import { setupApplicationTest } from 'ember-qunit';
import { module, test } from 'qunit';
-
import { mouseDown } from 'ember-keyboard/test-support/test-helpers';
-
import { textChanged } from '../helpers/text-changed';
+import { gte } from 'ember-compatibility-helpers';
module('Acceptance | ember keyboard | mouseDown', function(hooks) {
setupApplicationTest(hooks);
- hooks.beforeEach(async function() {
- await visit('/test-scenario/mouse-down');
- });
-
- module('left clicking', function() {
- test('clicking once adjusts the counter by 1', async function(assert) {
- assert.expect(2);
-
- await textChanged(assert,
- () => mouseDown('left'), {
- selectorName: 'mouse-down-counter',
- beforeValue: '0',
- afterValue: '1',
- });
- });
-
- test('clicking twice adjusts the counter by 1', async function(assert) {
- assert.expect(2);
+ if (gte('3.10.0')) {
- await textChanged(assert,
- () => mouseDown('left') && mouseDown('left'), {
- selectorName: 'mouse-down-counter',
- beforeValue: '0',
- afterValue: '2',
- });
+ hooks.beforeEach(async function() {
+ await visit('/test-scenario/mouse-down');
});
- });
- module('middle clicking', function() {
- test('clicking once adjusts the counter by 1', async function(assert) {
- assert.expect(2);
-
- await textChanged(assert,
- () => mouseDown('middle'), {
- selectorName: 'mouse-down-counter',
- beforeValue: '0',
- afterValue: '-10',
- });
- });
-
- test('clicking twice adjusts the counter by 1', async function(assert) {
- assert.expect(2);
-
- await textChanged(assert,
- () => mouseDown('middle') && mouseDown('middle'), {
- selectorName: 'mouse-down-counter',
- beforeValue: '0',
- afterValue: '-20',
- });
+ module('left clicking', function() {
+ test('clicking once adjusts the counter by 1', async function(assert) {
+ assert.expect(2);
+
+ await textChanged(assert,
+ () => mouseDown('left'), {
+ selectorName: 'mouse-down-counter',
+ beforeValue: '0',
+ afterValue: '1',
+ });
+ });
+
+ test('clicking twice adjusts the counter by 1', async function(assert) {
+ assert.expect(2);
+
+ await textChanged(assert,
+ () => mouseDown('left') && mouseDown('left'), {
+ selectorName: 'mouse-down-counter',
+ beforeValue: '0',
+ afterValue: '2',
+ });
+ });
});
- });
-
- module('right clicking', function() {
- test('clicking once adjusts the counter by 1', async function(assert) {
- assert.expect(2);
- await textChanged(assert,
- () => mouseDown('right'), {
- selectorName: 'mouse-down-counter',
- beforeValue: '0',
- afterValue: '10',
- });
+ module('middle clicking', function() {
+ test('clicking once adjusts the counter by 1', async function(assert) {
+ assert.expect(2);
+
+ await textChanged(assert,
+ () => mouseDown('middle'), {
+ selectorName: 'mouse-down-counter',
+ beforeValue: '0',
+ afterValue: '-10',
+ });
+ });
+
+ test('clicking twice adjusts the counter by 1', async function(assert) {
+ assert.expect(2);
+
+ await textChanged(assert,
+ () => mouseDown('middle') && mouseDown('middle'), {
+ selectorName: 'mouse-down-counter',
+ beforeValue: '0',
+ afterValue: '-20',
+ });
+ });
});
- test('clicking twice adjusts the counter by 1', async function(assert) {
- assert.expect(2);
-
- await textChanged(assert,
- () => mouseDown('right') && mouseDown('right'), {
- selectorName: 'mouse-down-counter',
- beforeValue: '0',
- afterValue: '20',
- });
+ module('right clicking', function() {
+ test('clicking once adjusts the counter by 1', async function(assert) {
+ assert.expect(2);
+
+ await textChanged(assert,
+ () => mouseDown('right'), {
+ selectorName: 'mouse-down-counter',
+ beforeValue: '0',
+ afterValue: '10',
+ });
+ });
+
+ test('clicking twice adjusts the counter by 1', async function(assert) {
+ assert.expect(2);
+
+ await textChanged(assert,
+ () => mouseDown('right') && mouseDown('right'), {
+ selectorName: 'mouse-down-counter',
+ beforeValue: '0',
+ afterValue: '20',
+ });
+ });
});
- });
+ }
});
diff --git a/tests/acceptance/touch-test.js b/tests/acceptance/touch-test.js
index 743d1f760..03a7872d2 100644
--- a/tests/acceptance/touch-test.js
+++ b/tests/acceptance/touch-test.js
@@ -1,40 +1,42 @@
import { visit } from '@ember/test-helpers';
import { setupApplicationTest } from 'ember-qunit';
import { module, test } from 'qunit';
-
import { touchStart } from 'ember-keyboard/test-support/test-helpers';
-
import { textChanged } from '../helpers/text-changed';
+import { gte } from 'ember-compatibility-helpers';
module('Acceptance | ember keyboard | touch', function(hooks) {
setupApplicationTest(hooks);
- hooks.beforeEach(async function() {
- await visit('/test-scenario/touch');
- });
-
- module('start touching', function() {
+ if (gte('3.10.0')) {
- test('increases the touch counter once', async function(assert) {
- assert.expect(2);
-
- await textChanged(assert,
- () => touchStart(), {
- selectorName: 'touch-start-counter',
- beforeValue: '0',
- afterValue: '1',
- });
+ hooks.beforeEach(async function() {
+ await visit('/test-scenario/touch');
});
- test('increases the touch counter twice', async function(assert) {
- assert.expect(2);
-
- await textChanged(assert,
- () => touchStart() && touchStart(), {
- selectorName: 'touch-start-counter',
- beforeValue: '0',
- afterValue: '2',
- });
+ module('start touching', function() {
+
+ test('increases the touch counter once', async function(assert) {
+ assert.expect(2);
+
+ await textChanged(assert,
+ () => touchStart(), {
+ selectorName: 'touch-start-counter',
+ beforeValue: '0',
+ afterValue: '1',
+ });
+ });
+
+ test('increases the touch counter twice', async function(assert) {
+ assert.expect(2);
+
+ await textChanged(assert,
+ () => touchStart() && touchStart(), {
+ selectorName: 'touch-start-counter',
+ beforeValue: '0',
+ afterValue: '2',
+ });
+ });
});
- });
+ }
});
diff --git a/tests/dummy/app/templates/deprecations.hbs b/tests/dummy/app/templates/deprecations.hbs
index eebe135ef..fdc9fcd30 100644
--- a/tests/dummy/app/templates/deprecations.hbs
+++ b/tests/dummy/app/templates/deprecations.hbs
@@ -12,6 +12,9 @@ most direct translation to the new API is to use the `@keyResponder` decorator,
is to adopt the `on-key` helper and `on-key` element modifier to accomplish in templates what you
previously did in your Javascript files.
+Decorators require Ember 3.10 or higher. If you are using an Ember version earlier than that, you will
+need to stick with template helpers/modifiers and, if needed, the deprecated mixins API.
+
Deprecated:
```js
diff --git a/tests/dummy/app/templates/usage.hbs b/tests/dummy/app/templates/usage.hbs
index 97b2d3d07..7f94d16e7 100644
--- a/tests/dummy/app/templates/usage.hbs
+++ b/tests/dummy/app/templates/usage.hbs
@@ -129,6 +129,9 @@ export default class extends Component {
In addition to Glimmer Component classes, you can use these decorators on services,
routes, controllers, etc, provided that they are ES6 classes.
+Decorators require Ember 3.10 or higher. If you are using an Ember version earlier than that, you will
+need to stick with template helpers/modifiers and, if needed, the deprecated mixins API.
+
For “classic” Ember classes, the usage of the decorator imports is a little different:
```js
diff --git a/tests/integration/decorators/decorators-test.js b/tests/integration/decorators/decorators-test.js
index d8bd60d8b..379ce0cfe 100644
--- a/tests/integration/decorators/decorators-test.js
+++ b/tests/integration/decorators/decorators-test.js
@@ -4,6 +4,7 @@ import { setupRenderingTest } from 'ember-qunit';
import { render, triggerEvent } from '@ember/test-helpers';
import { hbs } from 'ember-cli-htmlbars';
import { keyDown, keyUp } from 'ember-keyboard/test-support/test-helpers';
+import { gte } from 'ember-compatibility-helpers';
module('Integration | decorators', function(hooks) {
setupRenderingTest(hooks);
@@ -161,148 +162,150 @@ module('Integration | decorators', function(hooks) {
});
});
- module('decorators with a classic component', function() {
- module('lifecycle', function(hooks) {
- hooks.beforeEach(function() {
- this.set('shouldRenderOnKeyHelper', false);
- this.renderWithConditional = () => {
- return render(hbs`
- {{#if this.shouldRenderOnKeyHelper}}
-
- {{/if}}
- `);
- }
- });
- test('does not trigger if helper is not rendered', async function(assert) {
- await this.renderWithConditional();
- await keyDown('shift+c');
- assert.ok(!onTriggerCalled, 'does not trigger action');
- });
- test('triggers if helper is rendered', async function(assert) {
- await this.renderWithConditional();
- this.set('shouldRenderOnKeyHelper', true);
- await keyDown('shift+c');
- assert.ok(onTriggerCalled, 'triggers action');
- });
- test('does not trigger if helper is no longer rendered', async function(assert) {
- this.set('shouldRenderOnKeyHelper', true);
- await this.renderWithConditional();
- this.set('shouldRenderOnKeyHelper', false);
- await keyDown('shift+c');
- assert.ok(!onTriggerCalled, 'does not trigger action');
- });
- });
- test('with an event specified', async function(assert) {
- let onTriggerCalledWith;
- this.set('onTrigger', (ev) => {
- onTriggerCalledWith = ev;
+ if (gte('3.10.0')) {
+ module('decorators with a classic component', function() {
+ module('lifecycle', function(hooks) {
+ hooks.beforeEach(function() {
+ this.set('shouldRenderOnKeyHelper', false);
+ this.renderWithConditional = () => {
+ return render(hbs`
+ {{#if this.shouldRenderOnKeyHelper}}
+
+ {{/if}}
+ `);
+ }
+ });
+ test('does not trigger if helper is not rendered', async function(assert) {
+ await this.renderWithConditional();
+ await keyDown('shift+c');
+ assert.ok(!onTriggerCalled, 'does not trigger action');
+ });
+ test('triggers if helper is rendered', async function(assert) {
+ await this.renderWithConditional();
+ this.set('shouldRenderOnKeyHelper', true);
+ await keyDown('shift+c');
+ assert.ok(onTriggerCalled, 'triggers action');
+ });
+ test('does not trigger if helper is no longer rendered', async function(assert) {
+ this.set('shouldRenderOnKeyHelper', true);
+ await this.renderWithConditional();
+ this.set('shouldRenderOnKeyHelper', false);
+ await keyDown('shift+c');
+ assert.ok(!onTriggerCalled, 'does not trigger action');
+ });
});
- await render(hbs``);
+ test('with an event specified', async function(assert) {
+ let onTriggerCalledWith;
+ this.set('onTrigger', (ev) => {
+ onTriggerCalledWith = ev;
+ });
+ await render(hbs``);
- await keyUp('shift+c');
- assert.ok(!onTriggerCalledWith, 'not called in keyup if event is not specified');
+ await keyUp('shift+c');
+ assert.ok(!onTriggerCalledWith, 'not called in keyup if event is not specified');
- await keyDown('ctrl+alt+KeyE');
- assert.ok(!onTriggerCalledWith, 'not called in keydown if keyup is specified');
+ await keyDown('ctrl+alt+KeyE');
+ assert.ok(!onTriggerCalledWith, 'not called in keydown if keyup is specified');
- await keyUp('ctrl+alt+KeyE');
- assert.ok(onTriggerCalledWith instanceof KeyboardEvent);
- });
- test('with multiple onKeys on one method', async function(assert) {
- let onTriggerCalledWith;
- this.set('onTrigger', (ev) => {
- onTriggerCalledWith = ev;
+ await keyUp('ctrl+alt+KeyE');
+ assert.ok(onTriggerCalledWith instanceof KeyboardEvent);
});
- await render(hbs``);
+ test('with multiple onKeys on one method', async function(assert) {
+ let onTriggerCalledWith;
+ this.set('onTrigger', (ev) => {
+ onTriggerCalledWith = ev;
+ });
+ await render(hbs``);
- await keyDown('alt+ArrowLeft');
- assert.ok(onTriggerCalledWith instanceof KeyboardEvent);
- onTriggerCalledWith = null;
+ await keyDown('alt+ArrowLeft');
+ assert.ok(onTriggerCalledWith instanceof KeyboardEvent);
+ onTriggerCalledWith = null;
- await keyDown('alt+ArrowRight');
- assert.ok(onTriggerCalledWith instanceof KeyboardEvent);
- });
- module('stopping propagation', function(hooks) {
- let triggered;
- hooks.beforeEach(function() {
- const keyboardService = this.owner.lookup('service:keyboard');
- keyboardService.set('isPropagationEnabled', true);
- triggered = [];
- this.set('trigger', (letter, stop, stopImmediate, event, ekEvent) => {
- triggered.push(letter);
- if (stop) {
- ekEvent.stopPropagation();
- }
- if (stopImmediate) {
- ekEvent.stopImmediatePropagation();
- }
- });
- });
- test('stopPropagation+stopImmediatePropagation', async function(assert) {
- await render(hbs`
-
-
-
- `);
- await triggerEvent(document.body, 'keydown', { code: 'Digit2' });
- assert.deepEqual(triggered, ['A2a']);
+ await keyDown('alt+ArrowRight');
+ assert.ok(onTriggerCalledWith instanceof KeyboardEvent);
});
+ module('stopping propagation', function(hooks) {
+ let triggered;
+ hooks.beforeEach(function() {
+ const keyboardService = this.owner.lookup('service:keyboard');
+ keyboardService.set('isPropagationEnabled', true);
+ triggered = [];
+ this.set('trigger', (letter, stop, stopImmediate, event, ekEvent) => {
+ triggered.push(letter);
+ if (stop) {
+ ekEvent.stopPropagation();
+ }
+ if (stopImmediate) {
+ ekEvent.stopImmediatePropagation();
+ }
+ });
+ });
+ test('stopPropagation+stopImmediatePropagation', async function(assert) {
+ await render(hbs`
+
+
+
+ `);
+ await triggerEvent(document.body, 'keydown', { code: 'Digit2' });
+ assert.deepEqual(triggered, ['A2a']);
+ });
- test('stopPropagation', async function(assert) {
- await render(hbs`
-
-
-
- `);
- await triggerEvent(document.body, 'keydown', { code: 'Digit2' });
- assert.deepEqual(triggered, ['A2a', 'A2b']);
- });
+ test('stopPropagation', async function(assert) {
+ await render(hbs`
+
+
+
+ `);
+ await triggerEvent(document.body, 'keydown', { code: 'Digit2' });
+ assert.deepEqual(triggered, ['A2a', 'A2b']);
+ });
- test('stopImmediatePropagation', async function(assert) {
- await render(hbs`
-
-
-
- `);
- await triggerEvent(document.body, 'keydown', { code: 'Digit2' });
- assert.deepEqual(triggered, ['A2a', 'A1']);
- });
+ test('stopImmediatePropagation', async function(assert) {
+ await render(hbs`
+
+
+
+ `);
+ await triggerEvent(document.body, 'keydown', { code: 'Digit2' });
+ assert.deepEqual(triggered, ['A2a', 'A1']);
+ });
- test('no stopping', async function(assert) {
- await render(hbs`
-
-
-
- `);
- await triggerEvent(document.body, 'keydown', { code: 'Digit2' });
- assert.deepEqual(triggered, ['A2a', 'A2b', 'A1']);
- });
- });
- module('activated param', function(hooks) {
- hooks.beforeEach(function() {
- this.set('isActivated', false);
- this.renderWithActivated = () => {
- return render(hbs``);
- }
- });
- test('does not trigger if helper is not activated', async function(assert) {
- await this.renderWithActivated();
- await keyDown('Digit2');
- assert.ok(!onTriggerCalled, 'does not trigger action');
- });
- test('triggers if helper is activated', async function(assert) {
- await this.renderWithActivated();
- this.set('isActivated', true);
- await keyDown('Digit2');
- assert.ok(onTriggerCalled, 'triggers action');
+ test('no stopping', async function(assert) {
+ await render(hbs`
+
+
+
+ `);
+ await triggerEvent(document.body, 'keydown', { code: 'Digit2' });
+ assert.deepEqual(triggered, ['A2a', 'A2b', 'A1']);
+ });
});
- test('does not trigger if helper is no longer activated', async function(assert) {
- this.set('shouldRenderOnKeyHelper', true);
- await this.renderWithActivated();
- this.set('isActivated', false);
- await keyDown('Digit2');
- assert.ok(!onTriggerCalled, 'does not trigger action');
+ module('activated param', function(hooks) {
+ hooks.beforeEach(function() {
+ this.set('isActivated', false);
+ this.renderWithActivated = () => {
+ return render(hbs``);
+ }
+ });
+ test('does not trigger if helper is not activated', async function(assert) {
+ await this.renderWithActivated();
+ await keyDown('Digit2');
+ assert.ok(!onTriggerCalled, 'does not trigger action');
+ });
+ test('triggers if helper is activated', async function(assert) {
+ await this.renderWithActivated();
+ this.set('isActivated', true);
+ await keyDown('Digit2');
+ assert.ok(onTriggerCalled, 'triggers action');
+ });
+ test('does not trigger if helper is no longer activated', async function(assert) {
+ this.set('shouldRenderOnKeyHelper', true);
+ await this.renderWithActivated();
+ this.set('isActivated', false);
+ await keyDown('Digit2');
+ assert.ok(!onTriggerCalled, 'does not trigger action');
+ });
});
});
- });
+ }
});
diff --git a/tests/integration/helpers/on-key-test.js b/tests/integration/helpers/on-key-test.js
index f82481c06..6bd80ae60 100644
--- a/tests/integration/helpers/on-key-test.js
+++ b/tests/integration/helpers/on-key-test.js
@@ -3,6 +3,7 @@ import { setupRenderingTest } from 'ember-qunit';
import { render, resetOnerror, setupOnerror, triggerEvent } from '@ember/test-helpers';
import { hbs } from 'ember-cli-htmlbars';
import { keyDown, keyPress, keyUp } from 'ember-keyboard/test-support/test-helpers';
+import { gte } from 'ember-compatibility-helpers';
module('Integration | Helper | on-key', function(hooks) {
setupRenderingTest(hooks);
@@ -212,18 +213,19 @@ module('Integration | Helper | on-key', function(hooks) {
module('error cases', function(hooks) {
hooks.afterEach(() => resetOnerror());
- // This doesn't work. I wish it did, but can't figure out why not.
- test('errors if invoked without a handler', async function(assert) {
- assert.expect(1);
- setupOnerror(function(error) {
- assert.strictEqual(
- error.message,
- "Assertion Failed: ember-keyboard: You must pass a function as the second argument to the `on-key` helper",
- 'error is thrown'
- );
- });
- await render(hbs`{{on-key "alt+a" doesNotExist}}`);
- await triggerEvent(document.body, 'keydown', { altKey: true, key: 'c' });
- });
+ if (gte('3.10.0')) {
+ test('errors if invoked without a handler', async function(assert) {
+ assert.expect(1);
+ setupOnerror(function(error) {
+ assert.strictEqual(
+ error.message,
+ "Assertion Failed: ember-keyboard: You must pass a function as the second argument to the `on-key` helper",
+ 'error is thrown'
+ );
+ });
+ await render(hbs`{{on-key "alt+a" doesNotExist}}`);
+ await triggerEvent(document.body, 'keydown', { altKey: true, key: 'c' });
+ });
+ }
});
});