Edited at

Electronのwebviewの`new-window`イベントで取得できるurlが`about:blank`になってしまう

More than 1 year has passed since last update.

https://electronjs.org/docs/api/webview-tag#event-new-window

webviewのnew-window イベントを使って別ウインドウへのリンクをブラウザに飛ばす。

というやつをやりたかったのだが、callbackで得られるurlが about:blank になってしまって開く先のURLがわからないという問題に遭遇した。

https://github.com/electron/electron/issues/1458

このissueっぽいが治ってない?

issueの一番新しいコメントで言われている方法で解決してみたメモ。

<body onload="onLoad()">

<webview src="https://paper.dropbox.com/"></webview>
</body>

let clientX, clientY

function onLoad() {
const {shell} = require('electron')
const webview = document.querySelector('webview')
window.addEventListener('mousedown', e => {
// mousedownイベント時に座標を保存しておく
clientX = e.clientX;
clientY = e.clientY;
})
webview.addEventListener('dom-ready', () => {
webview.addEventListener('new-window', (e) => {
e.preventDefault();
const bbox = webview.getBoundingClientRect();
const guestPageX = clientX - bbox.left;
const guestPageY = clientY - bbox.top;
// 座標からaタグを取得し、そこからhrefを取得する
const script = 'document.elementFromPoint('+guestPageX+','+guestPageY+')["href"]'
webview.executeJavaScript(
"document.elementFromPoint(".concat(guestPageX, ",", guestPageY, ")['href']"),
false,
(realURL) => {
shell.openExternal(realURL);
}
);
})
})
}
</script>