What is the correct way to change the page before printing in Chrome?

Question

css

Good afternoon.
There was a need to change the page before printing. For starters, it's inserting table headers on every page. In the future, more complex transformations are planned (impossible with CSS alone).
To do this, I wrote a script based on
window.matchMedia('print').addListener(...).
An isolated example is here https://advanty.ru/print/index.html . In the example, when the media is changed, the entire page is split into parts ( <div class="page"></div>). Each part is one page.
Adding headings increases the length of the entire document. Sometimes so much so that the number of pages increases. And then there was a problem with the Chrome browser (Chromium) - it does not print these added pages and does not even display them in the preview.
In FireFox - everything works fine and is shown.
Question: how to make chrome add the necessary pages when printing?

Answer 1

Whatever it was, I solved this problem like this:
1. Created the "Print" button
2. When pressed, hid everything on the screen except for the block with printing
3. Formed a printed block
4. Called window.print()
5. Resumed the original page view (for example window.location.reload())