<html>
    <head>
      <base href="https://bugs.webkit.org/">
    </head>
    <body><table border="1" cellspacing="0" cellpadding="8">
        <tr>
          <th>Bug ID</th>
          <td><a class="bz_bug_link 
          bz_status_NEW "
   title="NEW - Incorrect caret position while scrolling in an contentEditable component"
   href="https://bugs.webkit.org/show_bug.cgi?id=186186">186186</a>
          </td>
        </tr>

        <tr>
          <th>Summary</th>
          <td>Incorrect caret position while scrolling in an contentEditable component
          </td>
        </tr>

        <tr>
          <th>Product</th>
          <td>WebKit
          </td>
        </tr>

        <tr>
          <th>Version</th>
          <td>Safari Technology Preview
          </td>
        </tr>

        <tr>
          <th>Hardware</th>
          <td>Macintosh
          </td>
        </tr>

        <tr>
          <th>OS</th>
          <td>macOS 10.13
          </td>
        </tr>

        <tr>
          <th>Status</th>
          <td>NEW
          </td>
        </tr>

        <tr>
          <th>Severity</th>
          <td>Normal
          </td>
        </tr>

        <tr>
          <th>Priority</th>
          <td>P2
          </td>
        </tr>

        <tr>
          <th>Component</th>
          <td>HTML Editing
          </td>
        </tr>

        <tr>
          <th>Assignee</th>
          <td>webkit-unassigned@lists.webkit.org
          </td>
        </tr>

        <tr>
          <th>Reporter</th>
          <td>richardyrh928@gmail.com
          </td>
        </tr>

        <tr>
          <th>CC</th>
          <td>wenson_hsieh@apple.com
          </td>
        </tr></table>
      <p>
        <div>
        <pre>Created <span class=""><a href="attachment.cgi?id=341739" name="attach_341739" title="Image demonstrating bug.">attachment 341739</a> <a href="attachment.cgi?id=341739&action=edit" title="Image demonstrating bug.">[details]</a></span>
Image demonstrating bug.

To reproduce, create a contentEditable div with overflowing content and overflow: scroll. Here's a pre-made fiddle for you convenience: <a href="https://jsfiddle.net/vyyu0rwc/3/">https://jsfiddle.net/vyyu0rwc/3/</a>
Click on the content so a caret shows and flashes; now scroll the content (with the caret visible) and notice how the caret position is fixed in place before it disappears, instead of scrolling along with the content. Notice in the attachment (it's pretty bad screenshot), how the caret can appear between lines when scrolling the content due to this bug.</pre>
        </div>
      </p>


      <hr>
      <span>You are receiving this mail because:</span>

      <ul>
          <li>You are the assignee for the bug.</li>
      </ul>
    </body>
</html>