[Violation] Avoid using document.write()

[Biuni]

I have this situation in my NextJS project:

const componentRef = useRef();
...
return (
  <>
    <ReactToPrint
      trigger={() => <Button size="sm" color="warning">Print!</Button>}
      content={() => componentRef.current}
    />
    {
      data.map((e, i) => (
        <Table ref={ i === 0 ? componentRef : undefined }>
        ...
        </Table>
      ))
    }
  </>
)

When I click on the button the print prompt doesn't appear and the console get me the follow warning:

[Violation] Avoid using document.write()

In NextJS development mode work well but in production the button have this problem. Could someone explain me why?

[MatthewHerbst]

Hello. Sounds like an issue with your NextJS config somehow. Would you mind making a working codesandbox that replicates the issue so I can take a look?

[Biuni]

Hello. Sounds like an issue with your NextJS config somehow. Would you mind making a working codesandbox that replicates the issue so I can take a look?

Hi @MatthewHerbst , thanks for the reply. This error appear only in production mode, so if i create a codesandbox i can't replicate the problem. Could it be useful to see the NextJS configuration file?

[MatthewHerbst]

Maybe though I'm not super familiar with NextJS. Why can't you create the production version in codesandbox?

[SteiniDJ]

I started noticing this after updating Google Chrome Canary to version 88.0.4284.0, while running a CRA app in development mode. I don't believe I'm doing anything unusual, just following the examples quite closely. It even appears in Chrome 88 when running the codesandbox listed in the documentation.

The full console message that I receive is as follows:

[Violation] Avoid using document.write(). https://developers.google.com/web/updates/2016/08/removing-document-write

[MatthewHerbst]

@SteiniDJ thanks for that. Not sure why it's complaining for us since document.write for us only happens on an iframe, which they specifically say isn't impacted:

2. The document.write() is in a top level document. The intervention does not apply to document.written scripts within iframes as they don't block the rendering of the main page.

I'll look at ways to mitigate and report back

[MatthewHerbst]

Removed document.write in v2.12.2. Please let me know if you see any additional issues, thanks!