Chromium 107中window.open打开新标签页无法获焦问题咨询

问题现象 #

在Chromium内核107版本中，调用window.open(url,'_blank')打开新标签页时，新页面无法自动获得焦点；该问题仅出现于107版本，此前Chromium版本及Firefox浏览器均无此异常。

测试代码示例：

// code before
{
  let url = "https://google.com";
  window.open(url,"_blank");
}

额外测试细节：

• 直接在浏览器控制台执行上述代码，新标签页可正常获焦
• 尝试添加return true、event.preventDefault()或event.stopImmediatePropagation()均无法解决问题
• 将这段window.open相关代码移至代码块顶部时，新标签页能正常获得焦点

原因分析 #

这是Chromium 107版本针对弹窗焦点控制的用户交互触发校验逻辑收紧导致的。从该版本开始，Chromium会严格校验window.open的调用上下文：

• 仅当调用处于用户交互事件（如点击、键盘输入）的同步执行栈内时，新标签页才会自动获得焦点
• 如果调用位置脱离了用户交互的同步上下文（比如在异步操作后、或事件回调的后续复杂逻辑中执行），Chromium会判定这并非用户主动触发的弹窗，从而将新标签页置于后台，不赋予焦点

控制台执行属于用户主动触发的同步操作，因此不受此限制；而将代码移至顶部时，仍处于用户交互的同步执行栈内，符合校验规则，所以能正常获焦。

解决方案 #

• 直接同步调用：将window.open放在用户交互事件回调的最前端位置，确保调用处于用户交互的同步执行栈内
• 预创建标签页：如果必须在后续逻辑中打开目标页面，可先在用户交互时创建空白标签页并保留引用，后续再修改标签页的location.href并调用focus()：

  // 用户交互事件回调内
  const newTab = window.open('about:blank', '_blank');
  // 后续逻辑（可包含异步操作）
  setTimeout(() => {
    newTab.location.href = 'https://google.com';
    newTab.focus();
  }, 1000);
  

内容的提问来源于stack exchange，提问作者Arnoud Kooi