pdf viewer errors in chrome

[lszhu]

I have a pdf file which has some pages with different page size/format (A4/letter/B5 pictures). When I'm printing it in pdf viewer in chrome, I find each page size/format will be change to the the first page size/format. This will squeeze or stretch the page (pictures).

OS: windows 7 x64
chrome v44/v45 x64/x86

[Rob--W]

Link to PDF? See https://github.com/mozilla/pdf.js/blob/master/CONTRIBUTING.md

[lszhu]

I've tested some pdf files (made from jpg pictures), each file with different page size/format can reproduce the bug.
I also find pdf.js v1.0 do not have the bug.

[lszhu]

example
link to pdf
http://ge.tt/7pCBPHO2/v/0
print preview for the second page
http://ge.tt/3teKQHO2/v/0

[Rob--W]

@lszhu If "pdf.js v1.0 do not have the bug", then this bug is most likely caused by #6462. That PR resolved a problem with page size, but due to the lack of support for targetting specific pages via CSS, pages with different sizes are scaled to fit on a single page.

The console will contain a warning when the page sizes are incorrect. Perhaps we should not try to unify the page size when we detect that the PDF pages have different page sizes? The relevant ode is here:

pdf.js/web/viewer.js

Lines 1107 to 1133 in f06aa6a

	if (!this.hasEqualPageSizes) {
	console.warn('Not all pages have the same size. The printed result ' +
	'may be incorrect!');
	}
	// Insert a @page + size rule to make sure that the page size is correctly
	// set. Note that we assume that all pages have the same size, because
	// variable-size pages are not supported yet (at least in Chrome & Firefox).
	// TODO(robwu): Use named pages when size calculation bugs get resolved
	// (e.g. https://crbug.com/355116) AND when support for named pages is
	// added (http://www.w3.org/TR/css3-page/#using-named-pages).
	// In browsers where @page + size is not supported (such as Firefox,
	// https://bugzil.la/851441), the next stylesheet will be ignored and the
	// user has to select the correct paper size in the UI if wanted.
	this.pageStyleSheet = document.createElement('style');
	var pageSize = this.pdfViewer.getPageView(0).pdfPage.getViewport(1);
	this.pageStyleSheet.textContent =
	// "size:<width> <height>" is what we need. But also add "A4" because
	// Firefox incorrectly reports support for the other value.
	'@supports ((size:A4) and (size:1pt 1pt)) {' +
	'@page { size: ' + pageSize.width + 'pt ' + pageSize.height + 'pt;}' +
	// The canvas and each ancestor node must have a height of 100% to make
	// sure that each canvas is printed on exactly one page.
	'#printContainer {height:100%}' +
	'#printContainer > div {width:100% !important;height:100% !important;}' +
	'}';
	body.appendChild(this.pageStyleSheet);

If I prevent the stylesheet from being inserted, the images are not rescaled, but three pages are printed, which is also incorrect (if you want to test it yourself, type document.body.appendChild=function(e) { console.log('would have appended', e); }; in the console and try to print; the stylesheet won't be appended, which brings PDF.js back to the pre-#6462 state).

The best way to get rid of this bug is to use named pages (as you can see in the comments in our source code), but Chrome doesn't support that yet.

[yurydelendik]

Shall be addressed by #7677