Prevent scrollToAnnotation when key pressed on ThreadCard children

src/sidebar/components/ThreadCard.tsx

@@ -82,8 +82,13 @@ function ThreadCard({ frameSync, thread }: ThreadCardProps) {
       onMouseLeave={() => setThreadHovered(null)}
       onKeyDown={e => {
         // Simulate default button behavior, where `Enter` and `Space` trigger
-        // click action
-        if (['Enter', ' '].includes(e.key) && thread.annotation) {
+        // click action.
+        // Make sure the event was triggered on the card itself and not a children
+        if (
+          e.target === cardRef.current &&
+          ['Enter', ' '].includes(e.key) &&
+          thread.annotation
+        ) {
           scrollToAnnotation(thread.annotation);
         }
       }}

src/sidebar/components/test/ThreadCard-test.js

@@ -127,10 +127,23 @@ describe('ThreadCard', () => {
         );
       });
 
+      it('does not scroll to annotation when event target is not the Card', () => {
+        const wrapper = createComponent();
+
+        // Trigger keydown through the prop itself, as `target` cannot be
+        // overwritten on an event
+        wrapper.find(threadCardSelector).prop('onKeyDown')({
+          key,
+          target: 'foo',
+        });
+
+        assert.notCalled(fakeFrameSync.scrollToAnnotation);
+      });
+
       it('does not scroll to annotation when it is not set', () => {
         const wrapper = createComponent({ thread: {} });
 
-        wrapper.find(threadCardSelector).simulate('keypress', { key });
+        wrapper.find(threadCardSelector).simulate('keydown', { key });
 
         assert.notCalled(fakeFrameSync.scrollToAnnotation);
       });