How can I check if contenteditable caret is inside { }

Question

Okay so i'm currently attempting to make a text editor for css, basically I need to add a tab automatically on new line if the caret is inside { }. I have tried a few ways to go about this and have removed it all as nothing seemed to work, any and all help is appreciated.

Answer 1

Use the Selection API . It has everything you need. Including detecting where the cursor is, determining the surrounding HTML elements and characters, etc.

It is meant to help with identifying selected text but is very robust.

https://developer.mozilla.org/en-US/docs/Web/API/Selection