Chrome扩展开发：如何通过addEventListener拦截ChatGPT的Enter键提交，仅在异步条件满足时触发提交

看起来你已经走对了大部分路子，但Enter键的默认提交没被拦住，大概率是事件监听的阶段或时机出了问题，导致ChatGPT自身的提交逻辑优先级比你的拦截代码更高。咱们一步步来解决：

问题根源分析 #

你的代码里event.preventDefault()和stopPropagation()是同步调用的，理论上应该能阻止默认行为，但没生效的核心原因可能是：

1. ChatGPT的Enter键提交监听是在事件捕获阶段注册的，而你的监听器默认在冒泡阶段运行——这就导致ChatGPT的逻辑先触发，你再拦已经晚了。
2. 极端情况下，ChatGPT可能动态更新了DOM结构，导致你选择的prompt-textarea元素不是实际绑定提交逻辑的那个（不过你说按钮点击正常，这个概率较低）。

修正后的完整代码 #

直接调整事件监听逻辑，重点启用捕获阶段监听，同时强化事件阻止的力度：

const textarea: HTMLTextAreaElement | null = document.getElementById(
  'prompt-textarea'
) as HTMLTextAreaElement | null;

function addEventListeners(
  textarea: HTMLTextAreaElement | null,
  button: HTMLButtonElement | null
): void {
  // 第三个参数设为true，强制在捕获阶段处理事件
  textarea?.addEventListener('keydown', async (event) => {
    // 先过滤不符合条件的事件，减少不必要的逻辑执行
    if (!event.isTrusted || event.code !== 'Enter' || event.shiftKey) return;

    // 同步执行所有阻止逻辑，确保抢在ChatGPT的逻辑前生效
    event.stopImmediatePropagation(); // 阻止同元素上后续的所有监听器（比如ChatGPT自己的）
    event.preventDefault(); // 彻底阻止Enter键的默认提交行为
    event.stopPropagation(); // 阻止事件冒泡到上层元素

    // 执行异步判断逻辑
    const proceed = await shouldProceedComponent(textarea);
    if (proceed) {
      button?.click();
      chrome.runtime.sendMessage({ detections: 0 });
    }
  }, true); // 关键：捕获阶段监听
}

关键修改细节说明 #

1. 捕获阶段监听（第三个参数true）：事件在DOM中传递时，会先经过捕获阶段（从顶层元素到目标元素），再进入冒泡阶段（从目标元素到顶层）。把你的监听器放在捕获阶段，就能抢在ChatGPT的冒泡阶段监听器之前处理事件，确保阻止逻辑先生效。
2. event.stopImmediatePropagation()：如果ChatGPT在捕获阶段也注册了监听器，这个方法能直接阻止同元素上后续的所有监听器执行，比stopPropagation的拦截范围更彻底。
3. 简化异步逻辑：直接把事件处理函数设为async，去掉嵌套的立即执行异步函数，代码更清晰，执行顺序也更明确。

结合你已尝试操作的补充优化 #

1. 你验证shouldProceedComponent返回值的做法完全正确——可以在函数内部加console.log，确认返回false时确实不会进入提交逻辑。
2. event.isTrusted的判断必须保留，能有效过滤脚本触发的假事件，避免误拦截。
3. 额外确认DOM元素选择器：ChatGPT偶尔会更新DOM结构，打开开发者工具检查textarea的id是否还是prompt-textarea，如果变了，改用属性选择器（比如document.querySelector('textarea[data-testid="prompt-textarea"]')）会更稳定。

最后验证步骤 #

1. 按下Enter键时，先看控制台是否输出shouldProceedComponent的预期返回值。
2. 当返回false时，确认textarea没有自动提交内容，按钮也没被点击。
3. 返回true时，确认按钮点击正常触发，消息能成功提交。

这样调整后，Enter键的默认提交应该能被可靠拦截，完全符合你的需求。

备注：内容来源于stack exchange，提问作者dev john