1858571 - Printing page inserts a bunch of blank pages in the middle

Status: NEW

(Core :: Layout: Flexbox, defect)

Description

[Boris Zbarsky [:bzbarsky]]

When I try to print https://ilibrary.ru/text/469/p.1/index.html in Firefox 118 on Mac, the resulting PDF (or preview shown by the Firefox print dialog, for that matter) has two pages with content, then 4.9 pages of blank space, a little bit of text at the bottom of page 7, and then the rest of the text seems to be fine.

Printing the same page in Safari seems to work ok.

I did try to get rid of a bunch of the float and <br clear="all"> and whatnot bits on the page using devtools, but none of that seemed to change the behavior, apart from changing how much text appeared before the 2-page cutoff.

Comment 1

[Daniel Holbert [:dholbert]]

(Hi bz!)

Looking in devtools, I see that the page is structured as two nested column-oriented flex containers -- the outer one being:

<div id="ex" class="l">

and the inner one being:

<div style="display:flex;justify-content:space-between;flex-direction:column">

If I disable the display:flex rule on both of those elements, then I don't see blank pages in the middle. So this is something related to flexbox fragmentation.

Comment 2

[Daniel Holbert [:dholbert]]

Attachment: testcase 1 (original)

Here's the testcase, coalesced into a single file via testcase-reducer.

Comment 3

[Daniel Holbert [:dholbert]]

Attachment: testcase 2

Comment 4

[Daniel Holbert [:dholbert]]

Attachment: testcase 3

Comment 5

[Daniel Holbert [:dholbert]]

(Adding see-also for flexbox fragmentation issue bug 1744363, but this is not a dupe of that bug; the testcases here still render with blank pages in the middle, in a local build with that bug's patches applied.)