fix(ui): preserve IME composition in comment inputs (#3228)

Thanks for extending the existing IME handling to comment inputs and documenting the browser-event checks. We will also protect the annotation Escape handlers from cancelling composition.

packages/ui/src/lib/browser/annotationOverlay.test.ts

@@ -67,6 +67,19 @@ describe('annotation overlay script', () => {
     expect(script).toContain('event.stopPropagation();');
   });
 
+  test('does not attach a comment while IME composition is active', () => {
+    const handlerStart = script.indexOf('var onCommentKeyDown = function (event) {');
+    const handlerEnd = script.indexOf('};', handlerStart);
+    expect(handlerStart).toBeGreaterThan(-1);
+    expect(handlerEnd).toBeGreaterThan(handlerStart);
+
+    const handler = script.slice(handlerStart, handlerEnd);
+    const imeGuard = handler.indexOf('event.isComposing || event.keyCode === 229');
+    const attachCall = handler.indexOf('attach();');
+    expect(imeGuard).toBeGreaterThan(-1);
+    expect(attachCall).toBeGreaterThan(imeGuard);
+  });
+
   test('escapes a label that would otherwise close the script', () => {
     const hostile = buildAnnotationOverlayScript(theme, {
       ...labels,

packages/ui/src/lib/browser/annotationOverlay.ts

@@ -545,6 +545,8 @@ export const buildAnnotationOverlayScript = (
   var onCommentKeyDown = function (event) {
     // Do not let the annotated page treat typed letters as its own shortcuts.
     event.stopPropagation();
+    // WebKit can report the composition-confirming Enter as keyCode 229.
+    if (event.isComposing || event.keyCode === 229) return;
     if (event.key === 'Enter' && !event.shiftKey) {
       event.preventDefault();
       attach();