Is there any way to block some elements in a document from rendering ?

[prakash-chokalingam]

Like html2canvas does with with data-attribute 'data-html2canvas-ignore=true'.

[cburgmer]

No, and probably not easy to implement, because we delegate the whole rendering process to the browser itself. On a per use case basis, you could try replacing the given element with a dummy element.
However I don't see an easy generic way to implement that here.

Alternatively, if this works for you, you could try measuring the element in question (offset top/left + width/height) and blank out this space retroactively.

[cburgmer]

A more technical answer to my initial response: In an interim step we inspect the size of the document being rendered via its HTML being pasted into a hidden iframe. However, the final result lives inside a <foreignObject> blob inside an SVG where position and size seem to be slightly different, when rendered by the browser. From that perspective I doubt whether we can implement an overlay mechanism to retrospectively hide certain elements based on their position.

However, here's a different idea: the element could just have it's style attribute overridden with opacity: 0. Hopefully this would hide any possible combination of content. This will however not allow replacing the element with arbitrary surfaces (like say black). If anybody feels compelled to give it a try, happy to lend a hand.