infrastructure/testdriver/actions/penPointerEvents.html

<!DOCTYPE html>
<meta charset="utf-8">
<title>TestDriver actions: pointerevent properties of pen type</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/testdriver.js"></script>
<script src="/resources/testdriver-actions.js"></script>
<script src="/resources/testdriver-vendor.js"></script>

<style>
div#test {
  position: fixed;
  touch-action: none;
  top: 5px;
  left: 5px;
  width: 100px;
  height: 100px;
  background-color: blue;
}
</style>

<div id="test">
</div>

<script>
let typeList = [];
let pointerTypeList = [];
let buttonList = [];
let buttonsList = [];
let pointerMovePosition = [];
let pointerDownPosition = [];
let pointerUpPosition = [];
let pointerEnterPosition = [];
let pointerLeavePosition = [];

async_test(t => {
  let test = document.getElementById("test");
  var eventList = ['pointerover', 'pointerenter', 'pointermove', 'pointerdown', 'pointerup', 'pointerout', 'pointerleave'];
  for (eventType of eventList) {
    test.addEventListener(eventType, e => {
      typeList.push(e.type);
      pointerTypeList.push(e.pointerType);
      buttonList.push(e.button);
      buttonsList.push(e.buttons);
      if (e.type == "pointermove")
        pointerMovePosition.push([e.clientX, e.clientY].toString());
      if (e.type == "pointerdown")
        pointerDownPosition.push([e.clientX, e.clientY].toString());
      if (e.type == "pointerup")
        pointerUpPosition.push([e.clientX, e.clientY].toString());
      if (e.type == "pointerenter")
        pointerEnterPosition.push([e.clientX, e.clientY].toString());
      if (e.type == "pointerleave")
        pointerLeavePosition.push([e.clientX, e.clientY].toString());
    });
  }

  let div = document.getElementById("test");
  let actions = new test_driver.Actions()
    .addPointer("penPointer1", "pen")
    .pointerMove(0, 0)
    .pointerMove(10, 10)
    .pointerMove(0, 0, {origin: test})
    .pointerDown()
    .pointerMove(15, 0, {origin: test})
    .pointerMove(30, 0, {origin: test})
    .pointerUp()
    .pointerMove(0, 0)
    .send()
    .then(t.step_func_done(() => {
      assert_array_equals(typeList, ["pointerover", "pointerenter",
          "pointermove",  "pointermove", "pointerdown", "pointermove",
          "pointermove", "pointerup", "pointerout", "pointerleave"]);
      assert_array_equals(pointerTypeList, ["pen", "pen", "pen", "pen", "pen",
          "pen", "pen", "pen", "pen", "pen"]);
      assert_array_equals(buttonList, [-1, -1, -1, -1, 0, -1, -1, 0, -1, -1]);
      assert_array_equals(buttonsList, [0, 0, 0, 0, 1, 1, 1, 0, 0, 0]);
      assert_array_equals(pointerMovePosition, ["10,10", "55,55", "70,55", "85,55"]);
      assert_array_equals(pointerDownPosition, ["55,55"]);
      assert_array_equals(pointerUpPosition, ["85,55"]);
      assert_array_equals(pointerEnterPosition, ["10,10"]);
      assert_array_equals(pointerLeavePosition, ["0,0"]);
  })).catch(e => t.step_func(() => assert_unreached("Actions sequence failed " + e)));
});
</script>