touch-pointer-mouse.html | Explore in Territory

<!DOCTYPE HTML>
<script src="../../../resources/js-test.js"></script>
<style>
div.box {
  height: 100px;
  width: 100px;
  background-color: red;
}
</style>

<div class="box" id="target"></div>

<div id="console"></div>

<script>
description("Verifies that canceling pointerdowns for touches correctly suppresses mouseevents.");

var preventDefaultPrimary = false;
var uniqueId = 1233;

function init() {
  var events = [
    "mouseup",
    "mousedown",
    "mousemove",
    "pointerup",
    "pointerdown",
    "pointermove",
    "pointercancel",
    "click",
    "touchstart",
    "touchend",
    "touchmove",
    "touchcancel",
  ];

  events.forEach(function(event) {
    document.getElementById("target").addEventListener(event, function(e) {
      var isPrimary = e.isPrimary;
      var desc = [];
      if (e.type.startsWith("pointer") && isPrimary)
        desc.push("primary");
      if (e.type == "pointerdown" && preventDefaultPrimary == isPrimary) {
        e.preventDefault();
        desc.push("canceled");
      }
      debug("Received " + e.type + " " + desc);
    });
  });
}

function testTapWithPairedGE() {
  var rect = document.getElementById("target").getBoundingClientRect();
  var x = rect.left + 50;
  var y = rect.top + 50;

  uniqueId++;
  var tapWidth = 30;
  var tapHeight = 30;

  eventSender.addTouchPoint(x, y);
  eventSender.touchStart(uniqueId);
  eventSender.gestureTapDown(x, y, tapWidth, tapHeight, uniqueId);

  eventSender.releaseTouchPoint(0);
  eventSender.touchEnd();
  eventSender.gestureTap(x, y);
}

function testTapWithoutPairedGE() {
  var rect = document.getElementById("target").getBoundingClientRect();
  var x = rect.left + 50;
  var y = rect.top + 50;

  uniqueId++;
  var tapWidth = 30;
  var tapHeight = 30;

  eventSender.addTouchPoint(x, y);
  eventSender.touchStart(uniqueId);
  eventSender.releaseTouchPoint(0);
  eventSender.touchEnd();

  eventSender.addTouchPoint(x, y);
  uniqueId++;
  eventSender.touchStart(uniqueId);
  eventSender.releaseTouchPoint(0);
  eventSender.touchEnd();

  eventSender.gestureTapDown(x, y, tapWidth, tapHeight, uniqueId);
  eventSender.gestureTap(x, y);
  uniqueId++;

  eventSender.gestureTapDown(x, y, tapWidth, tapHeight, uniqueId);
  eventSender.gestureTap(x, y);
}

function testLongPressWithPairedGE() {
  var rect = document.getElementById("target").getBoundingClientRect();
  var x = rect.left + 50;
  var y = rect.top + 50;

  uniqueId++;
  var tapWidth = 30;
  var tapHeight = 30;

  eventSender.addTouchPoint(x, y);
  eventSender.touchStart(uniqueId);
  eventSender.gestureTapDown(x, y, tapWidth, tapHeight, uniqueId);

  eventSender.cancelTouchPoint(0);
  eventSender.touchCancel();

  eventSender.gestureLongPress(x, y, tapWidth, tapHeight, uniqueId);
  uniqueId++;
  eventSender.gestureLongTap(x, y, tapWidth, tapHeight, uniqueId);
}

function testLongPressWithoutPairedGE() {
  var rect = document.getElementById("target").getBoundingClientRect();
  var x = rect.left + 50;
  var y = rect.top + 50;

  uniqueId++;
  var tapWidth = 30;
  var tapHeight = 30;

  eventSender.addTouchPoint(x, y);
  eventSender.touchStart(uniqueId);
  eventSender.cancelTouchPoint(0);
  eventSender.touchCancel();

  uniqueId++;
  eventSender.gestureTapDown(x, y, tapWidth, tapHeight, uniqueId);
  eventSender.gestureLongPress(x, y);
  eventSender.gestureLongTap(x, y);

  uniqueId++;
  eventSender.gestureTapDown(x, y, tapWidth, tapHeight, uniqueId);
  eventSender.gestureLongPress(x, y);
  eventSender.gestureLongTap(x, y);
}

function runTests() {
  [false, true, false].forEach(function(boolVal) {
    debug("=== With primary pointerdown " + (boolVal ? "canceled" : "uncanceled") +" ===");
    preventDefaultPrimary = boolVal;

    debug("-- Tap with paired GEs --");
    testTapWithPairedGE();

    debug("-- Tap without paired GEs --");
    testTapWithoutPairedGE();

    debug("-- Long-press with paired GEs --");
    testLongPressWithPairedGE();

    debug("-- Long-press without paired GEs --");
    testLongPressWithoutPairedGE();

    debug("");
  });
}

init();
if (window.eventSender)
  runTests();
else
  debug("This test requires eventSender");

</script>
chromium/third_party/blink/web_tests/fast/events/pointerevents/touch-pointer-mouse.html
