title: Is the caret on the first line of the textarea? On the last line?
body: <p>Given a textarea with a not fixed width font, I want to know on key up if the caret (as given by <code>element.selectionEnd</code>) is in the first line or in the last line of the text.</p>
  
  <p><img src="https://i.stack.imgur.com/Iqj1o.png" alt="Enter image description here"></p>
  
  <p>To avoid bad answers, here are some solutions which <em>don't</em> work:</p>
  
  <ul>
  <li>Splitting on <code>\n</code>: A sentence can be broken in two lines, because it's too long for the textarea's width.</li>
  <li>Measuring the text before the caret (for example by copying the text into a div with same style and measuring the height of the span): Some characters <em>after</em> the caret may change the wrapping point (usually between words).</li>
  </ul>
  
  <p>Here's a fiddle for the tests and to remove some ambiguity (yes, it's a <code>textarea</code> element, and it's not only one line, etc.): <a href="http://jsbin.com/qifezupu/4/edit" rel="nofollow noreferrer">http://jsbin.com/qifezupu/4/edit</a></p>
  
  <p>Notes:</p>
  
  <ul>
  <li>I don't care for Internet Explorer 9- or mobile browsers.</li>
  <li>I need a reliable solution, working for all positions of the caret.</li>
  <li>There are a lot of tricky details which make most ideas unusable in practice, please build a working fiddle before answering.</li>
  </ul>