Add a (failing) test on long section with break-inside: avoid
Another failing test to highlight the issue with long elements. Similar issue: https://gitlab.pagedmedia.org/tools/pagedjs/merge_requests/112
At first, I thought that this issue was only related to tables but I can reproduce it with other long elements (here a <section>
).
I think we should be able correct this on the
onOverflow
hook, but the chunker break doesn't have a special way to handle tables (or other things images) so hopefully this can be fixed with those updates.
@fchasen I'm not sure I understand what you meant. In this case, the onOverflow
hook is not called (using either a <table>
or a <section>
).
Unless I'm missing something we need to detect when an element with break-inside: avoid
cannot fit on its own on a page. If that's the case then we should try to fit the element on the previous page (and break the element accordingly).
My idea was to check that:
- the previous break node has the rule
break-inside: avoid
- one of the parent elements of the current break node is equals to the previous break node
Basically, it means that we are breaking inside an element that has the rule break-inside: avoid
. In other words, at this point we know that this element cannot fit on one page and that the rule break-inside: avoid
cannot be fulfilled.
This part is relatively easy to implement but then I need to remove/ignore the break-inside: avoid
rule and "reflow" the previous page...
Does it makes sense? is it the right approach? How can I do to "reflow" the previous page?