Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

[Bug][pdf-plugin] html2pdf-next.js 的 @page 检测只扫行内 <style>,误注入 20mm 边距导致分页膨胀

Open Beginner friendly
#107 0 comments 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
2/5
Estimated time
1-3 hours
Newbie friendliness
76/100
Issue type
Bug
Clarity
Clearly specified
Activity status
Active
Tech stack
css, javascript, nodejs
Domain
cli

Research direction

The bug is in the @page detection in preRenderHooks step 5 of html2pdf-next.js, which uses document.querySelectorAll('style'). Reproduce with a minimal page that puts @page { size: A4; margin: 8mm; } in an external stylesheet, by running node html2pdf-next.js page.html -o out.pdf. Done when the author's margin is kept for the external-link case, and the fallback @page { margin: 20mm; } still applies when the page declares no @page.

Written by the indexing model from the issue text.

Description

Description

html2pdf-next.js 的 preRenderHooks 第 5 步用 document.querySelectorAll('style') 判断页面是否声明过 @page。当 @page 写在外部样式表(<link>)里时会被误判为缺失,随后注入 @page { margin: 20mm; };该行内样式生效晚于 <link>,会覆盖作者边距、压缩可用页高,把本可容纳的内容挤出额外页。

Steps to Reproduce(最小复现)

同一最小 HTML(内容样式全部 inline;@page { size: A4; margin: 8mm; } 单独放外链 CSS),用未打补丁的发行版/上游版本执行 node html2pdf-next.js page.html -o out.pdf:

导出方式(同一页面) 页顶起点(量化 bbox) 页数
外链 CSS 的 @page(8mm) 20.1mm(被注入的 20mm 覆盖) 2
同一条 @page 改经 --css 行内注入 7.8mm 1
页面完全不声明 @page(fallback 生效对照) 22.2mm 1

页顶起点 20.1mm → 7.8mm 的翻转证明:缺陷不在排版,而在"检测只扫行内 <style>"这一处。

Expected Behavior

作者声明的 @page 边距被尊重;fallback 注入仅在页面确实未声明 @page 时发生。

Actual Behavior

外链 @page 被无视,行内 @page { margin: 20mm; } 覆盖作者边距,可用页高两页共缩水约 190px,内容溢出到额外空白内容页。

Suggested Fix

检测范围扩展到 document.styleSheets(含 <link> 样式表):

const hasPageRule = Array.from(document.styleSheets).some(sheet => {
  try {
    return Array.from(sheet.cssRules || []).some(
      r => typeof r.cssText === 'string' && r.cssText.includes('@page'));
  } catch { return false; } // 跨域样式表无访问权限时按未命中处理
});

已实测该修复:外链场景恢复作者 8mm 边距;页面完全无 @page 时 fallback 仍生效(无回归)。

Environment

  • OS:Windows 11
  • 版本:pdf-plugin 0.1.8(ZCode 安装包内置);Playwright Chromium Headless Shell 156
Dominant language
Python
Stars
95
Forks
57
PR merge metrics
No merged PRs in 30d

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from zai-org/zcode-plugins

All issues in zai-org/zcode-plugins

Similar issues

More Python issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.