third_party/WebKit/LayoutTests/fast/text/flexbox-selection-nested.html

   1 <!DOCTYPE html>
   2 <style>
   3 #root {
   4   background-color: #ddd;
   5   font-size: 24pt;
   6   position: relative;
   7   width: 200px;
   8 }
   9 .flexbox {
  10   display: flex;
  11 }
  12 .flexbox * {
  13   width: 100px;
  14 }
  15 </style>
  16
  17 This test verifies that a selection spanning nested flexbox boundaries
  18 is drawn correctly.
  19
  20 <div id="root">
  21   <div class="flexbox">
  22     <span id="start">aaa</span>
  23     <div class="flexbox"><span>bbb</span></div>
  24   </div>
  25   <div class="flexbox">
  26     <span>ccc</span>
  27     <div class="flexbox"><span id="end">ddd</span></div>
  28   </div>
  29 </div>
  30 <script>
  31
  32 var start = document.querySelector('#start'),
  33     end = document.querySelector('#end');
  34 getSelection().setBaseAndExtent(start.firstChild, 1, end.firstChild, 2);
  35 focus();
  36
  37 </script>