キャプチャーブラウザー(その後)
IEコンポーネントを使ったキャプチャーブラウザーの開発ですが、 ブラウザーの挙動もなんとかなって、現在ほぼ完成しています。 公開の目途が建ちました。
ただ開発していて気になった点としては、 画面表示は許しても、印刷は禁止しているWEBのページ(やアプリケーション)は よくあるケースだと思います。
キャプチャーブラウザーでも画面のイメージを画像に保存することは 初期の段階で実現していましたが、テキスト情報も保ったままPDFにしたい場合は PDF印刷をする事になります。この際に印刷用のスタイルシートで 印刷させないような作りになっているとそのままでは希望のPDFが作成できません。
方法として考えたのが、
- 印刷はJavaScriptで行う。
- JavaScriptのイベントで印刷直前に都合のよい印刷用スタイルシートに再設定する。
という方法です。
- JavaScriptを注入する方法はすでに行っていたので少しの修正で可能でした。
- 印刷前のイベントはIEであれば
window.onbeforeprint
で可能です。 - 一番苦労したのは印刷用スタイルシート(display: none;で無くす)を動的に再設定する方法です。
結果的には
var element = document.createElement('style');
element.setAttribute('type', 'text/css');
element.setAttribute('media', 'print');
でできました。
setAttribute('media', 'print');
とするのが重要でした。
新たに作成したスタイルを対象のセレクター(クラス名やID)のスタイルとしてhtmlの後方(後ろの方が優先されるため)に追加すれば
希望の通りのスタイルで印刷できました。
こちらの機能は残念ならがセレクターの指定がWEBページに依存する為に汎用的な機能としては キャプチャーブラウザーに組み込んでいません(セレクターを画面から指定する様にすれば可能ですが)。