ifameのonafterprintが発火されない問題

Question

実現したいこと

ページ内にiframeを作りPDFを埋め込み、iframe内のPDFを印刷させる機能を作っています。
印刷まではうまくいっていますが、プリント後のonafterprintにiframeを消す部分が発火されず実行されません。

fetch(url)
  .then(response => response.blob())
  .then(blob => {
    // BlobをURLに変換する
    const pdfUrl = URL.createObjectURL(blob);

    // PDFを表示するためのiframeを作成
    const iframe = document.createElement("iframe");
    iframe.style.display = "none";
    document.body.appendChild(iframe);

    // iframeの中にPDFを表示する
    iframe.src = pdfUrl;
    iframe.onload = () => {
      if (iframe.contentWindow) {
        iframe.contentWindow.print();
        // TODO : なぜかonafterprintが呼ばれない
        iframe.contentWindow.onafterprint = function () {
          console.log("Print completed.");
          document.body.removeChild(iframe);
        };
      }
    };
  })
  .catch(error => {
    console.error(error);
  })

試したこと

以下のように生成したPDFUrlをsrcとして指定しなかった場合は、onafterprintが発火され、iframeが消えてくれました。

 iframe.src = "";

色々試してみましたが、お手上げ状態です。
srcが指定ありと指定なしで動作の違いがあることが全く分かりません。

追記
入れ替えても動きませんでした。

  if (iframe.contentWindow) {
        iframe.contentWindow.onafterprint = function () {
          console.log("Print completed.");
          document.body.removeChild(iframe);
        };
        iframe.contentWindow.print();
}

Comments

[m.ts10806]

タイトル誤字してるので修正願います

Answer 1

どうでしょうか

iframe.onload = () => {

  if (iframe.contentWindow) {

    iframe.contentWindow.onafterprint = function () {

      console.log("Print completed.");

      document.body.removeChild(iframe);

    };

    setTimeout(function(){
        iframe.contentWindow.print();
    },1000);

  }

};

Comments

[muteki_gamer]

ありがとうございます。こちらのdelayを入れたところ思っていた動作になりました！

Answer 2

iframeにonafterprintイベントを設定する前に
print()が呼ばれているからだと思います。

チェックしていませんが下記だとどうでしょうか。

iframe.onload = () => {
  if (iframe.contentWindow) {
    iframe.contentWindow.onafterprint = function () {
      console.log("Print completed.");
      document.body.removeChild(iframe);
    };
    iframe.contentWindow.print();
  }
};

Comments

[muteki_gamer]

回答ありがとうございます。
試したことに書くのを忘れていました。こちらの入れ替えたもパターンでも動きませんでした。
質問に書いてある通り、srcに何も指定しなかった場合は、質問記載の順序でも発火することから、printモーダルが立ち上がった後にonafterprintをバインドしても発火するようです。