Interaction helpers also accept HTMLElements as first argument

README.md

@@ -103,14 +103,14 @@ assert.equal($(find('.my-class')).attr('aria-owns'), '#id123')
 
 ## Helpers
 
-- `click(selector, eventOptions)`
-- `tap(selector, eventOptions)`
-- `fillIn(selector, text)`
+- `click(selectorOrHTMLElement, eventOptions)`
+- `tap(selectorOrHTMLElement, eventOptions)`
+- `fillIn(selectorOrHTMLElement, text)`
 - `find(selector, contextHTMLElement)` (query for an element in test DOM, `#ember-testing`)
 - `findAll(selector, contextHTMLElement)` (query for elements in test DOM, `#ember-testing`)
 - `findWithAssert(selector, contextHTMLElement)` (same as `find`, but raises Error if no result)
-- `keyEvent(selector, type, keyCode)` (type being `keydown`, `keyup` or `keypress`)
-- `triggerEvent(selector, type, options)`
+- `keyEvent(selectorOrHTMLElement, type, keyCode)` (type being `keydown`, `keyup` or `keypress`)
+- `triggerEvent(selectorOrHTMLElement, type, options)`
 
 ## Notes of `tap`
 

addon-test-support/click.js

@@ -19,13 +19,16 @@ export function clickEventSequence(el, options) {
 
 /*
   @method click
-  @param {String} selector
+  @param {String|HTMLElement} selector
   @param {Object} options
   @return {RSVP.Promise}
   @public
 */
 export function click(selector, options = {}) {
-  let el = findWithAssert(selector);
-  clickEventSequence(el, options);
+  if (selector instanceof HTMLElement) {
+    clickEventSequence(selector, options);
+  } else {
+    clickEventSequence(findWithAssert(selector), options);
+  }
   return wait();
 }

addon-test-support/fill-in.js

@@ -8,13 +8,18 @@ const { run } = Ember;
 
 /*
   @method fillIn
-  @param {String} selector
+  @param {String|HTMLElement} selector
   @param {String} text
   @return {RSVP.Promise}
   @public
 */
 export function fillIn(selector, text) {
-  let el = findWithAssert(selector);
+  let el;
+  if (selector instanceof HTMLElement) {
+    el = selector;
+  } else {
+    el = findWithAssert(selector);
+  }
   run(() => focus(el));
   run(() => el.value = text);
   run(() => fireEvent(el, 'input'));

addon-test-support/key-event.js

@@ -2,7 +2,7 @@ import { triggerEvent } from './trigger-event';
 
 /*
   @method keyEvent
-  @param {String} selector
+  @param {String|HTMLElement} selector
   @param {String} type
   @param {Number} keyCode
 */

addon-test-support/tap.js

@@ -8,15 +8,18 @@ const { run } = Ember;
 
 /*
   @method tap
-  @param {String} selector
+  @param {String|HTMLElement} selector
   @param {Object} options
   @return {RSVP.Promise}
   @public
 */
 export function tap(selector, options = {}) {
-  let el = findWithAssert(selector);
-  let touchstartEv;
-  let touchendEv;
+  let el, touchstartEv, touchendEv;
+  if (selector instanceof HTMLElement) {
+    el = selector;
+  } else {
+    el = findWithAssert(selector);
+  }
   run(() => touchstartEv = fireEvent(el, 'touchstart', options));
   run(() => touchendEv = fireEvent(el, 'touchend', options));
   if (!touchstartEv.defaultPrevented && !touchendEv.defaultPrevented) {

addon-test-support/trigger-event.js

@@ -7,14 +7,19 @@ const { run } = Ember;
 
 /*
   @method triggerEvent
-  @param {String} selector
+  @param {String|HTMLElement} selector
   @param {String} type
   @param {Object} options
   @return {RSVP.Promise}
   @public
 */
 export function triggerEvent(selector, type, options) {
-  let element = findWithAssert(selector);
-  run(() => fireEvent(element, type, options));
+  let el;
+  if (selector instanceof HTMLElement) {
+    el = selector;
+  } else {
+    el = findWithAssert(selector);
+  }
+  run(() => fireEvent(el, type, options));
   return wait();
 }

tests/integration/click-test.js

@@ -39,3 +39,14 @@ test('It fires mousedown, focus, mouseup and click events on the element with th
   `);
   click('.target-element');
 });
+
+test('It accepts an HTMLElement as first argument', function(assert) {
+  assert.expect(2);
+  this.onClick = (e) => {
+    assert.ok(true, 'a click event is fired');
+    assert.ok(e instanceof window.Event, 'It receives a native event');
+  };
+
+  this.render(hbs`<input class="target-element" onclick={{onClick}} />`);
+  click(document.querySelector('.target-element'));
+});

tests/integration/fill-in-test.js

@@ -38,3 +38,14 @@ test('It fires a focus, updates the value, fires input and fires change on the e
   `);
   fillIn('.target-element', 'new value');
 });
+
+test('It accepts an HTMLElement as first argument', function(assert) {
+  assert.expect(2);
+  this.onInput = (e) => {
+    assert.ok(true, 'a click event is fired');
+    assert.ok(e instanceof window.Event, 'It receives a native event');
+  };
+
+  this.render(hbs`<input class="target-element" oninput={{onInput}} />`);
+  fillIn(document.querySelector('.target-element'), 'foo');
+});

tests/integration/key-event-test.js

@@ -50,3 +50,14 @@ test('It can fire keypress events', function(assert) {
   this.render(hbs`<input class="target-element" onkeypress={{onKeyPress}} />`);
   keyEvent('.target-element', 'keypress', 40);
 });
+
+test('It accepts an HTMLElement as first argument', function(assert) {
+  assert.expect(2);
+  this.onKeyDown = (e) => {
+    assert.ok(true, 'a click event is fired');
+    assert.ok(e instanceof window.Event, 'It receives a native event');
+  };
+
+  this.render(hbs`<input class="target-element" onkeydown={{onKeyDown}} />`);
+  keyEvent(document.querySelector('.target-element'), 'keydown', 13);
+});

tests/integration/tap-test.js

@@ -118,3 +118,14 @@ test('It the touchend event is defaultPrevented, the focus and mouse events are
 
   tap('.target-element');
 });
+
+test('It accepts an HTMLElement as first argument', function(assert) {
+  assert.expect(2);
+  this.onTouchStart = (e) => {
+    assert.ok(true, 'a click event is fired');
+    assert.ok(e instanceof window.Event, 'It receives a native event');
+  };
+
+  this.render(hbs`<input class="target-element" ontouchstart={{onTouchStart}} />`);
+  tap(document.querySelector('.target-element'));
+});

tests/integration/trigger-event-test.js

@@ -17,3 +17,14 @@ test('It fires events of the given type, no questions asked', function(assert) {
   this.render(hbs`<input class="target-element" onmouseenter={{onMouseEnter}} />`);
   triggerEvent('.target-element', 'mouseenter');
 });
+
+test('It accepts an HTMLElement as first argument', function(assert) {
+  assert.expect(2);
+  this.onMouseEnter = (e) => {
+    assert.ok(true, 'a click event is fired');
+    assert.ok(e instanceof window.Event, 'It receives a native event');
+  };
+
+  this.render(hbs`<input class="target-element" onmouseenter={{onMouseEnter}} />`);
+  triggerEvent(document.querySelector('.target-element'), 'mouseenter');
+});