Commit d794dcd8 authored by Fred Chasen's avatar Fred Chasen

Merge branch 'issue-215-named-page-no-forced-page-break' into 'master'

resolves #215 do not force a page break on named page

Closes #215

See merge request !126
parents 3603b7e2 20237b05
Pipeline #548 passed with stage
in 4 minutes and 14 seconds
......@@ -11,7 +11,7 @@
<script src="../../../dist/paged.polyfill.js"></script>
<style>
:root{
:root {
font-size: 18px;
}
......@@ -33,16 +33,21 @@
}
}
/* @page main:first {
counter-reset: page;
} */
.front-matter, .toc {
page: frontmatter;
}
.toc {
break-before: page;
}
#preface {
break-before: page;
}
.chapter {
page: main;
break-after: page;
}
#first-chapter {
......
<!DOCTYPE html>
<html lang="en">
<head>
<title>forced-page-break</title>
<meta charset="UTF-8">
<script src="../../../dist/paged.polyfill.js"></script>
<style>
@page {
size: 4cm 4cm;
margin: 0.25cm;
text-align: center;
color: white;
}
@page pink {
background-color: hotpink;
}
@page teal {
background-color: #31adad;
}
p {
page: teal
}
div {
page: pink
}
</style>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div>Hot</div>
<div>Pink</div>
<p>Teal</p>
</body>
</html>
const TIMEOUT = 10000;
describe("forced-page-break", () => {
let page;
beforeAll(async () => {
page = await loadPage("named-page/forced-page-break/forced-page-break.html");
return page.rendered;
}, TIMEOUT);
afterAll(async () => {
if (!DEBUG) {
await page.close();
}
});
it("should force a page break between pink and teal (2 pages)", async () => {
let pages = await page.$$eval(".pagedjs_page", (r) => {
return r.length;
});
expect(pages).toEqual(2);
});
if (!DEBUG) {
it("should create a pdf", async () => {
let pdf = await page.pdf(PDF_SETTINGS);
expect(pdf).toMatchPDFSnapshot(1);
expect(pdf).toMatchPDFSnapshot(2);
});
}
}
);
<!DOCTYPE html>
<html lang="en">
<head>
<title>named-and-unnamed-pages-siblings</title>
<meta charset="UTF-8">
<script src="../../../dist/paged.polyfill.js"></script>
<style>
@page {
size: 4cm 4cm;
margin: 0.25cm;
}
@page section {
background-color: #00b3ff;
}
.section {
page: section;
}
</style>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<section>Plain element</section>
<section class="section">First section</section>
<section class="section">Second section</section>
<section>Plain element</section>
<section class="section">Fourth section</section>
</body>
</html>
const TIMEOUT = 10000;
describe("named-and-unnamed-pages-siblings", () => {
let page;
beforeAll(async () => {
page = await loadPage("named-page/forced-page-break/named-and-unnamed-pages-siblings.html");
return page.rendered;
}, TIMEOUT);
afterAll(async () => {
if (!DEBUG) {
await page.close();
}
});
it("should force a page break between unnamed pages and named pages (4 pages)", async () => {
let pages = await page.$$eval(".pagedjs_page", (r) => {
return r.length;
});
expect(pages).toEqual(4);
});
if (!DEBUG) {
it("should create a pdf", async () => {
let pdf = await page.pdf(PDF_SETTINGS);
expect(pdf).toMatchPDFSnapshot(1);
expect(pdf).toMatchPDFSnapshot(2);
expect(pdf).toMatchPDFSnapshot(3);
expect(pdf).toMatchPDFSnapshot(4);
});
}
}
);
<!DOCTYPE html>
<html lang="en">
<head>
<title>contiguous-named-pages</title>
<meta charset="UTF-8">
<script src="../../../dist/paged.polyfill.js"></script>
<style>
@page {
size: 4cm 4cm;
margin: 0.25cm;
}
@page section {
background-color: #00b3ff;
}
.section {
page: section;
}
</style>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<section class="section">First section</section>
<section class="section">Second section</section>
<section class="section">Third section</section>
<section class="section">Fourth section</section>
</body>
</html>
const TIMEOUT = 10000;
describe("contiguous-named-pages", () => {
let page;
beforeAll(async () => {
page = await loadPage("named-page/no-forced-page-break/contiguous-named-pages.html");
return page.rendered;
}, TIMEOUT);
afterAll(async () => {
if (!DEBUG) {
await page.close();
}
});
it("should not force a page break and render only 1 page", async () => {
let pages = await page.$$eval(".pagedjs_page", (r) => {
return r.length;
});
expect(pages).toEqual(1);
});
if (!DEBUG) {
it("should create a pdf", async () => {
let pdf = await page.pdf(PDF_SETTINGS);
expect(pdf).toMatchPDFSnapshot(1);
});
}
}
);
<!DOCTYPE html>
<html lang="en">
<head>
<title>no-forced-page-break</title>
<meta charset="UTF-8">
<script src="../../../dist/paged.polyfill.js"></script>
<style>
#toc {
page: tableofcontents;
}
</style>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<header>
<div id="toc"><h1>Table of Contents</h1></div>
</header>
</body>
</html>
const TIMEOUT = 10000;
describe("no-forced-page-break", () => {
let page;
beforeAll(async () => {
page = await loadPage("named-page/no-forced-page-break/no-forced-page-break.html");
return page.rendered;
}, TIMEOUT);
afterAll(async () => {
if (!DEBUG) {
await page.close();
}
});
it("should not force a page break and render only 1 page", async () => {
let pages = await page.$$eval(".pagedjs_page", (r) => {
return r.length;
});
expect(pages).toEqual(1);
});
if (!DEBUG) {
it("should create a pdf", async () => {
let pdf = await page.pdf(PDF_SETTINGS);
expect(pdf).toMatchPDFSnapshot(1);
});
}
}
);
......@@ -78,7 +78,7 @@ class Layout {
prevNode = node;
node = next.value;
done = next.done;
if (!node) {
this.hooks && this.hooks.layout.trigger(wrapper, this);
......@@ -86,7 +86,7 @@ class Layout {
if (imgs.length) {
await this.waitForImages(imgs);
}
newBreakToken = this.findBreakToken(wrapper, source, bounds, prevBreakToken);
if (newBreakToken && newBreakToken.equals(prevBreakToken)) {
......@@ -207,7 +207,7 @@ class Layout {
doubleBreakBefore = node.dataset.breakBefore === parentNode.dataset.breakBefore;
}
return !doubleBreakBefore && needsBreakBefore(node) || needsPreviousBreakAfter(node) || needsPageBreak(node);
return !doubleBreakBefore && needsBreakBefore(node) || needsPreviousBreakAfter(node) || needsPageBreak(node, previousSibling);
}
forceBreak() {
......
......@@ -282,15 +282,13 @@ export function needsPreviousBreakAfter(node) {
return false;
}
export function needsPageBreak(node) {
if( typeof node !== "undefined" &&
typeof node.dataset !== "undefined" &&
(node.dataset.page || node.dataset.afterPage)
) {
return true;
export function needsPageBreak(node, previousSignificantNode) {
if (typeof node === "undefined" || !previousSignificantNode || isIgnorable(node)) {
return false;
}
return false;
const previousSignificantNodePage = previousSignificantNode.dataset ? previousSignificantNode.dataset.page : undefined;
const currentNodePage = node.dataset ? node.dataset.page : undefined;
return currentNodePage !== previousSignificantNodePage;
}
export function *words(node) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment