为什么window.open在桌面PWA中显示空白屏幕（看起来很模糊）？

Question

在已安装的台式机PWA上，由于Chrome 73（在MacOS上）当我对带有常规URL的click事件执行window.open()时，页面已完全加载，但窗口为空白。

看起来很模糊，但是没有任何可见的叠加标签（在devtools的控制台和网络标签中，一切正常）

我尝试使用默认的Chrome主题，两者都使用了Mojave的暗亮模式。

HTML标记：

<a href="https://jakearchibald.github.io/svgomg/" data-index="2" data-category="svg" rel="noopener noreferrer" class="data-app-button">
  <span class="app-name">SVGOMG</span>
</a>

JavaScript：

// clicks
document.addEventListener(
    "click",
    function (event) {
      if (event.target.closest("[data-app-index]")) {
        let appID = event.target.closest("[data-app-index]").getAttribute("data-app-index");
        return openApp(appID);
      }
    },
    false
);


// openApp() - a regular window.open()
const openApp = appID => {
    event.preventDefault();

    // get app options
    let appOptions = State.appList[appID];
    appOptions.window = appOptions.window || {};

    // merge with defaults
    let defaultWindow = State.getDefaultWindow;
    let options = Object.assign({}, defaultWindow, appOptions.window);

    // center window
    options.left = screen.width / 2 - options.width / 2;
    options.top = screen.height / 2 - options.height / 2;

    // translate to window.open args
    let args = [];
    for (let [key, val] of Object.entries(options)) args.push(`${key}=${val}`);
    args = args.join(",");

    // open app
    return window.open(appOptions.url, appOptions.name, args);
};

在更新到Chrome 73之前，所有操作均按预期方式进行：window.open()函数可正确显示网页。

现在打开窗口，但是看不到任何东西。

Answer 1

好的，我想我找到了解决方案：我注意到在打开窗口之后，父窗口（PWA）就重新获得了焦点。因此，它的行为就像是弹出式窗口。由于弹出式窗口确实是一种不良/恶意行为，因此我认为Chrome浏览器阻止了子弹出窗口。

所以我删除了事件回调上的return语句：

// I changed this:
return openApp(appID);

// to this:
openApp(appID);

父窗口似乎不再占据焦点，弹出窗口内容正确显示。