きっかけはこの辺から。
ブラウザ上の任意の要素を画面いっぱいに表示するには、Element.requestFullscreen()というAPIを使います。
このAPIですが、どうもwindow.open()によって開かれたウィンドウから、元のウィンドウを操作することはできないようです。
というのも該当のAPIをウィンドウから開くとエラーが返るので。
document.body.requestFullscreen() // Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: undefined (ウィンドウが最大化される) window.opener.document.body.requestFullscreen() // Promise {<rejected>: TypeError: fullscreen error // at <anonymous>:1:29}[[Prototype]]: Promise[[PromiseState]]: "rejected"[[PromiseResult]]: TypeError: fullscreen error // at <anonymous>:1:29(画面はなにも変わらない)
Chromeはwebkitプレフィックスをつけてもメソッドが呼び出せるらしいので使ってみるも、そちらもうまくいかず。
window.opener.document.body.webkitRequestFullscreen(); // -> undefined (なにもおこらない)
undefinedじゃあないんだよ・・・(まあこちらはdocument.body.webkitRequestFullscreen()を呼んでもなにもundefinedが返るのでそもそもそういうものっぽい)。
ちなみに「F11(ウィンドウの全画面化)」をエミュレーションすればなんとかなるのか？と思いましたが、それもダメっぽいです。
document.dispatchEvent( new KeyboardEvent( "keydown", { keyCode: 122 }) ); // -> trueが返って来るも、なにもおこらない
まあここは素直にユーザーに全画面表示の操作を提示するのが筋 というところでしょうか。
