How can I have text in an HTML document so that it will be “there” in the PDF document (generated via wkhtmltopdf), but invisible when viewed or printed?
Constraints:
The text must appear at the right place, with the right size, because the purpose is to find the text with an automated tool and discover its co-ordinates and size on the page.
The solution must be to do with the text only, because I'm trying to keep this simply about CSS styles. Any “hide it under another element” doesn't address the problem, because there might not be any other element at those co-ordinates.
The solution can't be dependent on what's already on the page; I can't go inspecting the background elements on the page because I can't determine those dynamically. The text should be invisible in its own right.
The text must be findable with an automated tool (e.g. pdfgrep), which means wkhtmltopdf must place the text in the document file.
So a “display: none” style or “opacity: 0” doesn't work, because that makes the text not exist at all in the PDF document.
So I want to have an HTML document, place a text element “FOO” within that document with an inline CSS style, and process it through wkhtmltopdf; then, pdfgrep FOO should find the text, the text location and size should be correct, but the text should not show up in HTML, not appear when the PDF is viewed, and not appear when it's printed.
With a style of color: transparent; the text will be fully transparent on the page, but show up normally for any tool looking in the document for that text.