Firefox中无用户交互调用history.pushState导致popstate事件不触发的问题咨询

大家好，我最近遇到一个关于浏览器历史API的棘手问题，卡在Firefox上了，想请教下各位开发者：

我通过history.pushState在页面加载完成后，不需要用户交互（比如点击按钮）的情况下自动修改URL，这个逻辑在Chrome和其他不少浏览器里都运行正常，但在Firefox里出了问题——当用户点击浏览器的返回按钮时，popstate事件完全没有按预期触发。

预期行为 #

• 页面加载完成后，URL自动变更为/new-url
• 用户点击浏览器返回按钮时，popstate事件触发，控制台能打印出对应的日志信息

Firefox下的实际行为 #

• URL确实能正常修改为/new-url
• 点击返回按钮时，popstate事件毫无反应，控制台也没有任何报错信息

下面是我简化后的测试代码：

window.addEventListener('load', () => {
  history.pushState({ page: 1 }, '', '/new-url');
});

window.addEventListener('popstate', (event) => {
  console.log('Popstate fired:', event.state);
});

我已经尝试过以下几种方案，但问题依然只在Firefox中存在：

• 把pushState调用包裹在setTimeout里延迟执行
• 确保DOM完全加载完成后再执行pushState
• 从DOMContentLoaded事件回调中触发pushState
• 在调用pushState之前先执行replaceState

我的疑问 #

这是不是Firefox在无用户交互场景下使用pushState的已知行为或者限制？有没有什么可靠的 workaround 能让这种场景下的popstate事件正常触发？

内容来源于stack exchange