Dropping support for React elements in customTextRenderer?

[wojtekmaj]

Hi!

In #944, I'm replacing our custom TextLayer implementation with PDF.js's one. This has a number of benefits outlined in the PR description.

However, one thing appears to be particularly challenging, and that is keeping customTextRenderer ability to render React elements. Here are the possibilities:

• Dropping support for customTextRenderer altogether, and implementing something else as a replacement (e.g. an easy way to mark search results)
• Keeping customTextRenderer without the ability to render React elements
• Keeping customTextRenderer with ability to render React elements, but at a cost of using ReactDOMServer.renderToStaticMarkup, which would add roughly 37 KB to your bundle

What would be the best approach?

[cefaci]

Hi! Nice I found the right discussion, the new version is perfect and no react-dom.
I would like to propose something like this
Replace this line:

react-pdf/src/Page/TextLayer.jsx

Line 198 in df990a7

child.innerHTML = content;

with something like this, append my on controlled DOM Element or just the string as right now (but remove innerHTML):

  // child.innerHTML = content;

  // Still allow update of e.g. an empty string (if wanted), 
  // but if you just return, no update of innerHTML is needed (if the item.str is empty)
  if(typeof content !== 'undefined' && content !== null){
    if(typeof content === 'string'){
      child.textContent = content;
    } else if(content instanceof Element){ // && !child.contains(content)) {
      // New way
      if(child.replaceChildren){ child.replaceChildren(content); }
      else {
        // Old way
        while (child.firstChild) { child.removeChild(child.lastChild); }
        child.appendChild(content);
      }
    }
  }