Text from some nested html elements is not visible when background-color is specified
Nobody has claimed this yet.
- 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:

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
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- 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