How to use targetEl method in ng-mocks

Best JavaScript code snippet using ng-mocks

Gesture.js

Source:Gesture.js Github

copy

Full Screen

1topSuite("Ext.event.publisher.Gesture", function() {2 var helper = Ext.testHelper,3 targetEl;4 beforeEach(function() {5 targetEl = Ext.getBody().createChild({6 id: 'target'7 });8 });9 afterEach(function() {10 if (targetEl) {11 targetEl.destroy();12 targetEl = null;13 }14 });15 describe("removing the target el before a gesture is complete", function() {16 var GC = Ext.dom.GarbageCollector,17 interval = GC.interval;18 beforeEach(function() {19 spyOn(targetEl, 'clearListeners');20 GC.interval = 60;21 GC.pause();22 GC.resume();23 });24 afterEach(function() {25 GC.interval = interval;26 GC.pause();27 GC.resume();28 });29 function removeTarget() {30 document.body.removeChild(targetEl.dom);31 }32 function expectCollected(collected) {33 if (collected) {34 expect('target' in Ext.cache).toBe(false);35 expect(targetEl.clearListeners).toHaveBeenCalled();36 }37 else {38 expect('target' in Ext.cache).toBe(true);39 expect(targetEl.clearListeners).not.toHaveBeenCalled();40 }41 }42 (Ext.toolkit === 'classic' ? it : xit)("should not garbage collect the target element until the current gesture is complete", function() {43 runs(function() {44 helper.touchStart(targetEl, { id: 1, x: 10, y: 10 });45 helper.touchMove(targetEl, { id: 1, x: 15, y: 15 });46 removeTarget();47 });48 waits(90);49 runs(function() {50 expectCollected(false);51 helper.touchEnd(Ext.supports.TouchEvents ? targetEl : document.body, { id: 1, x: 15, y: 15 });52 });53 waits(90);54 runs(function() {55 expectCollected(true);56 });57 });58 });59 describe("order of recognizers", function() {60 it("should invoke the recognizers in priority order when an event is fired", function() {61 var gesture = Ext.event.gesture,62 Drag = gesture.Drag.instance,63 Tap = gesture.Tap.instance,64 DoubleTap = gesture.DoubleTap.instance,65 LongPress = gesture.LongPress.instance,66 EdgeSwipe = gesture.EdgeSwipe.instance,67 Swipe = gesture.Swipe.instance,68 Pinch = gesture.Pinch.instance,69 Rotate = gesture.Rotate.instance,70 result = [];71 Drag.onStart = Tap.onStart = DoubleTap.onStart = LongPress.onStart = Swipe.onStart =72 Pinch.onStart = Rotate.onStart = EdgeSwipe.onStart = function() {73 result.push([this.$className, this.priority]);74 };75 Ext.testHelper.touchStart(document.body, { id: 1, x: 100, y: 100 });76 expect(result[0]).toEqual(['Ext.event.gesture.Drag', 100]);77 expect(result[1]).toEqual(['Ext.event.gesture.Tap', 200]);78 expect(result[2]).toEqual(['Ext.event.gesture.DoubleTap', 300]);79 expect(result[3]).toEqual(['Ext.event.gesture.LongPress', 400]);80 expect(result[4]).toEqual(['Ext.event.gesture.EdgeSwipe', 500]);81 expect(result[5]).toEqual(['Ext.event.gesture.Swipe', 600]);82 expect(result[6]).toEqual(['Ext.event.gesture.Pinch', 700]);83 expect(result[7]).toEqual(['Ext.event.gesture.Rotate', 800]);84 Ext.testHelper.touchEnd(document.body);85 delete Drag.onStart;86 delete Tap.onStart;87 delete DoubleTap.onStart;88 delete LongPress.onStart;89 delete EdgeSwipe.onStart;90 delete Swipe.onStart;91 delete Pinch.onStart;92 delete Rotate.onStart;93 });94 });95 // window.onerror method of catching exceptions in synthetic event handlers96 // doesn't work in IE8 for some reason :(97 (Ext.isIE8m ? xdescribe : describe)("exceptions in recognizers", function() {98 var gesture = Ext.event.publisher.Gesture.instance;99 beforeEach(function() {100 targetEl.on('tap', function() {101 throw new Error("This error is caught but will show in console IE");102 });103 });104 it("should not allow the exception to propagate", function() {105 expect(function() {106 helper.touchStart(targetEl, { id: 1, x: 1, y: 1 });107 helper.touchEnd(targetEl, { id: 1, x: 1, y: 1 });108 }).toThrow('This error is caught but will show in console IE');109 });110 it("should finish gesture when an exception is thrown in recognizer", function() {111 expect(function() {112 helper.touchStart(targetEl, { id: 1, x: 1, y: 1 });113 helper.touchEnd(targetEl, { id: 1, x: 1, y: 1 });114 }).toThrow('This error is caught but will show in console IE');115 expect(gesture.isStarted).toBe(false);116 });117 });118 describe("bubbling", function() {119 var childEl;120 beforeEach(function() {121 childEl = targetEl.createChild({122 id: 'child'123 });124 });125 afterEach(function() {126 childEl.destroy();127 });128 it("should bubble in the correct order", function() {129 var out = [],130 handler = function(e) {131 out.push(e.currentTarget.id + '-' + e.type);132 },133 listeners = {134 dragend: handler,135 touchend: handler,136 drag: handler,137 touchmove: handler,138 dragstart: handler,139 touchstart: handler140 };141 targetEl.on(listeners);142 childEl.on(listeners);143 helper.touchStart(childEl, { id: 1, x: 10, y: 15 });144 helper.touchMove(childEl, { id: 1, x: 20, y: 35 });145 helper.touchMove(childEl, { id: 1, x: 30, y: 45 });146 helper.touchEnd(childEl, { id: 1, x: 30, y: 45 });147 expect(out).toEqual([148 'child-touchstart',149 'target-touchstart',150 'child-touchmove',151 'child-dragstart',152 'child-drag',153 'target-touchmove',154 'target-dragstart',155 'target-drag',156 'child-touchmove',157 'child-drag',158 'target-touchmove',159 'target-drag',160 'child-touchend',161 'child-dragend',162 'target-touchend',163 'target-dragend'164 ]);165 });166 it("should stop propagation of the dom event", function() {167 var out = [],168 handler = function(e) {169 if (e.type === 'touchmove') {170 e.stopPropagation();171 }172 out.push(e.currentTarget.id + '-' + e.type);173 },174 listeners = {175 dragcancel: handler,176 swipecancel: handler,177 dragend: handler,178 touchend: handler,179 swipe: handler,180 drag: handler,181 touchmove: handler,182 swipestart: handler,183 dragstart: handler,184 touchstart: handler185 };186 targetEl.on(listeners);187 childEl.on(listeners);188 helper.touchStart(childEl, { id: 1, x: 10, y: 15 });189 helper.touchMove(childEl, { id: 1, x: 50, y: 15 });190 helper.touchMove(childEl, { id: 1, x: 200, y: 15 });191 helper.touchEnd(childEl, { id: 1, x: 200, y: 15 });192 expect(out).toEqual([193 'child-touchstart',194 'target-touchstart',195 'child-touchmove',196 'child-dragstart',197 'child-drag',198 'child-swipestart',199 'target-dragstart',200 'target-drag',201 'target-swipestart',202 'child-touchmove',203 'child-drag',204 'target-drag',205 'child-touchend',206 'child-dragend',207 'child-swipe',208 'target-touchend',209 'target-dragend',210 'target-swipe'211 ]);212 });213 it("should stop propagation of a gesture event", function() {214 var out = [],215 handler = function(e) {216 if (e.type === 'drag') {217 e.stopPropagation();218 }219 out.push(e.currentTarget.id + '-' + e.type);220 },221 listeners = {222 dragcancel: handler,223 swipecancel: handler,224 dragend: handler,225 touchend: handler,226 swipe: handler,227 drag: handler,228 touchmove: handler,229 swipestart: handler,230 dragstart: handler,231 touchstart: handler232 };233 targetEl.on(listeners);234 childEl.on(listeners);235 helper.touchStart(childEl, { id: 1, x: 10, y: 15 });236 helper.touchMove(childEl, { id: 1, x: 50, y: 15 });237 helper.touchMove(childEl, { id: 1, x: 200, y: 15 });238 helper.touchEnd(childEl, { id: 1, x: 200, y: 15 });239 expect(out).toEqual([240 'child-touchstart',241 'target-touchstart',242 'child-touchmove',243 'child-dragstart',244 'child-drag',245 'child-swipestart',246 'target-touchmove',247 'target-dragstart',248 'target-swipestart',249 'child-touchmove',250 'child-drag',251 'target-touchmove',252 'child-touchend',253 'child-dragend',254 'child-swipe',255 'target-touchend',256 'target-dragend',257 'target-swipe'258 ]);259 });260 });261 describe("claimGesture", function() {262 var childEl;263 beforeEach(function() {264 childEl = targetEl.createChild({265 id: 'child'266 });267 });268 afterEach(function() {269 childEl.destroy();270 });271 it("should fire multiple gestures in tandem when no gesture is claimed", function() {272 var out = [],273 handler = function(e) {274 out.push(e.currentTarget.id + '-' + e.type);275 },276 listeners = {277 dragcancel: handler,278 swipecancel: handler,279 dragend: handler,280 touchend: handler,281 swipe: handler,282 drag: handler,283 touchmove: handler,284 swipestart: handler,285 dragstart: handler,286 touchstart: handler287 };288 targetEl.on(listeners);289 childEl.on(listeners);290 helper.touchStart(childEl, { id: 1, x: 10, y: 15 });291 helper.touchMove(childEl, { id: 1, x: 50, y: 15 });292 helper.touchMove(childEl, { id: 1, x: 200, y: 15 });293 helper.touchEnd(childEl, { id: 1, x: 200, y: 15 });294 expect(out).toEqual([295 'child-touchstart',296 'target-touchstart',297 'child-touchmove',298 'child-dragstart',299 'child-drag',300 'child-swipestart',301 'target-touchmove',302 'target-dragstart',303 'target-drag',304 'target-swipestart',305 'child-touchmove',306 'child-drag',307 'target-touchmove',308 'target-drag',309 'child-touchend',310 'child-dragend',311 'child-swipe',312 'target-touchend',313 'target-dragend',314 'target-swipe'315 ]);316 });317 it("should cancel swipe events when drag is claimed", function() {318 var out = [],319 claimed = false,320 handler = function(e) {321 if (!claimed && e.type === 'drag') {322 e.claimGesture();323 claimed = true;324 }325 out.push(e.currentTarget.id + '-' + e.type);326 },327 listeners = {328 dragcancel: handler,329 swipecancel: handler,330 dragend: handler,331 touchend: handler,332 swipe: handler,333 drag: handler,334 touchmove: handler,335 swipestart: handler,336 dragstart: handler,337 touchstart: handler338 };339 targetEl.on(listeners);340 childEl.on(listeners);341 helper.touchStart(childEl, { id: 1, x: 10, y: 15 });342 helper.touchMove(childEl, { id: 1, x: 50, y: 15 });343 helper.touchMove(childEl, { id: 1, x: 200, y: 15 });344 helper.touchEnd(childEl, { id: 1, x: 200, y: 15 });345 expect(out).toEqual([346 'child-touchstart',347 'target-touchstart',348 'child-touchmove',349 'child-dragstart',350 'child-drag',351 'child-swipecancel',352 'target-swipecancel',353 'target-touchmove',354 'target-dragstart',355 'target-drag',356 'child-touchmove',357 'child-drag',358 'target-touchmove',359 'target-drag',360 'child-touchend',361 'child-dragend',362 'target-touchend',363 'target-dragend'364 ]);365 });366 it("should cancel drag events when swipe is claimed", function() {367 var out = [],368 claimed = false,369 handler = function(e) {370 if (!claimed && e.type === 'swipestart') {371 e.claimGesture();372 claimed = true;373 }374 out.push(e.currentTarget.id + '-' + e.type);375 },376 listeners = {377 dragcancel: handler,378 swipecancel: handler,379 dragend: handler,380 touchend: handler,381 swipe: handler,382 drag: handler,383 touchmove: handler,384 swipestart: handler,385 dragstart: handler,386 touchstart: handler387 };388 targetEl.on(listeners);389 childEl.on(listeners);390 helper.touchStart(childEl, { id: 1, x: 10, y: 15 });391 helper.touchMove(childEl, { id: 1, x: 50, y: 15 });392 helper.touchMove(childEl, { id: 1, x: 200, y: 15 });393 helper.touchEnd(childEl, { id: 1, x: 200, y: 15 });394 // swipe comes after drag in priority ranking.395 // therefore we expect drag events to fire prior to the swipestart listener396 // that claims the event397 expect(out).toEqual([398 'child-touchstart',399 'target-touchstart',400 'child-touchmove',401 'child-dragstart',402 'child-drag',403 'child-swipestart',404 'child-dragcancel',405 'target-dragcancel',406 'target-touchmove',407 'target-swipestart',408 'child-touchmove',409 'target-touchmove',410 'child-touchend',411 'child-swipe',412 'target-touchend',413 'target-swipe'414 ]);415 });416 it("should not fire gesture events when touchstart is claimed", function() {417 var out = [],418 claimed = false,419 handler = function(e) {420 if (!claimed && e.type === 'touchstart') {421 e.claimGesture();422 claimed = true;423 }424 out.push(e.currentTarget.id + '-' + e.type);425 },426 listeners = {427 dragcancel: handler,428 swipecancel: handler,429 dragend: handler,430 touchend: handler,431 swipe: handler,432 drag: handler,433 touchmove: handler,434 swipestart: handler,435 dragstart: handler,436 touchstart: handler437 };438 targetEl.on(listeners);439 childEl.on(listeners);440 helper.touchStart(childEl, { id: 1, x: 10, y: 15 });441 helper.touchMove(childEl, { id: 1, x: 50, y: 15 });442 helper.touchMove(childEl, { id: 1, x: 200, y: 15 });443 helper.touchEnd(childEl, { id: 1, x: 200, y: 15 });444 // swipe comes after drag in priority ranking.445 // therefore we expect drag events to fire prior to the swipestart listener446 // that claims the event447 expect(out).toEqual([448 'child-touchstart',449 'target-touchstart',450 'child-touchmove',451 'target-touchmove',452 'child-touchmove',453 'target-touchmove',454 'child-touchend',455 'target-touchend'456 ]);457 });458 it("should cancel gesture events when touchmove is claimed", function() {459 var out = [],460 claimed = false,461 claimNext = false,462 handler = function(e) {463 if (claimNext && !claimed && e.type === 'touchmove') {464 e.claimGesture();465 claimed = true;466 }467 out.push(e.currentTarget.id + '-' + e.type);468 },469 listeners = {470 dragcancel: handler,471 swipecancel: handler,472 dragend: handler,473 touchend: handler,474 swipe: handler,475 drag: handler,476 touchmove: handler,477 swipestart: handler,478 dragstart: handler,479 touchstart: handler480 };481 targetEl.on(listeners);482 childEl.on(listeners);483 helper.touchStart(childEl, { id: 1, x: 10, y: 15 });484 helper.touchMove(childEl, { id: 1, x: 50, y: 15 });485 claimNext = true;486 helper.touchMove(childEl, { id: 1, x: 200, y: 15 });487 helper.touchEnd(childEl, { id: 1, x: 200, y: 15 });488 expect(out).toEqual([489 'child-touchstart',490 'target-touchstart',491 'child-touchmove',492 'child-dragstart',493 'child-drag',494 'child-swipestart',495 'target-touchmove',496 'target-dragstart',497 'target-drag',498 'target-swipestart',499 'child-touchmove',500 'child-dragcancel',501 'target-dragcancel',502 'child-swipecancel',503 'target-swipecancel',504 'target-touchmove',505 'child-touchend',506 'target-touchend'507 ]);508 });509 });510 describe("keeping e.touches up to date", function() {511 it("should update touches on start", function() {512 var e;513 targetEl.on('touchstart', function(ev) {514 e = ev;515 });516 helper.touchStart(targetEl, { id: 1, x: 10, y: 11 });517 expect(e.touches.length).toBe(1);518 expect(e.touches[0].identifier).toBe(1);519 expect(e.touches[0].pageX).toBe(10);520 expect(e.touches[0].pageY).toBe(11);521 expect(e.touches[0].target).toBe(targetEl.dom);522 helper.touchEnd(targetEl, { id: 1, x: 10, y: 11 });523 });524 it("should update touches on move", function() {525 var e;526 targetEl.on('touchmove', function(ev) {527 e = ev;528 });529 helper.touchStart(targetEl, { id: 1, x: 10, y: 11 });530 helper.touchMove(targetEl, { id: 1, x: 12, y: 15 });531 expect(e.touches.length).toBe(1);532 expect(e.touches[0].identifier).toBe(1);533 expect(e.touches[0].pageX).toBe(12);534 expect(e.touches[0].pageY).toBe(15);535 expect(e.touches[0].target).toBe(targetEl.dom);536 helper.touchEnd(targetEl, { id: 1, x: 12, y: 15 });537 });538 it("should update touches on second start", function() {539 var e;540 targetEl.on('touchstart', function(ev) {541 e = ev;542 });543 helper.touchStart(targetEl, { id: 1, x: 10, y: 11 });544 helper.touchStart(targetEl, { id: 2, x: 12, y: 15 });545 if (Ext.supports.TouchEvents || Ext.supports.MSPointerEvents || Ext.supports.PointerEvents) {546 expect(e.touches.length).toBe(2);547 expect(e.touches[0].identifier).toBe(1);548 expect(e.touches[0].pageX).toBe(10);549 expect(e.touches[0].pageY).toBe(11);550 expect(e.touches[0].target).toBe(targetEl.dom);551 expect(e.touches[1].identifier).toBe(2);552 expect(e.touches[1].pageX).toBe(12);553 expect(e.touches[1].pageY).toBe(15);554 expect(e.touches[1].target).toBe(targetEl.dom);555 }556 else {557 expect(e.touches.length).toBe(1);558 expect(e.touches[0].identifier).toBe(1);559 expect(e.touches[0].pageX).toBe(12);560 expect(e.touches[0].pageY).toBe(15);561 expect(e.touches[0].target).toBe(targetEl.dom);562 }563 helper.touchEnd(targetEl, { id: 2, x: 12, y: 15 });564 helper.touchEnd(targetEl, { id: 1, x: 10, y: 11 });565 });566 it("should update touches on move when start propagation was stopped", function() {567 var e;568 targetEl.on({569 touchstart: function(ev) {570 ev.stopPropagation();571 },572 delegated: false573 });574 targetEl.on('touchmove', function(ev) {575 e = ev;576 });577 helper.touchStart(targetEl, { id: 1, x: 10, y: 11 });578 helper.touchMove(targetEl, { id: 1, x: 12, y: 15 });579 if (Ext.supports.TouchEvents || Ext.supports.MSPointerEvents || Ext.supports.PointerEvents) {580 expect(e.touches.length).toBe(1);581 expect(e.touches[0].identifier).toBe(1);582 expect(e.touches[0].pageX).toBe(12);583 expect(e.touches[0].pageY).toBe(15);584 expect(e.touches[0].target).toBe(targetEl.dom);585 }586 else {587 expect(e.touches).toBeUndefined();588 }589 helper.touchEnd(targetEl, { id: 1, x: 12, y: 15 });590 });591 it("should update touches on end when start and move propagation were stopped", function() {592 var e;593 targetEl.on({594 touchstart: function(ev) {595 ev.stopPropagation();596 },597 touchmove: function(ev) {598 ev.stopPropagation();599 },600 delegated: false601 });602 targetEl.on('touchend', function(ev) {603 e = ev;604 });605 helper.touchStart(targetEl, { id: 1, x: 10, y: 11 });606 helper.touchMove(targetEl, { id: 1, x: 12, y: 15 });607 helper.touchEnd(targetEl, { id: 1, x: 12, y: 15 });608 if (e.pointerType === 'mouse') {609 expect(e.touches).toBeUndefined();610 }611 else {612 expect(e.touches.length).toBe(0);613 }614 });615 });616 describe("playing well with others", function() {617 function stopPropagation(e) {618 e.stopPropagation();619 }620 it("should cancel gesture recognition when stopPropagation is called on the start event", function() {621 var touchstart = jasmine.createSpy(),622 tap = jasmine.createSpy(),623 tapcancel = jasmine.createSpy();624 targetEl.on({625 touchstart: touchstart,626 tap: tap,627 tapcancel: tapcancel628 });629 targetEl.setTouchAction('none');630 targetEl.on({631 touchstart: stopPropagation,632 delegated: false633 });634 helper.touchStart(targetEl, { id: 1, x: 10, y: 10 });635 helper.touchMove(targetEl, { id: 1, x: 11, y: 11 });636 helper.touchEnd(targetEl, { id: 1, x: 11, y: 11 });637 expect(touchstart).not.toHaveBeenCalled();638 expect(tapcancel).not.toHaveBeenCalled();639 expect(tap).not.toHaveBeenCalled();640 });641 (Ext.isIE8 ? xit : it)("should cancel gesture recognition when stopPropagation is called on the move event", function() {642 var dragstart = jasmine.createSpy(),643 drag = jasmine.createSpy(),644 dragend = jasmine.createSpy(),645 dragcancel = jasmine.createSpy();646 targetEl.on({647 dragstart: dragstart,648 drag: drag,649 dragend: dragend,650 dragcancel: dragcancel651 });652 targetEl.setTouchAction('none');653 helper.touchStart(targetEl, { id: 1, x: 10, y: 10 });654 helper.touchMove(targetEl, { id: 1, x: 20, y: 20 });655 expect(dragstart.callCount).toBe(1);656 expect(drag.callCount).toBe(1);657 targetEl.on({658 touchmove: stopPropagation,659 delegated: false660 });661 helper.touchMove(targetEl, { id: 1, x: 30, y: 30 });662 expect(drag.callCount).toBe(1);663 expect(dragcancel.callCount).toBe(1);664 helper.touchEnd(targetEl, { id: 1, x: 30, y: 30 });665 expect(dragend.callCount).toBe(0);666 });667 (Ext.isIE8 ? xit : it)("should cancel gesture recognition when stopPropagation is called on the end event", function() {668 var dragstart = jasmine.createSpy(),669 drag = jasmine.createSpy(),670 dragend = jasmine.createSpy(),671 dragcancel = jasmine.createSpy();672 targetEl.on({673 dragstart: dragstart,674 drag: drag,675 dragend: dragend,676 dragcancel: dragcancel677 });678 targetEl.setTouchAction('none');679 helper.touchStart(targetEl, { id: 1, x: 10, y: 10 });680 helper.touchMove(targetEl, { id: 1, x: 30, y: 30 });681 expect(dragstart.callCount).toBe(1);682 expect(drag.callCount).toBe(1);683 targetEl.on({684 touchend: stopPropagation,685 delegated: false686 });687 helper.touchEnd(targetEl, { id: 1, x: 30, y: 30 });688 expect(drag.callCount).toBe(1);689 expect(dragcancel.callCount).toBe(1);690 expect(dragend.callCount).toBe(0);691 });692 });...

Full Screen

Full Screen

tooltip-class.js

Source:tooltip-class.js Github

copy

Full Screen

1function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }2function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }3import { getDocument } from 'ssr-window';4import $ from '../../shared/dom7';5import { extend, deleteProps } from '../../shared/utils';6import { getSupport } from '../../shared/get-support';7import Framework7Class from '../../shared/class';8var Tooltip = /*#__PURE__*/function (_Framework7Class) {9 _inheritsLoose(Tooltip, _Framework7Class);10 function Tooltip(app, params) {11 var _this;12 if (params === void 0) {13 params = {};14 }15 _this = _Framework7Class.call(this, params, [app]) || this;16 var tooltip = _assertThisInitialized(_this);17 var support = getSupport();18 var defaults = extend({}, app.params.tooltip);19 var document = getDocument(); // Extend defaults with modules params20 tooltip.useModulesParams(defaults);21 tooltip.params = extend(defaults, params);22 if (typeof params.offset === 'undefined' && support.touch && tooltip.params.trigger === 'hover') {23 tooltip.params.offset = 10;24 }25 var _tooltip$params = tooltip.params,26 targetEl = _tooltip$params.targetEl,27 containerEl = _tooltip$params.containerEl;28 if (!targetEl && !tooltip.params.delegated) return tooltip || _assertThisInitialized(_this);29 var $targetEl = $(targetEl);30 if ($targetEl.length === 0 && !tooltip.params.delegated) return tooltip || _assertThisInitialized(_this);31 if ($targetEl[0] && $targetEl[0].f7Tooltip && !tooltip.params.delegated) return $targetEl[0].f7Tooltip || _assertThisInitialized(_this);32 var $containerEl = $(containerEl || app.$el).eq(0);33 if ($containerEl.length === 0) {34 $containerEl = app.$el;35 }36 var $el = $(tooltip.render()).eq(0);37 extend(tooltip, {38 app: app,39 $targetEl: $targetEl,40 targetEl: $targetEl && $targetEl[0],41 $containerEl: $containerEl,42 containerEl: $containerEl && $containerEl[0],43 $el: $el,44 el: $el && $el[0],45 text: tooltip.params.text || '',46 visible: false,47 opened: false48 });49 if ($targetEl[0]) $targetEl[0].f7Tooltip = tooltip;50 var touchesStart = {};51 var isTouched;52 function handleClick() {53 if (tooltip.opened) tooltip.hide();else tooltip.show(this);54 }55 function handleClickOut(e) {56 if (tooltip.opened && ($(e.target).closest($targetEl).length || $(e.target).closest(tooltip.$el).length)) return;57 tooltip.hide();58 }59 function handleTouchStart(e) {60 if (isTouched) return;61 isTouched = true;62 touchesStart.x = e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX;63 touchesStart.y = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY;64 tooltip.show(this);65 }66 function handleTouchMove(e) {67 if (!isTouched) return;68 var x = e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX;69 var y = e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY;70 var distance = Math.pow(Math.pow(x - touchesStart.x, 2) + Math.pow(y - touchesStart.y, 2), 0.5);71 if (distance > 50) {72 isTouched = false;73 tooltip.hide();74 }75 }76 function handleTouchEnd() {77 if (!isTouched) return;78 isTouched = false;79 tooltip.hide();80 }81 function handleMouseEnter() {82 tooltip.show(this);83 }84 function handleMouseLeave() {85 tooltip.hide();86 }87 function handleTransitionEnd() {88 if (!$el.hasClass('tooltip-in')) {89 $el.removeClass('tooltip-out').remove();90 }91 }92 tooltip.attachEvents = function attachEvents() {93 $el.on('transitionend', handleTransitionEnd);94 if (tooltip.params.trigger === 'click') {95 if (tooltip.params.delegated) {96 $(document).on('click', tooltip.params.targetEl, handleClick);97 } else {98 tooltip.$targetEl.on('click', handleClick);99 }100 $('html').on('click', handleClickOut);101 return;102 }103 if (tooltip.params.trigger === 'manual') return;104 if (support.touch) {105 var passive = support.passiveListener ? {106 passive: true107 } : false;108 if (tooltip.params.delegated) {109 $(document).on(app.touchEvents.start, tooltip.params.targetEl, handleTouchStart, passive);110 } else {111 tooltip.$targetEl.on(app.touchEvents.start, handleTouchStart, passive);112 }113 app.on('touchmove', handleTouchMove);114 app.on('touchend:passive', handleTouchEnd);115 } else {116 // eslint-disable-next-line117 if (tooltip.params.delegated) {118 $(document).on(support.pointerEvents ? 'pointerenter' : 'mouseenter', tooltip.params.targetEl, handleMouseEnter, true);119 $(document).on(support.pointerEvents ? 'pointerleave' : 'mouseleave', tooltip.params.targetEl, handleMouseLeave, true);120 } else {121 tooltip.$targetEl.on(support.pointerEvents ? 'pointerenter' : 'mouseenter', handleMouseEnter);122 tooltip.$targetEl.on(support.pointerEvents ? 'pointerleave' : 'mouseleave', handleMouseLeave);123 }124 }125 };126 tooltip.detachEvents = function detachEvents() {127 $el.off('transitionend', handleTransitionEnd);128 if (tooltip.params.trigger === 'click') {129 if (tooltip.params.delegated) {130 $(document).on('click', tooltip.params.targetEl, handleClick);131 } else {132 tooltip.$targetEl.off('click', handleClick);133 }134 $('html').off('click', handleClickOut);135 return;136 }137 if (tooltip.params.trigger === 'manual') return;138 if (support.touch) {139 var passive = support.passiveListener ? {140 passive: true141 } : false;142 if (tooltip.params.delegated) {143 $(document).off(app.touchEvents.start, tooltip.params.targetEl, handleTouchStart, passive);144 } else {145 tooltip.$targetEl.off(app.touchEvents.start, handleTouchStart, passive);146 }147 app.off('touchmove', handleTouchMove);148 app.off('touchend:passive', handleTouchEnd);149 } else {150 // eslint-disable-next-line151 if (tooltip.params.delegated) {152 $(document).off(support.pointerEvents ? 'pointerenter' : 'mouseenter', tooltip.params.targetEl, handleMouseEnter, true);153 $(document).off(support.pointerEvents ? 'pointerleave' : 'mouseleave', tooltip.params.targetEl, handleMouseLeave, true);154 } else {155 tooltip.$targetEl.off(support.pointerEvents ? 'pointerenter' : 'mouseenter', handleMouseEnter);156 tooltip.$targetEl.off(support.pointerEvents ? 'pointerleave' : 'mouseleave', handleMouseLeave);157 }158 }159 }; // Install Modules160 tooltip.useModules();161 tooltip.init();162 return tooltip || _assertThisInitialized(_this);163 }164 var _proto = Tooltip.prototype;165 _proto.setTargetEl = function setTargetEl(targetEl) {166 var tooltip = this;167 tooltip.detachEvents();168 tooltip.$targetEl = $(targetEl);169 tooltip.targetEl = tooltip.$targetEl[0];170 tooltip.attachEvents();171 return tooltip;172 };173 _proto.position = function position(targetEl) {174 var tooltip = this;175 var $el = tooltip.$el,176 app = tooltip.app,177 $containerEl = tooltip.$containerEl;178 var hasContainerEl = !!tooltip.params.containerEl;179 var tooltipOffset = tooltip.params.offset || 0;180 $el.css({181 left: '',182 top: ''183 });184 var $targetEl = $(targetEl || tooltip.targetEl);185 var _ref = [$el.width(), $el.height()],186 width = _ref[0],187 height = _ref[1];188 $el.css({189 left: '',190 top: ''191 });192 var targetWidth;193 var targetHeight;194 var targetOffsetLeft;195 var targetOffsetTop;196 var boundaries = hasContainerEl && $containerEl.length ? $containerEl[0].getBoundingClientRect() : app;197 if ($targetEl && $targetEl.length > 0) {198 targetWidth = $targetEl.outerWidth();199 targetHeight = $targetEl.outerHeight();200 if (typeof targetWidth === 'undefined' && typeof targetHeight === 'undefined') {201 var clientRect = $targetEl[0].getBoundingClientRect();202 targetWidth = clientRect.width;203 targetHeight = clientRect.height;204 }205 var targetOffset = $targetEl.offset();206 targetOffsetLeft = targetOffset.left - boundaries.left;207 targetOffsetTop = targetOffset.top - boundaries.top;208 var targetParentPage = $targetEl.parents('.page');209 if (targetParentPage.length > 0) {210 targetOffsetTop -= targetParentPage[0].scrollTop;211 }212 }213 var _ref2 = [0, 0, 0],214 left = _ref2[0],215 top = _ref2[1]; // Top Position216 var position = 'top';217 if (height + tooltipOffset < targetOffsetTop) {218 // On top219 top = targetOffsetTop - height - tooltipOffset;220 } else if (height < boundaries.height - targetOffsetTop - targetHeight) {221 // On bottom222 position = 'bottom';223 top = targetOffsetTop + targetHeight + tooltipOffset;224 } else {225 // On middle226 position = 'middle';227 top = targetHeight / 2 + targetOffsetTop - height / 2;228 if (top <= 0) {229 top = 8;230 } else if (top + height >= boundaries.height) {231 top = boundaries.height - height - 8;232 }233 } // Horizontal Position234 if (position === 'top' || position === 'bottom') {235 left = targetWidth / 2 + targetOffsetLeft - width / 2;236 if (left < 8) left = 8;237 if (left + width > boundaries.width) left = boundaries.width - width - 8;238 if (left < 0) left = 0;239 } else if (position === 'middle') {240 left = targetOffsetLeft - width;241 if (left < 8 || left + width > boundaries.width) {242 if (left < 8) left = targetOffsetLeft + targetWidth;243 if (left + width > boundaries.width) left = boundaries.width - width - 8;244 }245 } // Apply Styles246 $el.css({247 top: top + "px",248 left: left + "px"249 });250 };251 _proto.show = function show(aroundEl) {252 var tooltip = this;253 var $el = tooltip.$el,254 $targetEl = tooltip.$targetEl,255 $containerEl = tooltip.$containerEl;256 if ($containerEl[0] && $el[0] && !$containerEl[0].contains($el[0])) {257 $containerEl.append($el);258 }259 tooltip.position(aroundEl);260 var $aroundEl = $(aroundEl);261 tooltip.visible = true;262 tooltip.opened = true;263 $targetEl.trigger('tooltip:show');264 $el.trigger('tooltip:show');265 if ($aroundEl.length && $aroundEl[0] !== $targetEl[0]) {266 $aroundEl.trigger('tooltip:show');267 }268 tooltip.emit('local::show tooltipShow', tooltip);269 $el.removeClass('tooltip-out').addClass('tooltip-in');270 return tooltip;271 };272 _proto.hide = function hide() {273 var tooltip = this;274 var $el = tooltip.$el,275 $targetEl = tooltip.$targetEl;276 tooltip.visible = false;277 tooltip.opened = false;278 $targetEl.trigger('tooltip:hide');279 $el.trigger('tooltip:hide');280 tooltip.emit('local::hide tooltipHide', tooltip);281 $el.addClass('tooltip-out').removeClass('tooltip-in');282 return tooltip;283 };284 _proto.render = function render() {285 var tooltip = this;286 if (tooltip.params.render) return tooltip.params.render.call(tooltip, tooltip);287 var _tooltip$params2 = tooltip.params,288 cssClass = _tooltip$params2.cssClass,289 text = _tooltip$params2.text;290 return ("\n <div class=\"tooltip " + (cssClass || '') + "\">\n <div class=\"tooltip-content\">" + (text || '') + "</div>\n </div>\n ").trim();291 };292 _proto.setText = function setText(newText) {293 var tooltip = this;294 if (typeof newText === 'undefined') {295 return tooltip;296 }297 tooltip.params.text = newText;298 tooltip.text = newText;299 if (tooltip.$el) {300 tooltip.$el.children('.tooltip-content').html(newText);301 }302 if (tooltip.opened) {303 tooltip.position();304 }305 return tooltip;306 };307 _proto.init = function init() {308 var tooltip = this;309 tooltip.attachEvents();310 };311 _proto.destroy = function destroy() {312 var tooltip = this;313 if (!tooltip.$targetEl || tooltip.destroyed) return;314 tooltip.$targetEl.trigger('tooltip:beforedestroy');315 tooltip.emit('local::beforeDestroy tooltipBeforeDestroy', tooltip);316 tooltip.$el.remove();317 if (tooltip.$targetEl[0]) delete tooltip.$targetEl[0].f7Tooltip;318 tooltip.detachEvents();319 deleteProps(tooltip);320 tooltip.destroyed = true;321 };322 return Tooltip;323}(Framework7Class);...

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1import { targetEl } from 'ng-mocks';2describe('AppComponent', () => {3 let component: AppComponent;4 let fixture: ComponentFixture<AppComponent>;5 beforeEach(async(() => {6 TestBed.configureTestingModule({7 }).compileComponents();8 }));9 beforeEach(() => {10 fixture = TestBed.createComponent(AppComponent);11 component = fixture.componentInstance;12 fixture.detectChanges();13 });14 it('should create the app', () => {15 expect(component).toBeTruthy();16 });17 it(`should have as title 'app'`, () => {18 expect(component.title).toEqual('app');19 });20 it('should render title in a h1 tag', () => {21 const title = targetEl(fixture, 'h1').nativeElement.textContent;22 expect(title).toContain('Welcome to app!');23 });24});

Full Screen

Using AI Code Generation

copy

Full Screen

1import { targetEl } from 'ng-mocks';2const target = targetEl();3console.log(target);4import { targetEl } from 'ng-mocks';5const target = targetEl();6console.log(target);

Full Screen

Using AI Code Generation

copy

Full Screen

1import { targetEl } from 'ng-mocks';2const targetElement = targetEl('<div></div>');3import { targetEl } from 'ng-mocks';4const targetElement = targetEl('<div></div>');5import { targetEl } from 'ng-mocks';6const targetElement = targetEl('<div></div>');7import { targetEl } from 'ng-mocks';8const targetElement = targetEl('<div></div>');9import { targetEl } from 'ng-mocks';10const targetElement = targetEl('<div></div>');11import { targetEl } from 'ng-mocks';12const targetElement = targetEl('<div></div>');13import { targetEl } from 'ng-mocks';14const targetElement = targetEl('<div></div>');15import { targetEl } from 'ng-mocks';16const targetElement = targetEl('<div></div>');17import { targetEl } from 'ng-mocks';18const targetElement = targetEl('<div></div>');19import { targetEl } from 'ng-mocks';20const targetElement = targetEl('<div></div>');21import { targetEl } from 'ng-mocks';22const targetElement = targetEl('<div></div>');23import { targetEl } from 'ng-mocks';24const targetElement = targetEl('<div></div>');25import { targetEl } from 'ng-mocks';26const targetElement = targetEl('<div

Full Screen

Using AI Code Generation

copy

Full Screen

1import { targetEl } from 'ng-mocks';2describe('test', () => {3 it('should test', () => {4 const fixture = TestBed.createComponent(TestComponent);5 fixture.detectChanges();6 const targetElement = targetEl(fixture, TestComponent);7 expect(targetElement).toBeTruthy();8 });9});10import { Component } from '@angular/core';11@Component({12})13export class TestComponent {}14import { ComponentFixture, TestBed } from '@angular/core/testing';15import { TestComponent } from './test.component';16describe('test', () => {17 let fixture: ComponentFixture<TestComponent>;18 beforeEach(() => {19 TestBed.configureTestingModule({20 });21 fixture = TestBed.createComponent(TestComponent);22 fixture.detectChanges();23 });24 it('should test', () => {25 expect(fixture).toBeTruthy();26 });27});28import { Component } from '@angular/core';29@Component({30})31export class TestComponent {}32import { ComponentFixture, TestBed } from '@angular/core/testing';33import { TestComponent } from './test.component';34describe('test', () => {35 let fixture: ComponentFixture<TestComponent>;36 beforeEach(() => {37 TestBed.configureTestingModule({38 });39 fixture = TestBed.createComponent(TestComponent);40 fixture.detectChanges();41 });42 it('should test', () => {43 expect(fixture).toBeTruthy();44 });45});46import { Component } from '@angular/core';47@Component({48})49export class TestComponent {}50import { ComponentFixture, TestBed } from '@angular/core/testing';51import { TestComponent } from './test.component';52describe('test', () => {53 let fixture: ComponentFixture<TestComponent>;54 beforeEach(() => {55 TestBed.configureTestingModule({

Full Screen

Using AI Code Generation

copy

Full Screen

1import { targetEl } from 'ng-mocks';2describe('TestComponent', () => {3 beforeEach(async(() => {4 TestBed.configureTestingModule({5 imports: [BrowserAnimationsModule, MatIconModule, MatTooltipModule]6 }).compileComponents();7 }));8 it('should create', () => {9 const fixture = TestBed.createComponent(TestComponent);10 const component = fixture.componentInstance;11 expect(component).toBeTruthy();12 });13 it('should show tooltip on hover', () => {14 const fixture = TestBed.createComponent(TestComponent);15 const component = fixture.componentInstance;16 fixture.detectChanges();17 const debugElement = targetEl(fixture.debugElement, MatTooltip);18 const tooltip = debugElement.componentInstance;19 expect(tooltip.disabled).toBe(false);20 });21});22import { Component } from '@angular/core';23@Component({24})25export class TestComponent {26 constructor() {}27}28mat-icon {29 cursor: pointer;30}31import { async, ComponentFixture, TestBed } from '@angular/core/testing';32import { TestComponent } from './test.component';33import { BrowserAnimationsModule } from '@angular/platform-browser/animations';34import { MatIconModule } from '@angular/material/icon';35import { MatTooltipModule } from '@angular/material/tooltip';36import { MatTooltip } from '@angular/material/tooltip';37import { targetEl } from 'ng-mocks';38describe('TestComponent', () => {39 beforeEach(async(() => {40 TestBed.configureTestingModule({41 imports: [BrowserAnimationsModule, MatIconModule, MatTooltipModule]42 }).compileComponents();43 }));44 it('should create', () => {45 const fixture = TestBed.createComponent(TestComponent);46 const component = fixture.componentInstance;47 expect(component).toBeTruthy();48 });49 it('should show tooltip on hover', () => {50 const fixture = TestBed.createComponent(TestComponent);51 const component = fixture.componentInstance;52 fixture.detectChanges();53 const debugElement = targetEl(fixture.debugElement, MatTooltip);54 const tooltip = debugElement.componentInstance;55 expect(tooltip.disabled).toBe(false);56 });57});58import { Component } from '@angular/core

Full Screen

Using AI Code Generation

copy

Full Screen

1const targetEl = ngMocks.find('my-component').targetEl;2const targetEl = ngMocks.find('my-component').targetEl.nativeElement;3const targetEl = spectator.query('my-component');4const targetEl = spectator.query('my-component').nativeElement;5const targetEl = ngMocks.find('my-component').targetEl;6const targetEl = ngMocks.find('my-component').targetEl.nativeElement;7const targetEl = spectator.query('my-component');8const targetEl = spectator.query('my-component').nativeElement;9const targetEl = ngMocks.find('my-component').targetEl;10const targetEl = ngMocks.find('my-component').targetEl.nativeElement;11const targetEl = spectator.query('my-component');12const targetEl = spectator.query('my-component').nativeElement;13describe('AppComponent', () => {14 let spectator: Spectator<AppComponent>;15 const createComponent = createComponentFactory({16 imports: [FormsModule],17 });18 beforeEach(() => (spectator = createComponent()));19 it('should create the app', () => {20 expect(spectator.component).toBeTruthy();21 });22 it('should render title in a h1 tag', () => {23 expect(spectator.query('h1').textContent).toContain('Welcome to app!');24 });25 it('should render my-component', () => {26 expect(spectator.query('my-component')).toBeTruthy();27 });28});29describe('MyComponent', () => {30 let spectator: Spectator<MyComponent>;31 const createComponent = createComponentFactory({32 imports: [FormsModule],

Full Screen

Using AI Code Generation

copy

Full Screen

1const targetEl = ngMocks.findInstance(ChildComponent);2const targetEl = ngMocks.findInstance(ChildComponent, 'child');3const targetEl = ngMocks.findInstance(ChildComponent, 'child', 'child');4const targetEl = ngMocks.findInstance(ChildComponent, 'child', 'child', 'child');5const targetEl = ngMocks.findInstance(ChildComponent, 'child', 'child', 'child', 'child');6const targetEl = ngMocks.findInstance(ChildComponent, 'child', 'child', 'child', 'child', 'child');7const targetEl = ngMocks.findInstance(ChildComponent, 'child', 'child', 'child', 'child', 'child', 'child');8const targetEl = ngMocks.findInstance(ChildComponent, 'child', 'child', 'child', 'child', 'child', 'child', 'child');9const targetEl = ngMocks.findInstance(ChildComponent, 'child', 'child', 'child', 'child', 'child', 'child', 'child', 'child');10const targetEl = ngMocks.findInstance(ChildComponent, 'child', 'child', 'child', 'child', 'child', 'child', 'child', 'child', 'child');11const targetEl = ngMocks.findInstance(ChildComponent, 'child', 'child', 'child', 'child', 'child', 'child', 'child', 'child', 'child', 'child');12const targetEl = ngMocks.findInstance(ChildComponent, 'child', '

Full Screen

Using AI Code Generation

copy

Full Screen

1import { targetEl } from 'ng-mocks';2const fixture = TestBed.createComponent(TestComponent);3const target = targetEl(fixture, TestComponent, 0);4expect(target).toBeDefined();5expect(target.nativeElement).toBeDefined();6expect(target.nativeElement).toBe(fixture.nativeElement);7expect(target.nativeElement).toBe(fixture.nativeElement.firstChild);8expect(target.nativeElement).toBe(fixture.nativeElement.lastChild);9expect(target.nativeElement).toBe(fixture.nativeElement.children[0]);10expect(target.nativeElement).toBe(fixture.nativeElement.children[1]);11expect(target.nativeElement).toBe(fixture.nativeElement.children[2]);12expect(target.nativeElement).toBe(fixture.nativeElement.children[3]);13expect(target.nativeElement).toBe(fixture.nativeElement.children[4]);14expect(target.nativeElement).toBe(fixture.nativeElement.children[5]);15expect(target.nativeElement).toBe(fixture.nativeElement.children[6]);16expect(target.nativeElement).toBe(fixture.nativeElement.children[7]);17expect(target.nativeElement).toBe(fixture.nativeElement.children[8]);18expect(target.nativeElement).toBe(fixture.nativeElement.children[9]);

Full Screen

Using AI Code Generation

copy

Full Screen

1import { targetEl } from 'ng-mocks';2const fixture = TestBed.createComponent(AppComponent);3const target = targetEl(fixture, 'a', 0);4expect(target).toBeDefined();5expect(target.nativeElement.textContent).toEqual('Click me');6const fixture = TestBed.createComponent(AppComponent);7const target = targetEl(fixture, 'a', 0);8expect(target).toBeDefined();9expect(target.nativeElement.textContent).toEqual('Click me');10const fixture = TestBed.createComponent(AppComponent);11const target = targetEl(fixture, 'a', 0);12expect(target).toBeDefined();13expect(target.nativeElement.textContent).toEqual('Click me');14const fixture = TestBed.createComponent(AppComponent);15const target = targetEl(fixture, 'a', 0);16expect(target).toBeDefined();17expect(target.nativeElement.textContent).toEqual('Click me');18const fixture = TestBed.createComponent(AppComponent);19const target = targetEl(fixture, 'a', 0);20expect(target).toBeDefined();21expect(target.nativeElement.textContent).toEqual('Click me');22const fixture = TestBed.createComponent(AppComponent);23const target = targetEl(fixture, 'a', 0);24expect(target).toBeDefined();25expect(target.nativeElement.textContent).toEqual('Click me');26const fixture = TestBed.createComponent(AppComponent);27const target = targetEl(fixture, 'a', 0);28expect(target).toBeDefined();29expect(target.nativeElement.textContent).toEqual('Click me');30const fixture = TestBed.createComponent(AppComponent);31const target = targetEl(fixture, 'a', 0);32expect(target).toBeDefined();33expect(target.nativeElement.textContent).toEqual('Click me');34const fixture = TestBed.createComponent(AppComponent);35const target = targetEl(fixture, 'a', 0);36expect(target).toBeDefined();37expect(target.nativeElement.textContent).toEqual('Click me');38const fixture = TestBed.createComponent(AppComponent);39const target = targetEl(fixture, 'a', 0);40expect(target).toBeDefined();41expect(target.nativeElement.textContent).toEqual('Click me');

Full Screen

Automation Testing Tutorials

Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.

LambdaTest Learning Hubs:

YouTube

You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.

Run ng-mocks automation tests on LambdaTest cloud grid

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

Try LambdaTest Now !!

Get 100 minutes of automation test minutes FREE!!

Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful