textarea-centering.html | Explore in Territory

<!DOCTYPE html>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<body style="margin: 0;">
  <center style="width: 100px;">
    <textarea style="width: 50px; height: 50px; display: block; box-sizing: border-box;"></textarea>
  </center>
</body>
<script>
test(() => {
  const textarea = document.querySelector('textarea');
  assert_equals(textarea.offsetLeft, 25);
  assert_equals(textarea.offsetWidth, 50);

  eventSender.mouseMoveTo(70, 45);
  eventSender.mouseDown();
  eventSender.leapForward(100);
  eventSender.mouseMoveTo(80, 45);
  eventSender.mouseUp();

  // <textarea> grows by 10px.
  assert_equals(textarea.offsetLeft, 20);
  assert_equals(textarea.offsetWidth, 60);
}, 'Resizing a centered textarea should remain centered.');
</script>

chromium/third_party/blink/web_tests/wpt_internal/html/rendering/non-replaced-elements/textarea-centering.html