How to save printer-friendly version as HTML?

Question

Example: Amazon AWS account activity contains a "printer friendly version". It displays another window with a printer-optimized version of my billing statement and opens print dialog. When I print, save as PDF or cancel the popup window disappears. I'd like to keep it open.

Print/save to PDF option uses too large font, wraps line and causes couple last lines to flow to another page. I reckon if I could access content opened in a popup in the browser, I could change font size and then print or try some other things.

In general I'm looking for a way to prevent browser from closing the popup after printing.

Answer 1

You could use the Web Developer extension. It allows you to display the print styles for a given site:

Answer 2

The problem was that the content was generated dynamically when I click "Printer Friendly Version". Fortunately JS code that does is not obfuscated/minified. Link's href is href="javascript:printBillSummary()" and the method sits right there in page body. Full content is here: http://pastie.org/3806630 but most interesting piece is at the end:

var printWindow = window.open(windowUrl, windowName, 'left=50000,top=50000,width=0,height=0');
printWindow.document.write(printContentWrapper.html());
printWindow.document.close();
printWindow.focus();
printWindow.print();
printWindow.close();

I added debugger breakpoint at the first line with "close" and clicked the link. Then I got a small window in bottom left corner of the screen with content I wanted to access.

It took more time than copying content to text editor and formatting it manually, but what I learned was worthwhile (-:

Answer 3

You would have to seek for stylesheets with media="print" on it. This stylesheets are responsible for printing versions. I seen some plugins that can chancge media type in browser window.