parallax / parallax/jsPDF

Text from some nested html elements is not visible when background-color is specified

Open
#3,306 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Bug
Dominant language
JavaScript
Stars
31.3k
Forks
4.8k
PR merge metrics
No merged PRs in 30d

Description

I have read and understood the contribution guidelines.

When a pdf file is generated via the html method in certain setups (with nested html elements and background-color styling specified), some part of text is not visible. You can still select the text in the pdf file, however it seems that the text has the same color as its background which makes it impossible to see.

Since this is a bit difficult to reproduce, here is a jsfiddle example that generates a file and has the described issue:
https://jsfiddle.net/bangiev/w7t6d9v2/

Example screenshot:
image

This might be related to an issue with html2canvas as I observed such results when directly using html2canvas. This is the reported issue in html2canvas:
https://github.com/niklasvh/html2canvas/issues/2739

Contributor guide

Open the contributing guide

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.

Research direction

Start with the linked JSFiddle reproduction and compare its output with the linked html2canvas issue. Investigate how jsPDF's html method handles nested HTML elements with background-color styling. Done means the affected text is visible in the generated PDF while remaining selectable.

Written by the indexing model from the issue text.

Assessment

Tech stack
html, javascript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.