overriden_user_select_in_shadow_tree.html

<!doctype HTML>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>

<div id="shadow_host" style="user-select: none; -moz-user-select: none; background: orange; padding: 20%;" slot="hereplz">foo</div>

<script>
test(function() {
  assert_not_equals(window.eventSender, undefined, 'This test requires window.eventSender');

  let selection = window.getSelection();
  function moveAndDoubleClick(element) {
    eventSender.mouseMoveTo(element.offsetLeft + element.offsetWidth / 2, element.offsetTop + element.offsetHeight / 2);
    eventSender.mouseDown();
    eventSender.mouseUp();
    eventSender.leapForward(1);
    eventSender.mouseDown();
    eventSender.mouseUp();
    eventSender.leapForward(1);
  }

  selection.removeAllRanges();
  moveAndDoubleClick(document.getElementById("shadow_host"));
  // 'foo' is under user-select: none.
  assert_equals(selection.toString(), '', 'selection.toString');

  // Make sure the shadow tree's style overrides the style
  // of the shadow host.
  let shadow_host = document.getElementById("shadow_host");
  let shadow_root = shadow_host.attachShadow({mode: 'open'});
  let slot = document.createElement('slot');
  slot.name = 'hereplz';
  let shadow_span = document.createElement('span');
  shadow_span.textContent = 'shadowbar';
  shadow_span.style.userSelect = 'text';
  slot.appendChild(shadow_span);
  shadow_root.appendChild(slot);

  // 'shadowbar' comes from the shadow tree and overrides the style of its host.
  moveAndDoubleClick(shadow_span);
  assert_equals(selection.toString(), 'shadowbar', 'selection.toString');
});
</script>
chromium/third_party/blink/web_tests/editing/selection/mouse/overriden_user_select_in_shadow_tree.html
