How to use el.click method in Appium

Best JavaScript code snippet using appium

Run Appium automation tests on LambdaTest cloud grid

Perform automation testing on 3000+ real desktop and mobile devices online.

events.test.js

Source: events.test.js Github

copy
1/* eslint-env qunit */
2import * as Events from '../../src/js/utils/events.js';
3import document from 'global/document';
4import log from '../../src/js/utils/log.js';
5
6QUnit.module('Events');
7
8QUnit.test('should add and remove an event listener to an element', function(assert) {
9  assert.expect(1);
10
11  const el = document.createElement('div');
12  const listener = function() {
13    assert.ok(true, 'Click Triggered');
14  };
15
16  Events.on(el, 'click', listener);
17  // 1 click
18  Events.trigger(el, 'click');
19  Events.off(el, 'click', listener);
20  // No click should happen.
21  Events.trigger(el, 'click');
22});
23
24QUnit.test('should add and remove multiple event listeners to an element with a single call', function(assert) {
25  assert.expect(6);
26
27  const el = document.createElement('div');
28  const listener = function() {
29    assert.ok(true, 'Callback triggered');
30  };
31
32  Events.on(el, ['click', 'event1', 'event2'], listener);
33
34  Events.trigger(el, 'click');
35  Events.trigger(el, 'click');
36  Events.off(el, 'click', listener);
37  // No click should happen.
38  Events.trigger(el, 'click');
39
40  Events.trigger(el, 'event1');
41  Events.trigger(el, 'event1');
42  Events.off(el, 'event1', listener);
43  // No event1 should happen.
44  Events.trigger(el, 'event1');
45
46  Events.trigger(el, 'event2');
47  Events.trigger(el, 'event2');
48  Events.off(el, 'event2', listener);
49  // No event2 should happen.
50  Events.trigger(el, 'event2');
51
52  Events.off(el, ['click', 'event1', 'event2'], listener);
53});
54
55QUnit.test('should be possible to pass data when you trigger an event', function(assert) {
56  assert.expect(6);
57  const el = document.createElement('div');
58  const fakeData1 = 'Fake Data 1';
59  const fakeData2 = {txt: 'Fake Data 2'};
60
61  const listener = function(evt, hash) {
62    assert.ok(true, 'Callback triggered');
63    assert.deepEqual(fakeData1, hash.d1, 'Shoulbe be passed to the handler');
64    assert.deepEqual(fakeData2, hash.d2, 'Shoulbe be passed to the handler');
65  };
66
67  Events.on(el, ['event1', 'event2'], listener);
68  Events.trigger(el, 'event1', { d1: fakeData1, d2: fakeData2});
69  Events.trigger(el, 'event2', { d1: fakeData1, d2: fakeData2});
70
71  Events.off(el, ['event1', 'event2'], listener);
72});
73
74QUnit.test('should remove all listeners of a type', function(assert) {
75  const el = document.createElement('div');
76  let clicks = 0;
77  const listener = function() {
78    clicks++;
79  };
80  const listener2 = function() {
81    clicks++;
82  };
83
84  Events.on(el, 'click', listener);
85  Events.on(el, 'click', listener2);
86  // 2 clicks
87  Events.trigger(el, 'click');
88
89  assert.ok(clicks === 2, 'both click listeners fired');
90
91  Events.off(el, 'click');
92  // No click should happen.
93  Events.trigger(el, 'click');
94
95  assert.ok(clicks === 2, 'no click listeners fired');
96});
97
98QUnit.test('should remove all listeners of an array of types', function(assert) {
99  const el = document.createElement('div');
100  let calls = 0;
101  const listener = function() {
102    calls++;
103  };
104  const listener2 = function() {
105    calls++;
106  };
107
108  Events.on(el, ['click', 'event1'], listener);
109  Events.on(el, ['click', 'event1'], listener2);
110  // 2 calls
111  Events.trigger(el, 'click');
112  // 2 calls
113  Events.trigger(el, 'event1');
114
115  assert.ok(calls === 4, 'both click listeners fired');
116
117  Events.off(el, ['click', 'event1']);
118  // No click should happen.
119  Events.trigger(el, 'click');
120  // No event1 should happen.
121  Events.trigger(el, 'event1');
122
123  assert.ok(calls === 4, 'no event listeners fired');
124});
125
126QUnit.test('should remove all listeners from an element', function(assert) {
127  assert.expect(2);
128
129  const el = document.createElement('div');
130  const listener = function() {
131    assert.ok(true, 'Fake1 Triggered');
132  };
133  const listener2 = function() {
134    assert.ok(true, 'Fake2 Triggered');
135  };
136
137  Events.on(el, 'fake1', listener);
138  Events.on(el, 'fake2', listener2);
139
140  Events.trigger(el, 'fake1');
141  Events.trigger(el, 'fake2');
142
143  Events.off(el);
144
145  // No listener should happen.
146  Events.trigger(el, 'fake1');
147  Events.trigger(el, 'fake2');
148
149  Events.off(el, 'fake1', listener);
150  Events.off(el, 'fake2', listener2);
151});
152
153QUnit.test('should listen only once', function(assert) {
154  assert.expect(1);
155
156  const el = document.createElement('div');
157  const listener = function() {
158    assert.ok(true, 'Click Triggered');
159  };
160
161  Events.one(el, 'click', listener);
162  // 1 click
163  Events.trigger(el, 'click');
164  // No click should happen.
165  Events.trigger(el, 'click');
166});
167
168QUnit.test('should listen only once in multiple events from a single call', function(assert) {
169  assert.expect(3);
170
171  const el = document.createElement('div');
172  const listener = function() {
173    assert.ok(true, 'Callback Triggered');
174  };
175
176  Events.one(el, ['click', 'event1', 'event2'], listener);
177  // 1 click
178  Events.trigger(el, 'click');
179  // No click should happen.
180  Events.trigger(el, 'click');
181  // event1 must be handled.
182  Events.trigger(el, 'event1');
183  // No event1 should be handled.
184  Events.trigger(el, 'event1');
185  // event2 must be handled.
186  Events.trigger(el, 'event2');
187  // No event2 should be handled.
188  Events.trigger(el, 'event2');
189});
190
191QUnit.test('should stop immediate propagtion', function(assert) {
192  assert.expect(1);
193
194  const el = document.createElement('div');
195
196  Events.on(el, 'test', function(e) {
197    assert.ok(true, 'First listener fired');
198    e.stopImmediatePropagation();
199  });
200
201  Events.on(el, 'test', function(e) {
202    assert.ok(false, 'Second listener fired');
203  });
204
205  Events.trigger(el, 'test');
206  Events.off(el, 'test');
207});
208
209QUnit.test('should bubble up DOM unless bubbles == false', function(assert) {
210  assert.expect(3);
211
212  const outer = document.createElement('div');
213  const inner = outer.appendChild(document.createElement('div'));
214
215  // Verify that if bubbles === true, event bubbles up dom.
216  Events.on(inner, 'bubbles', function(e) {
217    assert.ok(true, 'Inner listener fired');
218  });
219  Events.on(outer, 'bubbles', function(e) {
220    assert.ok(true, 'Outer listener fired');
221  });
222  Events.trigger(inner, { type: 'bubbles', target: inner, bubbles: true });
223
224  // Only change 'bubbles' to false, and verify only inner handler is called.
225  Events.on(inner, 'nobub', function(e) {
226    assert.ok(true, 'Inner listener fired');
227  });
228  Events.on(outer, 'nobub', function(e) {
229    assert.ok(false, 'Outer listener fired');
230  });
231  Events.trigger(inner, { type: 'nobub', target: inner, bubbles: false });
232
233  Events.off(inner, 'bubbles');
234  Events.off(outer, 'bubbles');
235  Events.off(inner, 'nobub');
236  Events.off(outer, 'nobub');
237});
238
239QUnit.test('should have a defaultPrevented property on an event that was prevent from doing default action', function(assert) {
240  assert.expect(2);
241
242  const el = document.createElement('div');
243
244  Events.on(el, 'test', function(e) {
245    assert.ok(true, 'First listener fired');
246    e.preventDefault();
247  });
248
249  Events.on(el, 'test', function(e) {
250    assert.ok(e.defaultPrevented, 'Should have `defaultPrevented` to signify preventDefault being called');
251  });
252
253  Events.trigger(el, 'test');
254  Events.off(el, 'test');
255});
256
257QUnit.test('should have relatedTarget correctly set on the event', function(assert) {
258  assert.expect(2);
259
260  const el1 = document.createElement('div');
261  const el2 = document.createElement('div');
262  const relatedEl = document.createElement('div');
263
264  Events.on(el1, 'click', function(e) {
265    assert.equal(e.relatedTarget, relatedEl, 'relatedTarget is set for all browsers when related element is set on the event');
266  });
267
268  Events.trigger(el1, { type: 'click', relatedTarget: relatedEl });
269
270  Events.on(el2, 'click', function(e) {
271    assert.equal(e.relatedTarget, null, 'relatedTarget is null when none is provided');
272  });
273
274  Events.trigger(el2, { type: 'click', relatedTarget: undefined });
275
276  Events.off(el1, 'click');
277  Events.off(el2, 'click');
278});
279
280QUnit.test('should execute remaining handlers after an exception in an event handler', function(assert) {
281  assert.expect(1);
282
283  const oldLogError = log.error;
284
285  log.error = function() {};
286
287  const el = document.createElement('div');
288  const listener1 = function() {
289    throw new Error('GURU MEDITATION ERROR');
290  };
291  const listener2 = function() {
292    assert.ok(true, 'Click Triggered');
293  };
294
295  Events.on(el, 'click', listener1);
296  Events.on(el, 'click', listener2);
297
298  // 1 click
299  Events.trigger(el, 'click');
300
301  log.error = oldLogError;
302
303  Events.off(el, 'click');
304});
305
306QUnit.test('trigger with an object should set the correct target property', function(assert) {
307  const el = document.createElement('div');
308
309  Events.on(el, 'click', function(e) {
310    assert.equal(e.target, el, 'the event object target should be our element');
311  });
312  Events.trigger(el, { type: 'click'});
313
314  Events.off(el, 'click');
315});
316
317QUnit.test('retrigger with a string should use the new element as target', function(assert) {
318  const el1 = document.createElement('div');
319  const el2 = document.createElement('div');
320
321  Events.on(el2, 'click', function(e) {
322    assert.equal(e.target, el2, 'the event object target should be the new element');
323  });
324  Events.on(el1, 'click', function(e) {
325    Events.trigger(el2, 'click');
326  });
327  Events.trigger(el1, 'click');
328  Events.trigger(el1, {type: 'click'});
329
330  Events.off(el1, 'click');
331  Events.off(el2, 'click');
332});
333
334QUnit.test('retrigger with an object should use the old element as target', function(assert) {
335  const el1 = document.createElement('div');
336  const el2 = document.createElement('div');
337
338  Events.on(el2, 'click', function(e) {
339    assert.equal(e.target, el1, 'the event object target should be the old element');
340  });
341  Events.on(el1, 'click', function(e) {
342    Events.trigger(el2, e);
343  });
344  Events.trigger(el1, 'click');
345  Events.trigger(el1, {type: 'click'});
346
347  Events.off(el1, 'click');
348  Events.off(el2, 'click');
349});
350
351QUnit.test('should listen only once for any', function(assert) {
352  const el = document.createElement('div');
353  let triggered = 0;
354  const listener = () => triggered++;
355
356  Events.any(el, 'click', listener);
357  assert.equal(triggered, 0, 'listener was not yet triggered');
358  // 1 click
359  Events.trigger(el, 'click');
360
361  assert.equal(triggered, 1, 'listener was triggered');
362  // No click should happen.
363  Events.trigger(el, 'click');
364  assert.equal(triggered, 1, 'listener was not triggered again');
365});
366
367QUnit.test('only the first event should call listener via any', function(assert) {
368  const el = document.createElement('div');
369  let triggered = 0;
370  const listener = () => triggered++;
371
372  Events.any(el, ['click', 'event1', 'event2'], listener);
373  assert.equal(triggered, 0, 'listener was not yet triggered');
374
375  // 1 click
376  Events.trigger(el, 'click');
377  assert.equal(triggered, 1, 'listener was triggered');
378  // nothing below here should trigger the Callback
379  Events.trigger(el, 'click');
380  Events.trigger(el, 'event1');
381  Events.trigger(el, 'event1');
382  Events.trigger(el, 'event2');
383  Events.trigger(el, 'event2');
384  assert.equal(triggered, 1, 'listener was not triggered again');
385});
386
Full Screen

