mirror of
https://github.com/LadybirdBrowser/ladybird
synced 2026-04-26 01:35:08 +02:00
58 lines
1.6 KiB
HTML
58 lines
1.6 KiB
HTML
<!DOCTYPE html>
|
|
<script src="../include.js"></script>
|
|
<p id="text" contenteditable style="width: 120px">hello 👩🏼❤️👨🏻 there
|
|
my 👩🏼❤️👨🏻 friends!</p>
|
|
<script>
|
|
test(() => {
|
|
// We need to ensure layout has occurred for arrow navigation to have a layout node to interact with.
|
|
document.body.offsetWidth;
|
|
|
|
const segmenter = new Intl.Segmenter("en", { granularity: "grapheme" });
|
|
const content = text.innerText.trim();
|
|
|
|
const cursorLocation = () => {
|
|
return window.getSelection().getRangeAt(0).startOffset;
|
|
};
|
|
|
|
const graphemeAtLocation = (cursor) => {
|
|
const segments = segmenter.segment(content.substring(cursor));
|
|
return Array.from(segments)[0].segment;
|
|
};
|
|
|
|
const moveCursor = direction => {
|
|
internals.sendKey(text, direction);
|
|
|
|
const cursor = cursorLocation();
|
|
const character = graphemeAtLocation(cursor);
|
|
|
|
println(`${direction}: position=${cursor} character="${character}"`);
|
|
};
|
|
|
|
moveCursor("Home");
|
|
|
|
moveCursor("Right");
|
|
moveCursor("Right");
|
|
moveCursor("Right");
|
|
moveCursor("Right");
|
|
moveCursor("Right");
|
|
|
|
moveCursor("Down");
|
|
moveCursor("Left");
|
|
moveCursor("Up");
|
|
|
|
moveCursor("Right");
|
|
moveCursor("Right");
|
|
moveCursor("Right");
|
|
moveCursor("Right");
|
|
|
|
moveCursor("Down");
|
|
moveCursor("Up");
|
|
moveCursor("Down");
|
|
|
|
moveCursor("Left");
|
|
moveCursor("Left");
|
|
|
|
moveCursor("Up");
|
|
});
|
|
</script>
|