mixu / electroshot

Capture website screenshots with optional device and network emulation as jpg, png or pdf (with web fonts!) using Electron / Chrome.
548 stars 34 forks source link

Supports PDF header, footer, pagination? #1

Closed bronius closed 8 years ago

bronius commented 8 years ago

WOW, super simple to install and use! Does electroshot PDF generation support creating (or determining?) a page header, footer, and page count?

Thanks -Bronius

mixu commented 8 years ago

electroshot supports anything Electron / Chrome supports, so if you can make it work in Chrome with CSS you can probably make it work in electroshot.

electron's PDF API is kind of limited right now (docs) so you'll probably have to figure out a way to do things using CSS (which has some print media capabilities but I haven't really played around with it a lot)

csga5000 commented 6 years ago

@mixu CSS seems to address some of these flaws, particularly margins, which can be done like so:

@page {
    size: A4;
    margin: 0.5in 1in 1in 1in;
}

However, it seems impractical to do a decent footer since you can't do a negative margin to push it into the page margin (it'll just immediately be pushed to the top of the next page). And it seems impossible to have a page count, and even more impossible to have a page total.

This seems like something that needs to be addressed before this is library is useful for many people's use cases (as people typically want page counts, and/or a footer).

I propose this be re-opened (as it's an outstanding issue, and is also useful for people to see), though it is pending changes from chromium and electron.

Notably though, it seems maybe chromium does support headers and footers as of Chromium 64. Not sure which version of chromium this package would be using (and obviously since I don't think electron supports it you wouldn't).

Some links: SO post about headers and stuff Electron issue about pdf features SO post about chromium support for headers and footers

csga5000 commented 6 years ago

Update

A better alternative is probably to use Puppeteer. It is written by google and is headless google chrome. It supports headers and footers, and it simple to interface with. See here: https://github.com/mixu/electroshot/issues/28