events.js

Source: events.js Github

copy
1var tape = require("tape");
2
3var on = require("../../lib/events/on");
4var off = require("../../lib/events/off");
5var trigger = require("../../lib/events/trigger");
6
7var el = document.createElement("div");
8var el2 = document.createElement("span");
9var els = [el, el2];
10
11var classCb = function() {
12  this.className += "on";
13};
14var attrCb = function() {
15  this.setAttribute("data-state", this.getAttribute("data-state") + "ON");
16};
17
18tape("test events on/off/trigger for one element, one event", function(t) {
19  el.className = "";
20  on(el, "click", classCb);
21  trigger(el, "click");
22  t.equal(el.className, "on", "attached callback has been fired properly");
23
24  el.className = "off";
25  off(el, "click", classCb);
26  trigger(el, "click");
27  t.equal(el.className, "off", "triggered event didn't fire detached callback");
28
29  t.end();
30});
31
32tape("test events on/off/trigger for multiple elements, one event", function(
33  t
34) {
35  el.className = "";
36  el2.className = "";
37
38  on(els, "click", classCb);
39  trigger(els, "click");
40  t.equal(
41    el.className,
42    "on",
43    "attached callback has been fired properly on the first element"
44  );
45  t.equal(
46    el2.className,
47    "on",
48    "attached callback has been fired properly on the second element"
49  );
50
51  el.className = "off";
52  el2.className = "off";
53  off(els, "click", classCb);
54  trigger(els, "click");
55  t.equal(
56    el.className,
57    "off",
58    "triggered event didn't fire detached callback on the first element"
59  );
60  t.equal(
61    el2.className,
62    "off",
63    "triggered event didn't fire detached callback on the second element"
64  );
65
66  t.end();
67});
68
69tape("test events on/off/trigger for one element, multiple events", function(
70  t
71) {
72  el.className = "";
73  on(el, "click mouseover", classCb);
74  trigger(el, "click mouseover");
75  t.equal(el.className, "onon", "attached callbacks have been fired properly");
76
77  el.className = "off";
78  off(el, "click mouseover", classCb);
79  trigger(el, "click mouseover");
80  t.equal(
81    el.className,
82    "off",
83    "triggered events didn't fire detached callback"
84  );
85
86  t.end();
87});
88
89tape(
90  "test events on/off/trigger for multiple elements, multiple events",
91  function(t) {
92    el.className = "";
93    el2.className = "";
94    el.setAttribute("data-state", "");
95    el2.setAttribute("data-state", "");
96    on(els, "click mouseover", classCb);
97    on(els, "resize scroll", attrCb);
98    trigger(els, "click mouseover resize scroll");
99    t.equal(
100      el.className,
101      "onon",
102      "attached callbacks has been fired properly on the first element"
103    );
104    t.equal(
105      el.getAttribute("data-state"),
106      "ONON",
107      "attached callbacks has been fired properly on the first element"
108    );
109    t.equal(
110      el2.className,
111      "onon",
112      "attached callbacks has been fired properly on the second element"
113    );
114    t.equal(
115      el2.getAttribute("data-state"),
116      "ONON",
117      "attached callbacks has been fired properly on the second element"
118    );
119
120    el.className = "off";
121    el2.className = "off";
122    el.setAttribute("data-state", "off");
123    el2.setAttribute("data-state", "off");
124    off(els, "click mouseover", classCb);
125    off(els, "resize scroll", attrCb);
126    trigger(els, "click mouseover resize scroll");
127    t.equal(
128      el.className,
129      "off",
130      "triggered events didn't fire detached callbacks on the first element"
131    );
132    t.equal(
133      el.getAttribute("data-state"),
134      "off",
135      "triggered events didn't fire detached callbacks on the first element"
136    );
137    t.equal(
138      el2.className,
139      "off",
140      "triggered events didn't fire detached callbacks on the first element"
141    );
142    t.equal(
143      el2.getAttribute("data-state"),
144      "off",
145      "triggered events didn't fire detached callbacks on the first element"
146    );
147
148    t.end();
149  }
150);
151
152tape("test events on top level elements", function(t) {
153  var el = document;
154
155  el.className = "";
156  on(el, "click", classCb);
157  trigger(el, "click");
158  t.equal(
159    el.className,
160    "on",
161    "attached callback has been fired properly on document"
162  );
163
164  el = window;
165
166  el.className = "";
167  // With jsdom, the default this is global, not window, so we need to explicitly bind to window.
168  on(el, "click", classCb.bind(window));
169  trigger(el, "click");
170  t.equal(
171    el.className,
172    "on",
173    "attached callback has been fired properly on window"
174  );
175
176  t.end();
177});
178
Full Screen

Accelerate Your Automation Test Cycles With LambdaTest

Leverage LambdaTest’s cloud-based platform to execute your automation tests in parallel and trim down your test execution time significantly. Your first 100 automation testing minutes are on us.

Try LambdaTest

Run JavaScript Tests on LambdaTest Cloud Grid

Execute automation tests with Appium on a cloud-based Grid of 3000+ real browsers and operating systems for both web and mobile applications.

Test now for Free
LambdaTestX

We use cookies to give you the best experience. Cookies help to provide a more personalized experience and relevant advertising for you, and web analytics for us. Learn More in our Cookies policy, Privacy & Terms of service

Allow Cookie
Sarah

I hope you find the best code examples for your project.

If you want to accelerate automated browser testing, try LambdaTest. Your first 100 automation testing minutes are FREE.

Sarah Elson (Product & Growth Lead)