Support behavior of IME #547
Description
The input with IME cannot passed to the browser in neko properly.
Steps:
-
Input in local browser
-
Input in neko
I roughly checked related issues, and
- related: support Chinese #252, Hello developers! How can I input Chinese characters in Neko Docker browser? #305, as they couldn't send anything to the browser, the temporary solution is to use an "IME in browser".
- not related: any issues about locale or fonts.
Simple HTML for reproduction:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<title>IME Event Test</title>
<style>
body {
font-family: sans-serif;
padding: 20px;
}
#log {
white-space: pre-wrap;
border: 1px solid #ccc;
padding: 10px;
height: 200px;
overflow-y: scroll;
}
input,
textarea {
width: 100%;
font-size: 16px;
padding: 8px;
margin-bottom: 10px;
}
</style>
</head>
<body>
<h2>IME Event Test</h2>
<input id="input" type="text" placeholder="input" />
<textarea id="textarea" rows="4" placeholder="textarea"></textarea>
<div id="log"></div>
<script>
const logEl = document.getElementById('log');
function logEvent(e) {
logEl.textContent += `[${e.type}] data: "${e.data || ''}"\n`;
logEl.scrollTop = logEl.scrollHeight;
}
const input = document.getElementById('input');
const textarea = document.getElementById('textarea');
['keydown', 'compositionstart', 'compositionupdate', 'compositionend', 'input'].forEach(eventType => {
input.addEventListener(eventType, logEvent, true);
textarea.addEventListener(eventType, logEvent, true);
});
</script>
</body>
</html>