KaneAI - World’s First E2E Software Testing Agent.Signup for Private Beta Join TestMu Conference

How to use targetEl method in ng-mocks

Best JavaScript code snippet using ng-mocks

Gesture.js

Source:Gesture.js

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    });...

tooltip-class.js

Source:tooltip-class.js

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);...

Using AI Code Generation

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});

Using AI Code Generation

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

Using AI Code Generation

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

Using AI Code Generation

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({

Using AI Code Generation

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

Using AI Code Generation

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],

Using AI Code Generation

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', '

Using AI Code Generation

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]);

Using AI Code Generation

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');

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.