CaretPosition: getClientRect() method
Baseline
2025
Newly available
Since December 2025, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
The getClientRect() method of the CaretPosition interface returns the client rectangle for the caret range.
Syntax
js
getClientRect()
Parameters
None.
Return value
A DOMRect object.
Examples
Get the caret's screen position
html
<input aria-label="text field" value="Click inside this input field" />
js
document.querySelector("input").addEventListener("click", (event) => {
const x = event.clientX;
const y = event.clientY;
const caret = document.caretPositionFromPoint?.(x, y);
if (!caret) {
log("Not supported");
return;
}
const rect = caret.getClientRect();
log(`Caret bounding rect: ${JSON.stringify(rect)}`);
log(`Caret is at (${rect.x.toFixed(2)}, ${rect.y.toFixed(2)})`);
});
Specifications
| Specification |
|---|
| CSSOM View Module # dom-caretposition-getclientrect |