Right now CSSOM-1 specifies the following:

partial interface Document {
  CaretPosition? caretPositionFromPoint(double x, double y, ShadowRoot... shadowRoots);
};

However, it's common in editors to want to place a popover under the user's existing caret, to give them contextual auto-complete information. For example typing : in a textarea on GitHub.com results in an emoji picker being shown, while @ results in a username list being shown. For short form content it's fine to position these popups to the textareas rect but it's much better usability if we can position them close to the user's caret. Unfortunately there isn't a great way to handle this. The solution we use today is to clone the textarea as a div, and copy a bunch of its layout effecting computes styles (such as font, size, writing direction, borders) over so that we can get a Range back from the div (it's not possible to get a Range from the <textarea>'s text content. With the Range we can get the boundingClientRect.

caretPositionFromPoint seems like it might be a reasonable solution to this however it seems as though this method would find a nearest theoretical caret (please correct me if I'm wrong here), while what we likely need is "get the currently visible caret inside the textarea". It's likely that with this API we'll still need to do the clone/range hack to get sufficient position data just to get the point to query the caret position.

I'd like to propose an API instead like:

partial interface Element {
  CaretPosition? currentCaretPosition()
};

This method would return the currently visible caret of the node, if it had one (so if it was an active textarea, input, or contenteditable). If it didn't have a visible caret, it would return null.

/cc @sanketj & @smaug---- with whom I've already discussed this idea.