How to use mouseup method in chromeless

Best JavaScript code snippet using chromeless

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

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

copy

Full Screen

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

Full Screen

Full Screen

formatmatch.js

Source:formatmatch.js Github

copy

Full Screen

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

Full Screen

Full Screen

magicbox.js

Source:magicbox.js Github

copy

Full Screen

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

Full Screen

Full Screen

dragdrop.js

Source:dragdrop.js Github

copy

Full Screen

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

Full Screen

Full Screen

imageCrop.js

Source:imageCrop.js Github

copy

Full Screen

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

Full Screen

Full Screen

mouse-click-events.js

Source:mouse-click-events.js Github

copy

Full Screen

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

Full Screen

Full Screen

MouseUp.js

Source:MouseUp.js Github

copy

Full Screen

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

Full Screen

Full Screen

switcher.js

Source:switcher.js Github

copy

Full Screen

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

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const Chromeless = require('chromeless').Chromeless2async function run() {3 const chromeless = new Chromeless()4 .type('chromeless', 'input[name="q"]')5 .press(13)6 .wait('#resultStats')7 .screenshot()8 await chromeless.end()9}10run().catch(console.error.bind(console))

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const Chromeless = require('chromeless').Chromeless2async function run() {3 const chromeless = new Chromeless()4 .type('chromeless', 'input[name="q"]')5 .click('input[name="btnK"]')6 .wait('#resultStats')7 .screenshot()8 await chromeless.end()9}10run().catch(console.error.bind(console))11const Chromeless = require('chromeless').Chromeless12async function run() {13 const chromeless = new Chromeless()14 .type('chromeless', 'input[name="q"]')15 .click('input[name="btnK"]')16 .wait('#resultStats')17 .screenshot()18 await chromeless.end()19}20run().catch(console.error.bind(console))21The code above is taken from the example of chromeless (

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const Chromeless = require('chromeless').Chromeless2async function run() {3 const chromeless = new Chromeless()4 .type('chromeless', 'input[name="q"]')5 .mousedown(0,0)6 .mouseup(0,0)7 .click(0,0)8 .wait('#resultStats')9 .screenshot()10 await chromeless.end()11}12run().catch(console.error.bind(console))13const Chromeless = require('chromeless').Chromeless14async function run() {15 const chromeless = new Chromeless()16 .type('chromeless', 'input[name="q"]')17 .mousedown(0,0)18 .mouseup(0,0)19 .click(0,0)20 .wait('#resultStats')21 .screenshot()22 await chromeless.end()23}24run().catch(console.error.bind(console))25const Chromeless = require('chromeless').Chromeless26async function run() {27 const chromeless = new Chromeless()28 .type('chromeless', 'input[name="q"]')29 .click(0,0)30 .wait('#resultStats')31 .screenshot()32 await chromeless.end()33}34run().catch(console.error.bind(console))

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1var chromeless = new Chromeless();2 .type('chromeless', 'input[name="q"]')3 .click('input[name="btnK"]')4 .wait('#resultStats')5 .evaluate(() => {6 })7 .then(title => console.log('title', title))8 .catch(console.error)9 .then(() => chromeless.end());10var chromeless = new Chromeless();11 .click('#btn')12 .click('#link')13 .wait('#resultStats')14 .evaluate(() => {15 })16 .then(title => console.log('title', title))17 .catch(console.error)18 .then(() => chromeless.end());19var chromeless = new Chromeless();20 .click('#btn')21 .click('#link')22 .wait('#resultStats')23 .evaluate(() => {24 })25 .then(title => console.log('title', title))26 .catch(console.error)27 .then(() => chromeless.end());28var chromeless = new Chromeless();29 .click('#btn')30 .click('#link')31 .wait('#resultStats')32 .evaluate(() => {33 })34 .then(title => console.log('title', title))35 .catch(console.error)

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const chromeless = new Chromeless()2 .mouseup(200, 300)3 .evaluate(() => {4 return { x: window.mouseX, y: window.mouseY }5 })6await chromeless.end()7### new Chromeless(config?)8 - cdp: `Object` - optional - [chrome-remote-interface](

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const Chromeless = require('chromeless').Chromeless2const chromeless = new Chromeless()3async function run() {4 .type('chromeless', 'input[name="q"]')5 .press(13)6 .wait('#resultStats')7 .mouseUp('body')8 .screenshot()9 console.log(screenshot)10 await chromeless.end()11}12run().catch(console.error.bind(console))13const Chromeless = require('chromeless').Chromeless14const chromeless = new Chromeless()15async function run() {16 .type('chromeless', 'input[name="q"]')17 .press(13)18 .wait('#resultStats')19 .mouseUp('body')20 .screenshot()21 console.log(screenshot)22 await chromeless.end()23}24run().catch(console.error.bind(console))25const Chromeless = require('chromeless').Chromeless26const chromeless = new Chromeless()27async function run() {28 .type('chromeless', 'input[name="q"]')29 .press(13)30 .wait('#resultStats')31 .mouseUp('body')32 .screenshot()33 console.log(screenshot)34 await chromeless.end()35}36run().catch(console.error.bind(console))37const Chromeless = require('chromeless').Chromeless38const chromeless = new Chromeless()39async function run() {40 .type('chromeless', 'input[name="q"]')41 .press(13)

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const chromeless = new Chromeless();2 .type('chromeless', 'input[name="q"]')3 .press(13)4 .wait('#resultStats')5 .evaluate(() => {6 })7 .end()8const chromeless = new Chromeless();9 .type('chromeless', 'input[name="q"]')10 .press(13)11 .wait('#resultStats')12 .evaluate(() => {13 })14 .end()15const chromeless = new Chromeless();16 .type('chromeless', 'input[name="q"]')17 .press(13)18 .wait('#resultStats')19 .evaluate(() => {20 })21 .end()22const chromeless = new Chromeless();23 .type('chromeless', 'input[name="q"]')24 .press(13)25 .wait('#resultStats')26 .evaluate(() => {27 })28 .end()29const chromeless = new Chromeless();30 .type('chromeless', 'input[name="q"]')

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const Chromeless = require('chromeless').Chromeless2async function run() {3 const chromeless = new Chromeless()4 .type('chromeless', 'input[name="q"]')5 .click('input[name="btnK"]')6 .wait('div#resultStats')7 .screenshot()8 await chromeless.end()9}10run().catch(console.error.bind(console))11const Chromeless = require('chromeless').Chromeless12async function run() {13 const chromeless = new Chromeless()14 .type('chromeless', 'input[name="q"]')15 .click('input[name="btnK"]')16 .wait('div#resultStats')17 .screenshot()18 await chromeless.end()19}20run().catch(console.error.bind(console))21const Chromeless = require('chromeless').Chromeless22async function run() {23 const chromeless = new Chromeless()24 .type('chromeless', 'input[name="q"]')25 .click('input[name="btnK"]')26 .wait('div#resultStats')27 .screenshot()28 await chromeless.end()29}30run().catch(console.error.bind(console))

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1var fs = require('fs');2var Chromeless = require('chromeless').Chromeless;3var chromeless = new Chromeless()4var x = 0;5var y = 0;6 .wait(1000)7 .mouseDown(0, 0)8 .wait(1000)9 .evaluate(function() {10 return [window.mouseX, window.mouseY];11 })12 .then(function(result) {13 x = result[0];14 y = result[1];15 console.log(x, y);16 fs.writeFile('coords.txt', x + ' ' + y, function(err) {17 if (err) {18 return console.log(err);19 }20 console.log('The file was saved!');21 });22 })23 .end()24 .catch(function(err) {25 console.error(err);26 });

Full Screen

Full Screen

Automation Testing Tutorials

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

LambdaTest Learning Hubs:

YouTube

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

Run chromeless automation tests on LambdaTest cloud grid

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

... View sample repo... View DocumentationSign up Free
›
_

Try LambdaTest Now !!

Get 100 minutes of automation test minutes FREE!!

...
Sign up with GoogleSign up with Email
Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful