【Electron】指定DIVをPDFで出力したい

Question

質問

Electronで、指定部分（例えばDIV）をPDFにして出力する機能を付けたいのですが、
うまくいきません。

jsPDF.jsと言うものを使ってみたのですが、どうもElectronとは相性が悪いようで、定義されているメソッドが定義されていないと出ます。

調べていくと、Electron自体にページをPDF化するメソッドが備わっているようです。
しかし、これはページ全体をPDFとして出力するような感じでかかれています。
（英語が苦手なので、雰囲気そう感じ取りました。）

指定divだけをPDFにするにはどうすればよいでしょうか。
ご存じの方がいらっしゃいましたら、ご教示願います。
よろしくお願いいたします。

蛇足

stack overflowさんで、「How to print a DIV in ElectronJS」という質問を見つけました。
ここのやり方をコピペしたのですがそのままでは動きませんでした。

そしてさらには、
「ボタンを押したらあるDIVをPDFにして出力」したいので、
常にウインドウを２つ出しているのには抵抗があります。

とりあえず、ipcMain.on("printPDF",の部分を以下のように書き換えましたが、
workerWindowがundefinedと出ます。
もちろんworkerWindowは、グローバルにvarで定義しております。

// retransmit it to workerWindow
	ipcMain.on("printPDF", (event, content) => {
		console.log(content);
		
		workerWindow = new BrowserWindow();
		workerWindow.loadURL("file://" + __dirname + "/worker.html");
		// workerWindow.hide();
		workerWindow.webContents.openDevTools();
		workerWindow.on("closed", () => {
			workerWindow = undefined;
		});

		workerWindow.webContents.send("printPDF", content);
	});

環境

MacOS X Yosemite 10.10.5
Electron 1.4.12（最新…ですよね？）
materialize 0.97.8
jQuery 3.1.1

Answer 1

はじめに

どこでundefinedになるのかが分からなかったのですが、類似の処理を行っていたので検証用のソースを載せます。

検証環境

macOS Sierra 10.12.3
Electron v1.6.0
materialize 0.98.0
jQuery 3.1.1

コード

実行可能なコード一式
https://github.com/usazukinchan/electron-sample-print-to-pdf

• メインプロセス側の処理(抜粋)

注意した点は、workerページが準備完了した後に要求を投げるようにすること。

var workerWindow = null;
...
// mainページからの印刷要求
ipcMain.on("print-to-pdf", (event, content) => {
  if (workerWindow !== null) {
    // エラーにより前回のページが残っていたら閉じる
    workerWindow.close();
  }

  workerWindow = new BrowserWindow({ show: false });
  workerWindow.loadURL("file://" + __dirname + "/worker.html");
  workerWindow.openDevTools();

  workerWindow.on("closed", () => {
    workerWindow = null;
  });

  // workerページが準備完了した後に要求を投げるようにする
  workerWindow.on("ready-to-show", () => {
    workerWindow.send("print-to-pdf", content);
  });
});

// workerページからの準備完了通知
ipcMain.on("ready-print-to-pdf", (event) => {
  const pdfPath = path.join(app.getPath("temp"), "print.pdf");
  const options = { printBackground: true };

  workerWindow.webContents.printToPDF(options, (error, data) => {
    if (error) {
      throw error;
    }
    fs.writeFile(pdfPath, data, (error) => {
      if (error) {
        throw error;
      }
      // プレビュー表示
      shell.openItem(pdfPath);
      // PDFファイルは書き込み済みなのでworkerページは閉じても大丈夫
      workerWindow.close(); 
    });
  });
});