Unlock 30% off on Manual Testing Annual Plans this Holiday Season.

Copied to Clipboard!

How to use mouseUp method in devicefarmer-stf

Best JavaScript code snippet using devicefarmer-stf

detection-element-after-events-simulation-test.js

Source:detection-element-after-events-simulation-test.js

1const hammerhead       = window.getTestCafeModule('hammerhead');2const browserUtils     = hammerhead.utils.browser;3const featureDetection = hammerhead.utils.featureDetection;4const testCafeCore     = window.getTestCafeModule('testCafeCore');5const parseKeySequence = testCafeCore.get('./utils/parse-key-sequence');6const testCafeAutomation   = window.getTestCafeModule('testCafeAutomation');7const ClickAutomation      = testCafeAutomation.Click;8const RClickAutomation     = testCafeAutomation.RClick;9const DblClickAutomation   = testCafeAutomation.DblClick;10const SelectTextAutomation = testCafeAutomation.SelectText;11const TypeAutomation       = testCafeAutomation.Type;12const PressAutomation      = testCafeAutomation.Press;13const ClickOptions = testCafeAutomation.get('../../test-run/commands/options').ClickOptions;14const TypeOptions  = testCafeAutomation.get('../../test-run/commands/options').TypeOptions;15testCafeCore.preventRealEvents();16$(document).ready(function () {17    const TEST_ELEMENT_CLASS = 'testElement';18    //utils19    const addInputElement = function (x, y, value) {20        const elementString = ['<input type="text" value="', value, '" />'].join('');21        return $(elementString)22            .css({23                position: 'absolute',24                left:     x + 'px',25                top:      y + 'px'26            })27            .addClass(TEST_ELEMENT_CLASS)28            .appendTo('body');29    };30    const addDiv = function (x, y) {31        return $('<div />')32            .css({33                position: 'absolute',34                left:     x,35                top:      y,36                border:   '1px solid black'37            })38            .width(150)39            .height(150)40            .addClass(TEST_ELEMENT_CLASS)41            .appendTo('body');42    };43    const startNext = function () {44        if (browserUtils.isIE) {45            removeTestElements();46            window.setTimeout(start, 30);47        }48        else49            start();50    };51    const removeTestElements = function () {52        $('.' + TEST_ELEMENT_CLASS).remove();53    };54    const createMouseMonitorEventObject = function () {55        return {56            elementOneMousedownRaised:   false,57            elementOneMouseupRaised:     false,58            elementOneClickRaised:       false,59            elementOneRClickRaised:      false,60            elementOneDblClickRaised:    false,61            elementOneContextMenuRaised: false,62            elementOneSelectRaised:      false,63            elementOneMousedownCount:    0,64            elementOneMouseupCount:      0,65            elementOneClickCount:        0,66            elementTwoMousedownRaised:   false,67            elementTwoMouseupRaised:     false,68            elementTwoClickRaised:       false,69            elementTwoRClickRaised:      false,70            elementTwoDblClickRaised:    false,71            elementTwoContextMenuRaised: false,72            elementTwoSelectRaised:      false,73            elementTwoMousedownCount:    0,74            elementTwoMouseupCount:      0,75            elementTwoClickCount:        076        };77    };78    const createKeyMonitorEventObject = function () {79        return {80            elementsOneKeydownRaised:  false,81            elementsOneKeypressRaised: false,82            elementsOneKeyupRaised:    false,83            elementsTwoKeydownRaised:  false,84            elementsTwoKeypressRaised: false,85            elementsTwoKeyupRaised:    false86        };87    };88    const swapLocationOfElements = function ($el1, $el2) {89        const left1 = $el1.css('left');90        const top1  = $el1.css('top');91        const left2 = $el2.css('left');92        const top2  = $el2.css('top');93        $el1.css({94            left: left2,95            top:  top296        });97        $el2.css({98            left: left1,99            top:  top1100        });101    };102    const bindMouseHandlersToSwappingElements = function ($el1, $el2, eventName, eventMonitorObject, checkMousemove, toSecondHandler) {103        let isSecondEvent = false;104        $el1.bind('mousedown', function (e) {105            eventMonitorObject.elementOneMousedownRaised = true;106            eventMonitorObject.elementOneMousedownCount++;107            if (e.type === eventName && (!toSecondHandler || isSecondEvent))108                swapLocationOfElements($el1, $el2);109            if (!isSecondEvent && eventName === e.type)110                isSecondEvent = true;111        });112        $el1.bind('mouseup', function (e) {113            eventMonitorObject.elementOneMouseupRaised = true;114            eventMonitorObject.elementOneMouseupCount++;115            if (e.type === eventName && (!toSecondHandler || isSecondEvent))116                swapLocationOfElements($el1, $el2);117            if (!isSecondEvent && eventName === e.type)118                isSecondEvent = true;119        });120        $el1.bind('click', function (e) {121            eventMonitorObject.elementOneClickRaised = true;122            eventMonitorObject.elementOneClickCount++;123            if (e.type === eventName && (!toSecondHandler || isSecondEvent))124                swapLocationOfElements($el1, $el2);125            if (!isSecondEvent && eventName === e.type)126                isSecondEvent = true;127        });128        $el1.bind('contextmenu', function (e) {129            eventMonitorObject.elementOneRClickRaised = true;130            if (e.type === eventName)131                swapLocationOfElements($el1, $el2);132        });133        $el1.bind('dblclick', function (e) {134            eventMonitorObject.elementOneDblClickRaised = true;135            if (e.type === eventName)136                swapLocationOfElements($el1, $el2);137        });138        $el2.bind('mousedown', function () {139            eventMonitorObject.elementTwoMousedownRaised = true;140            eventMonitorObject.elementTwoMousedownCount++;141        });142        $el2.bind('mouseup', function () {143            eventMonitorObject.elementTwoMouseupRaised = true;144            eventMonitorObject.elementTwoMouseupCount++;145        });146        $el2.bind('click', function () {147            eventMonitorObject.elementTwoClickRaised = true;148            eventMonitorObject.elementTwoClickCount++;149        });150        $el2.bind('contextmenu', function () {151            eventMonitorObject.elementTwoRClickRaised = true;152        });153        $el2.bind('dblclick', function () {154            eventMonitorObject.elementTwoDblClickRaised = true;155        });156        if (checkMousemove) {157            $el1.bind('mousemove', function () {158                if (eventMonitorObject.elementOneMousedownRaised && !eventMonitorObject.elementOneMouseupRaised ||159                    eventMonitorObject.elementTwoMousedownRaised && !eventMonitorObject.elementTwoMouseupRaised)160                    eventMonitorObject.elementOneSelectRaised = true;161            });162            $el2.bind('mousemove', function () {163                if (eventMonitorObject.elementOneMousedownRaised && !eventMonitorObject.elementOneMouseupRaised ||164                    eventMonitorObject.elementTwoMousedownRaised && !eventMonitorObject.elementTwoMouseupRaised)165                    eventMonitorObject.elementTwoSelectRaised = true;166            });167        }168    };169    const bindKeyHandlersToSwappingElements = function ($el1, $el2, eventName, eventMonitorObject) {170        $el1.bind('keydown', function (e) {171            eventMonitorObject.elementsOneKeydownRaised = true;172            if (e.type === eventName)173                $el2.focus();174        });175        $el1.bind('keypress', function (e) {176            eventMonitorObject.elementsOneKeypressRaised = true;177            if (e.type === eventName)178                $el2.focus();179        });180        $el1.bind('keyup', function (e) {181            eventMonitorObject.elementsOneKeyupRaised = true;182            if (e.type === eventName)183                $el2.focus();184        });185        $el2.bind('keydown', function () {186            eventMonitorObject.elementsTwoKeydownRaised = true;187        });188        $el2.bind('keypress', function () {189            eventMonitorObject.elementsTwoKeypressRaised = true;190        });191        $el2.bind('keyup', function () {192            eventMonitorObject.elementsTwoKeyupRaised = true;193        });194    };195    const bindHandlerToTouchEvents = function ($el1, $el2, eventName, eventMonitorObject, checkMousemove) {196        $el1.bind('touchstart', function (e) {197            eventMonitorObject.elementOneMousedownRaised = true;198            eventMonitorObject.elementOneMousedownCount++;199            if (eventName === e.type)200                swapLocationOfElements($el1, $el2);201        });202        $el1.bind('touchend', function (e) {203            eventMonitorObject.elementOneMouseupRaised = true;204            eventMonitorObject.elementOneMouseupCount++;205            if (eventName === e.type)206                swapLocationOfElements($el1, $el2);207        });208        $el1.bind('click', function (e) {209            eventMonitorObject.elementOneClickRaised = true;210            eventMonitorObject.elementOneClickCount++;211            if (eventName === e.type)212                swapLocationOfElements($el1, $el2);213        });214        $el2.bind('touchstart', function (e) {215            eventMonitorObject.elementTwoMousedownRaised = true;216            eventMonitorObject.elementTwoMousedownCount++;217            if (eventName === e.type)218                swapLocationOfElements($el1, $el2);219        });220        $el2.bind('touchend', function (e) {221            eventMonitorObject.elementTwoMouseupRaised = true;222            eventMonitorObject.elementTwoMouseupCount++;223            if (eventName === e.type)224                swapLocationOfElements($el1, $el2);225        });226        $el2.bind('click', function (e) {227            eventMonitorObject.elementTwoClickRaised = true;228            eventMonitorObject.elementTwoClickCount++;229            if (eventName === e.type)230                swapLocationOfElements($el1, $el2);231        });232        if (checkMousemove) {233            $el1.bind('touchmove', function () {234                if (eventMonitorObject.elementOneMousedownRaised && !eventMonitorObject.elementOneMouseupRaised ||235                    eventMonitorObject.elementTwoMousedownRaised && !eventMonitorObject.elementTwoMouseupRaised)236                    eventMonitorObject.elementOneSelectRaised = true;237            });238            $el2.bind('touchmove', function () {239                if (eventMonitorObject.elementOneMousedownRaised && !eventMonitorObject.elementOneMouseupRaised ||240                    eventMonitorObject.elementTwoMousedownRaised && !eventMonitorObject.elementTwoMouseupRaised)241                    eventMonitorObject.elementTwoSelectRaised = true;242            });243        }244    };245    const createIFrame = function ($element, src, callback) {246        const $iFrame = $('<iframe/>')247            .attr('src', src)248            .css({249                width:  '600px',250                height: '600px'251            })252            .addClass(TEST_ELEMENT_CLASS);253        $element.addClass(TEST_ELEMENT_CLASS);254        const onLoadHandler = function () {255            $($iFrame[0].contentWindow.document.body).append($element);256            $iFrame.unbind('load', onLoadHandler);257            callback();258        };259        $iFrame.bind('load', onLoadHandler);260        $iFrame.appendTo($('body'));261    };262    //tests263    QUnit.testDone(function () {264        if (!browserUtils.isIE)265            removeTestElements();266    });267    module('detection element under cursor after events simulation');268    asyncTest('click - change element on "mousedown" event', function () {269        const eventMonitorObject = createMouseMonitorEventObject();270        const $div1 = addDiv(100, 100).css('background-color', 'red');271        const $div2 = addDiv(100, 300).css('background-color', 'green');272        bindMouseHandlersToSwappingElements($div1, $div2, 'mousedown', eventMonitorObject);273        const click = new ClickAutomation($div1[0], new ClickOptions());274        click275            .run()276            .then(function () {277                ok(eventMonitorObject.elementOneMousedownRaised);278                ok(!eventMonitorObject.elementOneMouseupRaised);279                ok(!eventMonitorObject.elementOneClickRaised);280                ok(!eventMonitorObject.elementTwoMousedownRaised);281                ok(eventMonitorObject.elementTwoMouseupRaised);282                ok(!eventMonitorObject.elementTwoClickRaised);283                startNext();284            });285    });286    asyncTest('click - change element on "mouseup" event', function () {287        const eventMonitorObject = createMouseMonitorEventObject();288        const $div1 = addDiv(100, 100).css('background-color', 'red');289        const $div2 = addDiv(100, 300).css('background-color', 'green');290        bindMouseHandlersToSwappingElements($div1, $div2, 'mouseup', eventMonitorObject);291        const click = new ClickAutomation($div1[0], new ClickOptions());292        click293            .run()294            .then(function () {295                ok(eventMonitorObject.elementOneMousedownRaised);296                ok(eventMonitorObject.elementOneMouseupRaised);297                ok(eventMonitorObject.elementOneClickRaised);298                ok(!eventMonitorObject.elementTwoMousedownRaised);299                ok(!eventMonitorObject.elementTwoMouseupRaised);300                ok(!eventMonitorObject.elementTwoClickRaised);301                startNext();302            });303    });304    asyncTest('click - change element on "click" event', function () {305        const eventMonitorObject = createMouseMonitorEventObject();306        const $div1 = addDiv(100, 100).css('background-color', 'red');307        const $div2 = addDiv(100, 300).css('background-color', 'green');308        bindMouseHandlersToSwappingElements($div1, $div2, 'click', eventMonitorObject);309        const click = new ClickAutomation($div1[0], new ClickOptions());310        click311            .run()312            .then(function () {313                ok(eventMonitorObject.elementOneMousedownRaised);314                ok(eventMonitorObject.elementOneMouseupRaised);315                ok(eventMonitorObject.elementOneClickRaised);316                ok(!eventMonitorObject.elementTwoMousedownRaised);317                ok(!eventMonitorObject.elementTwoMouseupRaised);318                ok(!eventMonitorObject.elementTwoClickRaised);319                startNext();320            });321    });322    asyncTest('rclick - change element on "mousedown" event', function () {323        const eventMonitorObject = createMouseMonitorEventObject();324        const $div1 = addDiv(100, 100).css('background-color', 'red');325        const $div2 = addDiv(100, 300).css('background-color', 'green');326        bindMouseHandlersToSwappingElements($div1, $div2, 'mousedown', eventMonitorObject);327        const rclick = new RClickAutomation($div1[0], new ClickOptions());328        rclick329            .run()330            .then(function () {331                ok(eventMonitorObject.elementOneMousedownRaised);332                ok(!eventMonitorObject.elementOneMouseupRaised);333                ok(!eventMonitorObject.elementOneRClickRaised);334                ok(!eventMonitorObject.elementTwoMousedownRaised);335                ok(eventMonitorObject.elementTwoMouseupRaised);336                ok(eventMonitorObject.elementTwoRClickRaised);337                startNext();338            });339    });340    asyncTest('rclick - change element on "mouseup" event', function () {341        const eventMonitorObject = createMouseMonitorEventObject();342        const $div1 = addDiv(100, 100).css('background-color', 'red');343        const $div2 = addDiv(100, 300).css('background-color', 'green');344        bindMouseHandlersToSwappingElements($div1, $div2, 'mouseup', eventMonitorObject);345        const rclick = new RClickAutomation($div1[0], new ClickOptions());346        rclick347            .run()348            .then(function () {349                ok(eventMonitorObject.elementOneMousedownRaised);350                ok(eventMonitorObject.elementOneMouseupRaised);351                ok(!eventMonitorObject.elementOneRClickRaised);352                ok(!eventMonitorObject.elementTwoMousedownRaised);353                ok(!eventMonitorObject.elementTwoMouseupRaised);354                ok(eventMonitorObject.elementTwoRClickRaised);355                startNext();356            });357    });358    asyncTest('rclick - change element on "contextmenu" event', function () {359        const eventMonitorObject = createMouseMonitorEventObject();360        const $div1 = addDiv(100, 100).css('background-color', 'red');361        const $div2 = addDiv(100, 300).css('background-color', 'green');362        bindMouseHandlersToSwappingElements($div1, $div2, 'contextmenu', eventMonitorObject);363        const rclick = new RClickAutomation($div1[0], new ClickOptions());364        rclick365            .run()366            .then(function () {367                ok(eventMonitorObject.elementOneMousedownRaised);368                ok(eventMonitorObject.elementOneMouseupRaised);369                ok(eventMonitorObject.elementOneRClickRaised);370                ok(!eventMonitorObject.elementTwoMousedownRaised);371                ok(!eventMonitorObject.elementTwoMouseupRaised);372                ok(!eventMonitorObject.elementTwoRClickRaised);373                startNext();374            });375    });376    asyncTest('select - change element on "mousedown" event', function () {377        const eventMonitorObject = createMouseMonitorEventObject();378        const $input1 = addInputElement(200, 200, '12345');379        const $input2 = addInputElement(400, 400, 'qwerty');380        if (featureDetection.isTouchDevice)381            bindHandlerToTouchEvents($input1, $input2, 'touchstart', eventMonitorObject, true);382        else383            bindMouseHandlersToSwappingElements($input1, $input2, 'mousedown', eventMonitorObject, true);384        const selectText = new SelectTextAutomation($input1[0], 2, 4, {});385        selectText386            .run()387            .then(function () {388                ok(eventMonitorObject.elementOneMousedownRaised);389                ok(!eventMonitorObject.elementOneSelectRaised);390                ok(!eventMonitorObject.elementOneMouseupRaised);391                ok(!eventMonitorObject.elementTwoMousedownRaised);392                if (!featureDetection.isTouchDevice)393                    ok(eventMonitorObject.elementTwoSelectRaised);394                ok(eventMonitorObject.elementTwoMouseupRaised);395                startNext();396            });397    });398    asyncTest('select - change element on "mouseup" event', function () {399        const eventMonitorObject = createMouseMonitorEventObject();400        const $input1 = addInputElement(200, 200, '12345');401        const $input2 = addInputElement(400, 400, 'qwerty');402        if (featureDetection.isTouchDevice)403            bindHandlerToTouchEvents($input1, $input2, 'touchend', eventMonitorObject, true);404        else405            bindMouseHandlersToSwappingElements($input1, $input2, 'mouseup', eventMonitorObject, true);406        const selectText = new SelectTextAutomation($input1[0], 2, 4, {});407        selectText408            .run()409            .then(function () {410                ok(eventMonitorObject.elementOneMousedownRaised);411                if (!featureDetection.isTouchDevice)412                    ok(eventMonitorObject.elementOneSelectRaised);413                ok(eventMonitorObject.elementOneMouseupRaised);414                ok(!eventMonitorObject.elementTwoMousedownRaised);415                ok(!eventMonitorObject.elementTwoSelectRaised);416                ok(!eventMonitorObject.elementTwoMouseupRaised);417                startNext();418            });419    });420    asyncTest('dblclick - change element on first "mousedown" event', function () {421        const eventMonitorObject = createMouseMonitorEventObject();422        const $div1 = addDiv(100, 100).css('background-color', 'red');423        const $div2 = addDiv(100, 300).css('background-color', 'green');424        bindMouseHandlersToSwappingElements($div1, $div2, 'mousedown', eventMonitorObject);425        const dblclick = new DblClickAutomation($div1[0], new ClickOptions());426        dblclick427            .run()428            .then(function () {429                ok(eventMonitorObject.elementOneMousedownRaised);430                ok(!eventMonitorObject.elementOneMouseupRaised);431                ok(!eventMonitorObject.elementOneClickRaised);432                ok(!eventMonitorObject.elementOneDblClickRaised);433                equal(eventMonitorObject.elementOneMousedownCount, 1);434                ok(eventMonitorObject.elementTwoMousedownRaised);435                ok(eventMonitorObject.elementTwoMouseupRaised);436                ok(eventMonitorObject.elementTwoClickRaised);437                ok(eventMonitorObject.elementTwoDblClickRaised);438                equal(eventMonitorObject.elementTwoMousedownCount, 1);439                equal(eventMonitorObject.elementTwoMouseupCount, 2);440                equal(eventMonitorObject.elementTwoClickCount, 1);441                startNext();442            });443    });444    asyncTest('dblclick - change element on first "mouseup" event', function () {445        const eventMonitorObject = createMouseMonitorEventObject();446        const $div1 = addDiv(100, 100).css('background-color', 'red');447        const $div2 = addDiv(100, 300).css('background-color', 'green');448        bindMouseHandlersToSwappingElements($div1, $div2, 'mouseup', eventMonitorObject);449        const dblclick = new DblClickAutomation($div1[0], new ClickOptions());450        dblclick451            .run()452            .then(function () {453                ok(eventMonitorObject.elementOneMousedownRaised);454                ok(eventMonitorObject.elementOneMouseupRaised);455                ok(eventMonitorObject.elementOneClickRaised);456                ok(!eventMonitorObject.elementOneDblClickRaised);457                equal(eventMonitorObject.elementOneMousedownCount, 1);458                equal(eventMonitorObject.elementOneMouseupCount, 1);459                equal(eventMonitorObject.elementOneClickCount, 1);460                ok(eventMonitorObject.elementTwoMousedownRaised);461                ok(eventMonitorObject.elementTwoMouseupRaised);462                ok(eventMonitorObject.elementTwoClickRaised);463                ok(eventMonitorObject.elementTwoDblClickRaised);464                equal(eventMonitorObject.elementTwoMousedownCount, 1);465                equal(eventMonitorObject.elementTwoMouseupCount, 1);466                equal(eventMonitorObject.elementTwoClickCount, 1);467                startNext();468            });469    });470    asyncTest('dblclick - change element on first "click" event', function () {471        const eventMonitorObject = createMouseMonitorEventObject();472        const $div1 = addDiv(100, 100).css('background-color', 'red');473        const $div2 = addDiv(100, 300).css('background-color', 'green');474        bindMouseHandlersToSwappingElements($div1, $div2, 'click', eventMonitorObject);475        const dblclick = new DblClickAutomation($div1[0], new ClickOptions());476        dblclick477            .run()478            .then(function () {479                ok(eventMonitorObject.elementOneMousedownRaised);480                ok(eventMonitorObject.elementOneMouseupRaised);481                ok(eventMonitorObject.elementOneClickRaised);482                ok(!eventMonitorObject.elementOneDblClickRaised);483                equal(eventMonitorObject.elementOneMousedownCount, 1);484                equal(eventMonitorObject.elementOneMouseupCount, 1);485                equal(eventMonitorObject.elementOneClickCount, 1);486                ok(eventMonitorObject.elementTwoMousedownRaised);487                ok(eventMonitorObject.elementTwoMouseupRaised);488                ok(eventMonitorObject.elementTwoClickRaised);489                ok(eventMonitorObject.elementTwoDblClickRaised);490                equal(eventMonitorObject.elementTwoMousedownCount, 1);491                equal(eventMonitorObject.elementTwoMouseupCount, 1);492                equal(eventMonitorObject.elementTwoClickCount, 1);493                startNext();494            });495    });496    asyncTest('dblclick - change element on second "mousedown" event', function () {497        const eventMonitorObject = createMouseMonitorEventObject();498        const $div1 = addDiv(100, 100).css('background-color', 'red');499        const $div2 = addDiv(100, 300).css('background-color', 'green');500        bindMouseHandlersToSwappingElements($div1, $div2, 'mousedown', eventMonitorObject, false, true);501        const dblclick = new DblClickAutomation($div1[0], new ClickOptions());502        dblclick503            .run()504            .then(function () {505                ok(eventMonitorObject.elementOneMousedownRaised);506                ok(eventMonitorObject.elementOneMouseupRaised);507                ok(eventMonitorObject.elementOneClickRaised);508                ok(!eventMonitorObject.elementOneDblClickRaised);509                equal(eventMonitorObject.elementOneMousedownCount, 2);510                equal(eventMonitorObject.elementOneMouseupCount, 1);511                equal(eventMonitorObject.elementOneClickCount, 1);512                ok(!eventMonitorObject.elementTwoMousedownRaised);513                ok(eventMonitorObject.elementTwoMouseupRaised);514                ok(!eventMonitorObject.elementTwoClickRaised);515                ok(!eventMonitorObject.elementTwoDblClickRaised);516                equal(eventMonitorObject.elementTwoMouseupCount, 1);517                startNext();518            });519    });520    asyncTest('dblclick - change element on second "mouseup" event', function () {521        const eventMonitorObject = createMouseMonitorEventObject();522        const $div1 = addDiv(100, 100).css('background-color', 'red');523        const $div2 = addDiv(100, 300).css('background-color', 'green');524        bindMouseHandlersToSwappingElements($div1, $div2, 'mouseup', eventMonitorObject, false, true);525        const dblclick = new DblClickAutomation($div1[0], new ClickOptions());526        dblclick527            .run()528            .then(function () {529                ok(eventMonitorObject.elementOneMousedownRaised);530                ok(eventMonitorObject.elementOneMouseupRaised);531                ok(eventMonitorObject.elementOneClickRaised);532                ok(eventMonitorObject.elementOneDblClickRaised);533                equal(eventMonitorObject.elementOneMousedownCount, 2);534                equal(eventMonitorObject.elementOneMouseupCount, 2);535                equal(eventMonitorObject.elementOneClickCount, 2);536                ok(!eventMonitorObject.elementTwoMousedownRaised);537                ok(!eventMonitorObject.elementTwoMouseupRaised);538                ok(!eventMonitorObject.elementTwoClickRaised);539                ok(!eventMonitorObject.elementTwoDblClickRaised);540                startNext();541            });542    });543    asyncTest('dblclick - change element on second "click" event', function () {544        const eventMonitorObject = createMouseMonitorEventObject();545        const $div1 = addDiv(100, 100).css('background-color', 'red');546        const $div2 = addDiv(100, 300).css('background-color', 'green');547        bindMouseHandlersToSwappingElements($div1, $div2, 'click', eventMonitorObject, false, true);548        const dblclick = new DblClickAutomation($div1[0], new ClickOptions());549        dblclick550            .run()551            .then(function () {552                ok(eventMonitorObject.elementOneMousedownRaised);553                ok(eventMonitorObject.elementOneMouseupRaised);554                ok(eventMonitorObject.elementOneClickRaised);555                ok(eventMonitorObject.elementOneDblClickRaised);556                equal(eventMonitorObject.elementOneMousedownCount, 2);557                equal(eventMonitorObject.elementOneMouseupCount, 2);558                equal(eventMonitorObject.elementOneClickCount, 2);559                ok(!eventMonitorObject.elementTwoMousedownRaised);560                ok(!eventMonitorObject.elementTwoMouseupRaised);561                ok(!eventMonitorObject.elementTwoClickRaised);562                ok(!eventMonitorObject.elementTwoDblClickRaised);563                startNext();564            });565    });566    asyncTest('dblclick - change element on "dblclick" event', function () {567        const eventMonitorObject = createMouseMonitorEventObject();568        const $div1 = addDiv(100, 100).css('background-color', 'red');569        const $div2 = addDiv(100, 300).css('background-color', 'green');570        bindMouseHandlersToSwappingElements($div1, $div2, 'dblclick', eventMonitorObject);571        const dblclick = new DblClickAutomation($div1[0], new ClickOptions());572        dblclick573            .run()574            .then(function () {575                ok(eventMonitorObject.elementOneMousedownRaised);576                ok(eventMonitorObject.elementOneMouseupRaised);577                ok(eventMonitorObject.elementOneClickRaised);578                ok(eventMonitorObject.elementOneDblClickRaised);579                equal(eventMonitorObject.elementOneMousedownCount, 2);580                equal(eventMonitorObject.elementOneMouseupCount, 2);581                equal(eventMonitorObject.elementOneClickCount, 2);582                ok(!eventMonitorObject.elementTwoMousedownRaised);583                ok(!eventMonitorObject.elementTwoMouseupRaised);584                ok(!eventMonitorObject.elementTwoClickRaised);585                ok(!eventMonitorObject.elementTwoDblClickRaised);586                startNext();587            });588    });589    asyncTest('type - change element on "keydown" event', function () {590        const eventMonitorObject = createKeyMonitorEventObject();591        const $input1 = addInputElement(200, 200, '');592        const $input2 = addInputElement(400, 400, '');593        bindKeyHandlersToSwappingElements($input1, $input2, 'keydown', eventMonitorObject);594        const type = new TypeAutomation($input1[0], 'a', new TypeOptions({ offsetX: 5, offsetY: 5 }));595        type596            .run()597            .then(function () {598                const expectedEventMonitorObject = {599                    elementsOneKeydownRaised:  true,600                    elementsOneKeypressRaised: false,601                    elementsOneKeyupRaised:    false,602                    elementsTwoKeydownRaised:  false,603                    elementsTwoKeypressRaised: true && !browserUtils.isAndroid,604                    elementsTwoKeyupRaised:    true605                };606                deepEqual(eventMonitorObject, expectedEventMonitorObject);607                equal($input1[0].value, '');608                equal($input2[0].value, 'a');609                startNext();610            });611    });612    asyncTest('type - change element on "keypress" event', function () {613        const eventMonitorObject = createKeyMonitorEventObject();614        const $input1 = addInputElement(200, 200, '');615        const $input2 = addInputElement(400, 400, '');616        bindKeyHandlersToSwappingElements($input1, $input2, 'keypress', eventMonitorObject);617        const type = new TypeAutomation($input1[0], 'a', new TypeOptions({ offsetX: 5, offsetY: 5 }));618        type619            .run()620            .then(function () {621                const expectedEventMonitorObject = {622                    elementsOneKeydownRaised:  true,623                    elementsOneKeypressRaised: true && !browserUtils.isAndroid,624                    elementsOneKeyupRaised:    browserUtils.isAndroid,625                    elementsTwoKeydownRaised:  false,626                    elementsTwoKeypressRaised: false,627                    elementsTwoKeyupRaised:    true && !browserUtils.isAndroid628                };629                deepEqual(eventMonitorObject, expectedEventMonitorObject);630                equal($input1[0].value, 'a');631                equal($input2[0].value, '');632                startNext();633            });634    });635    asyncTest('type - change element on "keyup" event', function () {636        const eventMonitorObject = createKeyMonitorEventObject();637        const $input1 = addInputElement(200, 200, '');638        const $input2 = addInputElement(400, 400, '');639        bindKeyHandlersToSwappingElements($input1, $input2, 'keyup', eventMonitorObject);640        const type = new TypeAutomation($input1[0], 'a', new TypeOptions({ offsetX: 5, offsetY: 5 }));641        type642            .run()643            .then(function () {644                const expectedEventMonitorObject = {645                    elementsOneKeydownRaised:  true,646                    elementsOneKeypressRaised: true && !browserUtils.isAndroid,647                    elementsOneKeyupRaised:    true,648                    elementsTwoKeydownRaised:  false,649                    elementsTwoKeypressRaised: false,650                    elementsTwoKeyupRaised:    false651                };652                deepEqual(eventMonitorObject, expectedEventMonitorObject);653                equal($input1[0].value, 'a');654                equal($input2[0].value, '');655                startNext();656            });657    });658    asyncTest('T210448: Unnecessary typing occurs if element was changed after keypress event', function () {659        const iFrameSrc    = window.QUnitGlobals.getResourceUrl('../../data/runner/iframe.html');660        const $inputIFrame = $('<input />');661        const testActions = function () {662            window.setTimeout(function () {663                $(document).bind('keypress', function () {664                    $inputIFrame.focus();665                });666                const press = new PressAutomation(parseKeySequence('f').combinations, {});667                press668                    .run()669                    .then(function () {670                        equal($inputIFrame[0].value, browserUtils.isWebKit ||671                                                     browserUtils.isFirefox ? '' : 'f', 'iframe\'s input value is correct');672                        startNext();673                    });674            });675        };676        createIFrame($inputIFrame, iFrameSrc, testActions);677    });...

formatmatch.js

Source:formatmatch.js

1module('plugins.formatmatch');2/*trace 973*/3test('ä¸ºä¸è¡æ æ ¼å¼çæåå·2ç§ä¸åçæ ¼å¼', function () {4    var editor = te.obj[0];5    var range = te.obj[1];6        editor.setContent('<p><strong>first</strong></p><p><em>second</em></p><p>third</p>');7        setTimeout(function () {8            var body = editor.body;9            range.setStart(body.firstChild.firstChild.firstChild, 2).collapse(true).select();10            editor.execCommand('formatmatch');11            range.selectNode(body.lastChild.firstChild).select();12            ua.mouseup(body);13            editor.addListener('mouseup', function () {14                equal(editor.queryCommandState('formatmatch'), 0, 'å·åç¶æä¸º0');15                equal(body.lastChild.innerHTML.toLowerCase(), '<em>third</em>');16                start();17            });18            range.setStart(body.lastChild.previousSibling.firstChild.firstChild, 2).collapse(true).select();19            editor.execCommand('formatmatch');20            range.selectNode(body.lastChild.firstChild).select();21            ua.mouseup(body);22            /*editorèªèº«è¿æäºä¸ä¸ªmouseupä¾¦å¬å¨ï¼å¿é¡»å¨ç¨ä¾æ§è¡åè°ç¨ï¼å¦å_selectionChangeæ¹æ³è°ç¨æ æ³åå°windowï¼ä¼æ¥é*/23        }, 50);24    stop();25});26/*trace 971*/27test('trace 971:ææ ¼å¼æåå·èªå·±', function () {28    var editor = te.obj[0];29    var range = te.obj[1];30        editor.setContent('<p><strong>æ¬¢è¿åä¸´</strong></p>');31        setTimeout(function () {32            var body = editor.body;33            var text = body.firstChild.firstChild.firstChild;34            range.setStart(text, 2).collapse(true).select();35            editor.addListener('mouseup', function () {36                equal(editor.getContent(), '<p><strong>æ¬¢</strong><strong>è¿åä¸´</strong></p>');37                start();38            });39            editor.execCommand('formatmatch');40            range.setStart(text, 0).setEnd(text, 1).select();41            ua.mouseup(editor.body);42        }, 50);43    stop();44});45//TODO 1.2.646//test( 'trace 1553:å±ä¸çæ é¢èªå·±å·èªå·±', function () {47//    var editor = te.obj[0];48//    var range = te.obj[1];49//    editor.setContent( '<h2 style="text-align:center">æ¬¢è¿ä½¿ç¨UEditorç¼è¾å¨</h2>' );50//    setTimeout( function () {51//        var body = editor.body;52//        var text = body.firstChild.firstChild;53//        range.setStart( text, 2 ).setEnd( text, 4 ).select();54//        editor.addListener( 'mouseup', function () {55//            if ( (ua.browser.gecko && ua.browser.gecko < 2)||ua.browser.ie ==9)56//                equal( editor.getContent(), '<h2 style="text-align:center;" >æ¬¢è¿ä½¿ç¨UEditorç¼è¾å¨</h2>' );57//            else58//                equal( editor.getContent(), '<h2 style="text-align:center" >æ¬¢è¿ä½¿ç¨UEditorç¼è¾å¨</h2>' );59//        } );60//        editor.execCommand( 'formatmatch' );61//        range.setStart( text, 5 ).setEnd( text, 6 ).select();62//        ua.mouseup( editor.body );63//        setTimeout( function () {64//            start();65//        }, 500 );66//    }, 50 );67//    stop();68//} );69/*trace:969*/70test('æ ¼å¼å·çç¶æåå°ï¼ééååºé´', function () {71    var editor = te.obj[0];72    var range = te.obj[1];73        editor.setContent('hello');74        setTimeout(function () {75            var body = editor.body;76            range.setStart(body.firstChild.firstChild, 2).collapse().select();77            editor.addListener('mouseup', function () {78                equal(editor.queryCommandState('formatmatch'), 0, 'å·åç¶æä¸º0');79                start();80            });81            editor.execCommand('formatmatch');82            equal(editor.queryCommandState('formatmatch'), 1, 'å·åç¶æä¸º1');83            range.setStart(body.firstChild.firstChild, 0).setEnd(body.firstChild.firstChild, 2).select();84            /*æ ¼å¼å·ä¾¦å¬mouseupäºä»¶ï¼selectæ¹æ³ä¸è½è§¦åmouseupï¼å æ¤å¿é¡»æå¨è§¦å*/85            ua.mouseup(editor.body);86        }, 50);87    stop();88});89/*trace 964*/90test('é»è®¤æ ¼å¼å¾çå·ææ ¼å¼çå¾ç', function () {91    var editor = te.obj[0];92    var range = te.obj[1];93        editor.setContent('hello<img width="200px" height="200px" style="float: left;background-color: red"/><img width="100px" height="200px"/>');94        setTimeout(function () {95            var img = editor.body.firstChild.lastChild;96            var img_new = img.previousSibling;97            range.selectNode(img).select();98            editor.addListener('mouseup', function () {99                equal(editor.queryCommandState('formatmatch'), 0, 'å·åç¶æä¸º0');100                if (!ua.browser.opera) {101                    equal(img_new.style.cssFloat || img_new.style.styleFloat, 'none', 'check style float', 'float');102                }103                equal(img_new.style.backgroundColor, 'red', 'check background color');104                start();105            });106            editor.execCommand('formatmatch');107            range.selectNode(img_new).select();108            ua.mouseup(editor.body);109        }, 50);110    stop();111});112/*trace 965*/113test('ææµ®å¨æ¹å¼å¾çå·é»è®¤çå¾ç', function () {114    var editor = te.obj[0];115    var range = te.obj[1];116        editor.setContent('hello<img width="200px" height="200px" style="float: left;background-color: red;width: 200px"/><img width="100px" height="200px"/>');117        setTimeout(function () {118            var img = editor.body.firstChild.lastChild.previousSibling;119            var img_new = img.nextSibling;120            range.selectNode(img).select();121            editor.addListener('mouseup', function () {122                equal(editor.queryCommandState('formatmatch'), 0, 'å·åç¶æä¸º0');123                if (!ua.browser.opera) {124                    equal(img_new.style.cssFloat || img_new.style.styleFloat, "left", 'check style float');125                }126                /*åªææµ®å¨æ¹å¼ä¼å·ï¼å¶ä»é½ä¸å·*/127                equal(img_new.style.backgroundColor, '', 'check background color');128                equal(img_new.style.width, '', 'check style width');129                equal($(img_new).attr('width'), 100, 'check width');130                start();131            });132            editor.execCommand('formatmatch');133            range.selectNode(img_new).select();134            ua.mouseup(editor.body);135        }, 50);136    stop();137});138/*trace 1068*/139test('ç¬å ä¸è¡å¾çå·é»è®¤çå¾ç', function () {140    var editor = te.obj[0];141    var range = te.obj[1];142        editor.setContent('hello<img width="200px" height="200px" style="background-color: red;width: 200px;display:block;"/><img width="100px" height="200px"/>');143        setTimeout(function () {144            var img = editor.body.firstChild.lastChild.previousSibling;145            var img_new = img.nextSibling;146            range.selectNode(img).select();147            editor.addListener('mouseup', function () {148                equal(editor.queryCommandState('formatmatch'), 0, 'å·åç¶æä¸º0');149                if (!ua.browser.opera) {150                    equal(img_new.style.display, "block", 'check display block');151                }152                start();153            });154            editor.execCommand('formatmatch');155            range.selectNode(img_new).select();156            ua.mouseup(editor.body);157        }, 50);158    stop();159});160/*trace 1068*/161test('é»è®¤çå¾çå¾çå·ç¬å ä¸è¡å¾ç', function () {162    var editor = te.obj[0];163    var range = te.obj[1];164        editor.setContent('hello<img width="200px" height="200px" style="background-color: red;width: 200px;display:block;"/><img width="100px" height="200px"/>');165        setTimeout(function () {166            var img = editor.body.firstChild.lastChild;167            var img_new = img.previousSibling;168            range.selectNode(img).select();169            editor.addListener('mouseup', function () {170                equal(editor.queryCommandState('formatmatch'), 0, 'å·åç¶æä¸º0');171                if (!ua.browser.opera) {172                    equal(img_new.style.display, "inline", 'check display block');173                }174                start();175            });176            editor.execCommand('formatmatch');177            range.selectNode(img_new).select();178            ua.mouseup(editor.body);179        }, 50);180    stop();181});182/*trace 939*/183test('trace 939:åæ¯åè¡¨å·è¡¨æ ¼åçåæ¯åè¡¨', function () {184    var editor = te.obj[0];185    var range = te.obj[1];186        editor.setContent('<ol style="list-style-type: lower-alpha;"><li>first</li><li>second</li></ol> <table><tbody><tr><td><ol style="list-style-type: lower-alpha;"><li>third</li><li>fourth</li></ol></td></tr></tbody></table>');187        setTimeout(function () {188            range.selectNode(editor.body.firstChild).select();189            editor.execCommand('formatmatch');190            editor.addListener('mouseup', function () {191                setTimeout(function () {192                    equal(editor.body.lastChild.getElementsByTagName('ol')[0].style.listStyleType, 'lower-alpha', 'æ¥çåè¡¨æ¯å¦ä»ç¶æ¯åæ¯ç');193                    start();194                }, 250);195            });196            range.selectNode(editor.body.lastChild).select();197            ua.mouseup(editor.body);198        }, 50);199    stop();200});201/*trace 938*/202test('ç¨æ ¼å¼å·å·æ´ä¸ªè¡¨æ ¼', function () {203    var editor = te.obj[0];204    var range = te.obj[1];205        editor.setContent('<p><span style="background: yellow">hello</span></p><table><tbody><tr><td></td></tr></tbody></table>');206        setTimeout(function () {207            range.selectNode(editor.body.firstChild).select();208            editor.addListener('mouseup', function () {209                /*æ´ä¸ªæ ¡éªæ¹æ³ä¸å¥½ï¼æ²¡æè§£å³æ ¹æºçé®é¢ï¼210                 æ ¡éªçç®çåºå½æ¯ä¸ä¼å¤åºä¸åºå½åºç°çåå®¹ï¼é¤äºmatchè¿å¯è½ä¼æå¶ä»å¤åºæ¥çåå®¹211                 ä½æ¯styleä¹ç±»çä¸è¥¿æ¯è¾é¾æ ¡éª*/212                equal(editor.body.innerHTML.indexOf('match'), -1, 'æ²¡ææå¥matchå ä½ç¬¦');213                start();214            });215            editor.execCommand('formatmatch');216            range.selectNode(editor.body.lastChild).select();217            editor.currentSelectedArr = [editor.body.lastChild.getElementsByTagName('td')[0]];218            ua.mouseup(editor.body);219        }, 50);220    stop();221});222test('è¡¨æ ¼å·ææ¬', function () {223    var editor = te.obj[0];224    var range = te.obj[1];225        editor.setContent('<p><span style="background: yellow">hello</span></p><table><tbody><tr><td>hello2</td></tr></tbody></table>');226        setTimeout(function () {227            range.selectNode(editor.body.lastChild).select();228//            editor.currentSelectedArr = [editor.body.lastChild.getElementsByTagName('td')[0]];229            editor.addListener('mouseup', function () {230                equal(editor.body.firstChild.innerHTML, 'hello', ' å»æhelloçæ ¼å¼');231                start();232            });233            editor.execCommand('formatmatch');234            setTimeout(function () {235                range.selectNode(editor.body.firstChild).select();236                ua.mouseup(editor.body);237            }, 50);238        }, 50);239    stop();240});241/*trace 1096*/242test('trace 1096ï¼1761:è¡¨æ ¼å·è¡¨æ ¼', function () {243    var editor = te.obj[0];244    var range = te.obj[1];245            editor.setContent('<p><span style="background: yellow">hello</span></p><table><tbody><tr><td>hello2</td><td></td></tr><tr><td></td><td>hello3</td></tr></tbody></table>');246            setTimeout(function () {247                var trs = editor.body.lastChild.getElementsByTagName('tr');248                var ut = editor.getUETable(editor.body.lastChild);249                var cellsRange = ut.getCellsRange(trs[0].cells[0], trs[1].cells[0]);250                ut.setSelected(cellsRange);251                range.setStart(trs[0].cells[0], 0).collapse(true).select();252                var tds = editor.body.lastChild.getElementsByTagName('td');253                editor.addListener('mouseup', function () {254                    ok(ua.isEqualArray(ut.selectedTds, [trs[0].cells[0], trs[1].cells[0]]), 'æ¯è¾éæ©çåºå');255//            equal( editor.body.getElementsByTagName('table')[0].getAttribute( 'border' ), '1', 'è¡¨æ ¼è¾¹æ¡å®½åº¦ç¸å' );      /*å¦ææ²¡ææå®borderï¼é£ä¹ä¸ä¸»å¨è®¾ç½®border*/256//            equal( tds[index].style['borderWidth'], '1px', 'è¡¨æ ¼è¾¹æ¡å®½åº¦ç¸å' );257//            equal( tds[index].style['borderStyle'], 'solid', 'è¡¨æ ¼è¾¹æ¡æ ·å¼ç¸å' );258                    for (var index = 0; index < tds.length; index++) {259                        equal(tds[index].style['borderColor'], tds[0].style['borderColor'], 'è¡¨æ ¼è¾¹æ¡é¢è²ç¸å');260                    }261                        start();262                });263                editor.execCommand('formatmatch');264//        editor.currentSelectedArr = [tds[1], tds[3]];265                range.setStart(tds[1], 0).setEnd(tds[3], 1).select();266                ua.mouseup(editor.body);267//            }, 50);268        }, 50);269    stop();270});271/*trace 1092, 991*/272test('ææ¬å·aæ ç¾(éå)', function () {273    var editor = te.obj[0];274    var range = te.obj[1];275            editor.setContent('hello<a href="http://www.baidu.com/">baidu</a>');276    setTimeout(function () {277        var p = editor.body.firstChild;278            var a = p.lastChild;279            range.selectNode(p.firstChild).select();280            /*ç»ææ¬å·ä¸åæ¯è²*/281            editor.execCommand('forecolor', 'rgb(255,0,0)');282            editor.addListener('mouseup', function () {283                var a = p.lastChild;284                ua.clearWhiteNode(a);285                equal(a.childNodes.length, 3, '3åèç¹');286                //1.2çæ¬ä¸ç©ºçspanéæå ä¸æçä¸å¯è§åç¬¦ï¼å·²ç»ä»æµè§å¨å¤å¶è¿æ¥äº287                ua.checkHTMLSameStyle('ba<span style=\"color: rgb(255,0,0)\"></span>idu', editor.document, a, 'check style');288                    start();289            });290            range.selectNode(p.firstChild).select();291            editor.execCommand('formatmatch');292            range.setStart(p.lastChild.firstChild, 2).collapse(true).select();293            ua.mouseup(editor.body);294        }, 50);295    stop();296});297test('ç¹äºæ ¼å¼å·åä¸å·ææ¬åç¹ä¸æ¬¡æ ¼å¼å·', function () {298    var editor = te.obj[0];299    var range = te.obj[1];300        editor.setContent('<p><strong>first</strong></p><p><em>second</em></p><p>third</p>');301        setTimeout(function () {302            var body = editor.body;303            range.setStart(body.firstChild.firstChild.firstChild, 2).collapse(true).select();304            editor.addListener('mouseup', function () {305                equal(editor.__allListeners['mouseup'].length, num - 1, 'mouseupçä¾¦å¬å¨è¢«å é¤');306                equal(editor.queryCommandState('formatmatch'), 0, 'å·åç¶æä¸º0');307                equal(body.lastChild.innerHTML.toLowerCase(), 'third');308                    start();309            });310            editor.execCommand('formatmatch');311            var num = editor.__allListeners['mouseup'].length;312            /*å é¤mouseupä¾¦å¬å¨åç´æ¥è¿å*/313            editor.execCommand('formatmatch');314            equal(editor.__allListeners['mouseup'].length, num - 1, 'å¦æç¬¬ä¸æ¬¡æ ¼å¼å·æ²¡æ§è¡ï¼ä¸ä¸æ¬¡æ ¼å¼å·ä¼åå»æä¸ä¸ä¸ªmouseupçä¾¦å¬å¨ç¶åç´æ¥éåº');315            ua.mouseup(body);316        }, 50);317    stop();318});319test('aæ ç¾å·ææ¬', function () {320    var editor = te.obj[0];321    var range = te.obj[1];322    setTimeout(function () {323        editor.setContent('hello<a href="http://www.baidu.com/"><span style="color: red; ">baidu</span></a>');324        setTimeout(function () {325            var p = editor.body.firstChild;326            var a = p.lastChild;327            range.setStart(a.firstChild.firstChild, 1).collapse(true).select();328            editor.addListener('mouseup', function () {329                /*firefoxä¸æ¯æouterHTML*/330                equal(p.firstChild.innerHTML, 'hello', 'spanåå«ææ¬');331                ok(p.firstChild.style['color'], 'red', 'æ¥çææ¬æ¯å¦æ·»å äºæ ·å¼');332                start();333            });334            editor.execCommand('formatmatch');335            range.selectNode(p.firstChild).select();336            ua.mouseup(editor.body);337        }, 50);338    },50);339    stop();...

magicbox.js

Source:magicbox.js

1(function() {2  var contentEditor = angular.module("contentEditor", []);3  4    // To create a empty resizable and draggable box5  contentEditor.directive("magicboxCreator", function($document, $compile) {6    return {7      restrict: 'A',8      link: function($scope, $element, $attrs) {9        $element.on("mousedown", function($event) {10          var newNode = $compile('<div class="contentEditorBox" ce-drag ce-resize></div>')($scope);11          12          newNode.css({13                position: "absolute",14            top: $event.pageY - 25 + "px",15            left: $event.pageX - 25 + "px",16                });17          18          angular.element($document[0].body).append(newNode);19        });20      }21    }22  });23  24    // To manage the drag25  contentEditor.directive("ceDrag", function($document) {26      return function($scope, $element, $attr) {27          var startX = 0, startY = 0;28      var newElement = angular.element('<div class="draggable"></div>');29      30      $element.append(newElement);31          newElement.on("mousedown", function($event) {32            $event.preventDefault();33            34                // To keep the last selected box in front35            angular.element(document.querySelectorAll(".contentEditorBox")).css("z-index", "0");36            $element.css("z-index", "1"); 37            38            startX = $event.pageX - $element[0].offsetLeft;39            startY = $event.pageY - $element[0].offsetTop;40            $document.on("mousemove", mousemove);41            $document.on("mouseup", mouseup);42          });43          44          function mousemove($event) {45            y = $event.pageY - startY;46            x = $event.pageX - startX;47            $element.css({48              top: y + "px",49              left:  x + "px"50            });51          }52          53          function mouseup() {54            $document.off("mousemove", mousemove);55            $document.off("mouseup", mouseup);56          }57        };58      });59  60    // To manage the resize61  contentEditor.directive("ceResize", function($document) {62    return function($scope, $element, $attr) {63      64            // Function to manage resize up event65      var resizeUp = function($event) {66        var top = $event.pageY;67        var height = $element[0].offsetTop + $element[0].offsetHeight - $event.pageY;68        69        if ($event.pageY < $element[0].offsetTop + $element[0].offsetHeight - 50) {70          $element.css({71            top: top + "px",72            height: height + "px"73          });74        } else {75          $element.css({76            top: $element[0].offsetTop + $element[0].offsetHeight - 50 + "px",77            height: "50px"78          }); 79        }80      };81      82            // Function to manage resize right event83      var resizeRight = function($event) {84        var width = $event.pageX - $element[0].offsetLeft;85        86        if ($event.pageX > $element[0].offsetLeft + 50) {87          $element.css({88            width: width + "px"89          });90        } else {91          $element.css({92            width: "50px",93          });94        }95      };96      97            // Function to manage resize down event98      var resizeDown = function($event) {99        var height = $event.pageY - $element[0].offsetTop;100        101        if ($event.pageY > $element[0].offsetTop + 50) {102          $element.css({103            height: height + "px"104          });105        } else {106          $element.css({107            height: "50px"108          });109        }110      };111      112            // Function to manage resize left event113      var resizeLeft = function($event) {114        var left = $event.pageX;115        var width = $element[0].offsetLeft + $element[0].offsetWidth - $event.pageX;116        117        if ($event.pageX < $element[0].offsetLeft + $element[0].offsetWidth - 50) {118          $element.css({119            left: left + "px",120            width: width + "px"121          });122        } else {123          $element.css({124            left: $element[0].offsetLeft + $element[0].offsetWidth - 50 + "px",125            width: "50px"126          });127        }128      };129      130            // Create a div to catch resize up event131      var newElement = angular.element('<div class="n-resize"></div>');132      $element.append(newElement);133      newElement.on("mousedown", function() {134        $document.on("mousemove", mousemove);135        $document.on("mouseup", mouseup);136        137            function mousemove($event) {138              $event.preventDefault();139              resizeUp($event);140            }141            142            function mouseup() {143              $document.off("mousemove", mousemove);144              $document.off("mouseup", mouseup);145            }146      });147      148            // Create a div to catch resize right event149      newElement = angular.element('<div class="e-resize"></div>');150      $element.append(newElement);151      newElement.on("mousedown", function() {152        $document.on("mousemove", mousemove);153            $document.on("mouseup", mouseup);154            155            function mousemove($event) {156              $event.preventDefault();157              resizeRight($event);158            }159            160            function mouseup() {161              $document.off("mousemove", mousemove);162              $document.off("mouseup", mouseup);163            }164      });165      166            // Create a div to catch resize down event167      newElement = angular.element('<div class="s-resize"></div>');168      $element.append(newElement);169      newElement.on("mousedown", function() {170        $document.on("mousemove", mousemove);171        $document.on("mouseup", mouseup);172        173            function mousemove($event) {174              $event.preventDefault();175              resizeDown($event);176            }177            178            function mouseup() {179              $document.off("mousemove", mousemove);180              $document.off("mouseup", mouseup);181            }182      });183      184            // Create a div to catch resize left event185      newElement = angular.element('<div class="w-resize"></div>');186      $element.append(newElement);187      newElement.on("mousedown", function() {188        $document.on("mousemove", mousemove);189        $document.on("mouseup", mouseup);190        191            function mousemove($event) {192              $event.preventDefault();193              resizeLeft($event);194            }195            196            function mouseup() {197              $document.off("mousemove", mousemove);198              $document.off("mouseup", mouseup);199            }200      });201      202            // Create a div to catch resize up left event203      newElement = angular.element('<div class="nw-resize"></div>');204      $element.append(newElement);205      newElement.on("mousedown", function() {206        $document.on("mousemove", mousemove);207        $document.on("mouseup", mouseup);208        209            function mousemove($event) {210              $event.preventDefault();211              resizeUp($event);212              resizeLeft($event);213            }214            215            function mouseup() {216              $document.off("mousemove", mousemove);217              $document.off("mouseup", mouseup);218            }219      });220      221            // Create a div to catch resize up right event222      newElement = angular.element('<div class="ne-resize"></div>');223      $element.append(newElement);224      newElement.on("mousedown", function() {225        $document.on("mousemove", mousemove);226        $document.on("mouseup", mouseup);227        228            function mousemove($event) {229              $event.preventDefault();230              resizeUp($event);231              resizeRight($event);232            }233            234            function mouseup() {235              $document.off("mousemove", mousemove);236              $document.off("mouseup", mouseup);237            }238      });239      240            // Create a div to catch resize down right event241      newElement = angular.element('<div class="se-resize"></div>');242      $element.append(newElement);243      newElement.on("mousedown", function() {244        $document.on("mousemove", mousemove);245        $document.on("mouseup", mouseup);246        247            function mousemove($event) {248              $event.preventDefault();249              resizeDown($event);250              resizeRight($event);251            }252            253            function mouseup() {254              $document.off("mousemove", mousemove);255              $document.off("mouseup", mouseup);256            }257      });258      259            // Create a div to catch resize down left event260      newElement = angular.element('<div class="sw-resize"></div>');261      $element.append(newElement);262      newElement.on("mousedown", function() {263        $document.on("mousemove", mousemove);264        $document.on("mouseup", mouseup);265            266            function mousemove($event) {267              $event.preventDefault();268              resizeDown($event);269              resizeLeft($event);270            }271            272            function mouseup() {273              $document.off("mousemove", mousemove);274              $document.off("mouseup", mouseup);275            }276      });277    };278  });...

dragdrop.js

Source:dragdrop.js

1const el= document.querySelector(".item");2let isResizing = false;3el.addEventListener("mousedown" , mousedown);4function mousedown(e) {5    window.addEventListener("mousemove", mousemove);6    window.addEventListener("mouseup", mouseup);7    let prevX = e.clientX;8    let prevY = e.clientY;9    function mousemove(e) {10        if(!isResizing){11            let newX = prevX - e.clientX;12            let newY = prevY - e.clientY;13            const rect = el.getBoundingClientRect();14            el.style.left = rect.left - newX + "px";15            el.style.top = rect.top - newY + "px";16            prevX = e.clientX;17            prevY = e.clientY;18        }19    }20    function mouseup() {21        window.removeEventListener("mousemove", mousemove);22        window.removeEventListener("mouseup", mouseup);23    }24}25const resizers = document.querySelectorAll(".resizer");26let currentResizer;27for (let resizer of resizers){28    resizer.addEventListener("mousedown", mousedown);29    function mousedown(e) {30        31        currentResizer = e.target;32        isResizing = true;33        let prevX = e.clientX;34        let prevY = e.clientY;35        window.addEventListener('mousemove', mousemove);36        window.addEventListener('mouseup', mouseup);37        function mousemove(e) {38            const rect = el.getBoundingClientRect();39            if(currentResizer.classList.contains('se')){40                el.style.width = rect.width - (prevX - e.clientX) + "px";41                el.style.height = rect.height - (prevY - e.clientY) + "px";42            }43            else if(currentResizer.classList.contains('sw')){44                el.style.width = rect.width + (prevX - e.clientX) + "px";45                el.style.height = rect.height - (prevY - e.clientY) + "px";46                el.style.left = rect.left - (prevX - e.clientX) + "px";47            }48            else if(currentResizer.classList.contains('ne')){49                el.style.width = rect.width + (prevX - e.clientX) + "px";50                el.style.height = rect.height - (prevY - e.clientY) + "px";51                el.style.left = rect.left - (prevX - e.clientX) + "px";52            }53            else{54                el.style.width = rect.width + (prevX - e.clientX) + "px";55                el.style.height = rect.height + (prevY - e.clientY) + "px";56                el.style.top = rect.top - (prevY - e.clientY) + "px";57                el.style.left = rect.left - (prevX - e.clientX) + "px";58            }59            prevX = e.clientX;60            prevY = e.clientY;61        }62        function mouseup() {63            window.removeEventListener('mousemove',mousemove);64            window.removeEventListener('mouseup',mouseup);65            isResizing = false;66        }67    }...

imageCrop.js

Source:imageCrop.js

1const el = document.querySelector(".resizers");2let isResizing = false;3el.addEventListener("mousedown",mousedown);4function mousedown(e){5  window.addEventListener("mousemove",mousemove);6  window.addEventListener("mouseup",mouseup);7  let prevX = e.clientX;8  let prevY = e.clientY;9  10  function mousemove(e){11    if(!isResizing){12      const rect = el.getBoundingClientRect();13      let newX = prevX - e.clientX;14      let newY = prevY - e.clientY; 15  16      el.style.left = rect.left - newX + "px";17      el.style.top = rect.top - newY + "px";18  19      prevX = e.clientX;20      prevY = e.clientY;21    }22  }23  function mouseup(){24    window.removeEventListener("mousemove", mousemove);25    window.removeEventListener("mouseup",mouseup);26  }27}28const resizers = document.querySelectorAll(".resizer");29let currentResizer;30for(let resizer of resizers){31  resizer.addEventListener("mousedown", mousedown);32  function mousedown(e){33    currentResizer = e.target;34    isResizing = true;35    window.addEventListener("mousemove",mousemove);36    window.addEventListener("mouseup",mouseup);37    let prevX = e.clientX;38    let prevY = e.clientY;39    function mousemove(e){40      const rect = el.getBoundingClientRect();41      let newX = prevX - e.clientX;42      let newY = prevY - e.clientY;43      if(currentResizer.classList.contains("top-left")){44        el.style.width = rect.width + newX + "px";45        el.style.height = rect.height + newY + "px";46        el.style.top = rect.top - newY + "px";47        el.style.left = rect.left - newX + "px";48      } else if(currentResizer.classList.contains("top-right")){49        el.style.width = rect.width - newX + "px";50        el.style.height = rect.height + newY + "px";51        el.style.top = rect.top - newY + "px";52      } else if(currentResizer.classList.contains("bottom-left")){53        el.style.width = rect.width + newX + "px";54        el.style.height = rect.height - newY + "px";55        el.style.left = rect.left - newX + "px";56      } else {57        el.style.width = rect.width - newX + "px";58        el.style.height = rect.height - newY + "px";59      }60      prevX = e.clientX;61      prevY = e.clientY;62    }63    function mouseup(){64      window.removeEventListener("mousemove",mousemove);65      window.removeEventListener("mouseup",mouseup);66      isResizing = false;67    }68  }69}...

mouse-click-events.js

Source:mouse-click-events.js

...26        debug("This test requires DumpRenderTree.  Click on the blue rect with different mouse buttons to log.")27        return;28    }29    eventSender.mouseDown(button);30    eventSender.mouseUp(button);31    eventSender.mouseDown(button);32    eventSender.mouseUp(button);33    // could test dragging here too34}35function testEvents(description, button, expectedString) {36    debug(description);37    sendEvents(button);38    shouldBeEqualToString("eventLog", expectedString);39    clearEventLog();40}41if (window.eventSender) {42    testEvents("Left Mouse Button", 0, "mousedown(0) mouseup(0) click(0) mousedown(0) mouseup(0) click(0) dblclick(0) ");43    testEvents("Middle Mouse Button", 1, "mousedown(1) mouseup(1) click(1) mousedown(1) mouseup(1) click(1) dblclick(1) ");44    testEvents("Right Mouse Button", 2, "mousedown(2) mouseup(2) mousedown(2) mouseup(2) ");45    testEvents("4th Mouse Button", 3, "mousedown(1) mouseup(1) click(1) mousedown(1) mouseup(1) click(1) dblclick(1) ");46}

MouseUp.js

Source:MouseUp.js

1'use strict';2/**3 * @module br/test/viewhandler/MouseUp4 */5var br = require('br/Core');6var Errors = require('br/Errors');7var ViewFixtureHandler = require('br/test/viewhandler/ViewFixtureHandler');8var Utils = require('br/test/Utils');9/**10 * @class11 * @alias module:br/test/viewhandler/MouseUp12 * @implements module:br/test/viewhandler/ViewFixtureHandler13 * 14 * @classdesc15 * <code>MouseUp</code> instances of <code>ViewFixtureHandler</code> can be used to trigger <code>mouseup</code> event for a view element.16 * Example usage:17 * 18 * <pre>when("test.page.(#aRealButton).mouseUp => true");</pre>19 */20function MouseUp() {21}22br.implement(MouseUp, ViewFixtureHandler);23MouseUp.prototype.set = function(eElement, mValues) {24	Utils.fireMouseEvent(eElement, 'mouseup', mValues);25};26MouseUp.prototype.get = function(eElement) {27	throw new Errors.InvalidTestError("The mouseUp event cannot be used in a doGiven or doThen");28};...

switcher.js

Source:switcher.js

1(function() {2  let mouseup = false;3  $('.switcher__label').mouseup(function(e) {4    mouseup = true;5    $(this).removeClass('focused');6  });7  $('.switcher__input').focus(function(e) {8      if (!mouseup) {9        $(this).parent().addClass('focused');10      }11      mouseup = false;12  });13  $('.switcher__input').blur(function(e) {14    $(this).parent().removeClass('focused');15  });16  $('.switcher-text__label').mouseup(function(e) {17    mouseup = true;18    $(this).removeClass('focused');19  });20  $('.switcher-text__input').focus(function(e) {21      if (!mouseup) {22        $(this).parent().addClass('focused');23      }24      mouseup = false;25  });26  $('.switcher-text__input').blur(function(e) {27    $(this).parent().removeClass('focused');28  });29  $('.switcher-icon__label').mouseup(function(e) {30    mouseup = true;31    $(this).removeClass('focused');32  });...

Using AI Code Generation

1var stf = require('devicefarmer-stf');2var device = stf.use('emulator-5554');3device.mouseUp(0.5,0.5);4    throw new Error('Adb not found');5    at Object.<anonymous> (C:\Users\user\Desktop\stf\node_modules\devicefarmer-stf\lib\adb.js:34:11)6    at Module._compile (module.js:570:32)7    at Object.Module._extensions..js (module.js:579:10)8    at Module.load (module.js:487:32)9    at tryModuleLoad (module.js:446:12)10    at Function.Module._load (module.js:438:3)11    at Module.require (module.js:497:17)12    at require (internal/module.js:20:19)13    at Object.<anonymous> (C:\Users\user\Desktop\stf\node_modules\devicefarmer-stf\lib\stf.js:3:17)14    at Module._compile (module.js:570:32)

Using AI Code Generation

1var stf = require('devicefarmer-stf-client');2client.mouseUp(0, 0);3var stf = require('devicefarmer-stf-client');4client.mouseDown(0, 0);5var stf = require('devicefarmer-stf-client');6client.mouseMove(0, 0);7var stf = require('devicefarmer-stf-client');8client.mouseScroll(0, 0);9var stf = require('devicefarmer-stf-client');10client.mouseWheel(0, 0);11var stf = require('devicefarmer-stf-client');12client.mouseClick(0, 0);13var stf = require('devicefarmer-stf-client');14client.mouseDoubleClick(0, 0);15var stf = require('devicefarmer-stf-client');16client.mouseLongClick(0, 0);17var stf = require('devicefarmer-stf-client');18client.mouseLongClick(0, 0);

Using AI Code Generation

1var stf = require('devicefarmer-stf');2var stf = new stf();3stf.mouseUp(100, 100);4var stf = require('devicefarmer-stf');5var stf = new stf();6stf.mouseUp(100, 100);7var stf = require('devicefarmer-stf');8var stf = new stf();9stf.mouseUp(100, 100);10var stf = require('devicefarmer-stf');11var stf = new stf();12stf.mouseUp(100, 100);13var stf = require('devicefarmer-stf');14var stf = new stf();15stf.mouseUp(100, 100);16var stf = require('devicefarmer-stf');17var stf = new stf();18stf.mouseUp(100, 100);19var stf = require('devicefarmer-stf');20var stf = new stf();21stf.mouseUp(100, 100);22var stf = require('devicefarmer-stf');23var stf = new stf();24stf.mouseUp(100, 100);25var stf = require('devicefarmer-stf');26var stf = new stf();27stf.mouseUp(100, 100);28var stf = require('devicefarmer-stf');29var stf = new stf();30stf.mouseUp(100, 100);31var stf = require('devicefarmer-stf');32var stf = new stf();33stf.mouseUp(100, 100);

Using AI Code Generation

1var DeviceFarmer = require('devicefarmer-stf-client');2var deviceFarmer = new DeviceFarmer();3    return deviceFarmer.getDevices();4}).then(function(devices) {5    console.log("Devices: ", devices);6    var device = devices[0];7    return device.connect();8}).then(function(device) {9    console.log("connected to device: ", device);10    device.mouseUp(100, 100);11});

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.