[data grid] Excel export is broken due to `eval` with `self` `content-security-policy`

[OlgaKush512]

Steps to reproduce

Link to live example: https://stackblitz.com/edit/react-wiwppv?file=index.html

Steps: 1.set content-security-policy header to include script-src: "'self'". Exemple:

2. try to download Excel

Current behavior

Message of error : Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self' ".

Impossible to download.

Expected behavior

Downloading a file excel

Context

No response

Your environment

System: OS: macOS 13.3.1 Binaries: Node: 18.17.0 - ~/.nvm/versions/node/v18.17.0/bin/node Yarn: Not Found npm: 9.6.7 - ~/.nvm/versions/node/v18.17.0/bin/npm Browsers: Chrome: 119.0.6045.159 Edge: Not Found Safari: 16.4 npmPackages: typescript: 5.2.2 => 5.2.2

Search keywords: export excel datagrid csp

[cherniavskii]

@romgrk Can you take a look at this one?

[romgrk]

It might be a stackblitz specific error I think? The same code works fine on codesandbox, and our eval checks are wrapped in try.

@OlgaKush512 Can you confirm this is really related to excel export? I see the error in stackblitz right as the frame loads. Can you also confirm if you experience this error in any other situation, like a production build?

This might need to be reported to stackblitz.

[OlgaKush512]

Hello! Thank you for responding so quickly.

This error originated on our platform, and it specifically occurs in the production environment. I wrote approximate code to reproduce this error. And yes, on our company's website, we use a datagrid for exporting to Excel. The error occurs in two places: 1) when we try to use the export button in the toolbar 2) when we separately use the exportDataAsExcel() function.

In other words, when I attempt to use the export feature on our website, an exception is thrown with this error, and we are unable to download the file.

[romgrk]

Can you clarify the reproduction steps? Can you also provide stacktraces for the error that you're getting in production?

I've inspected the origin of the error in stackblitz, it doesn't seem to be datagrid code:

[OlgaKush512]

Hello! As mentioned earlier, this is an issue on our platform, not just on StackBlitz.

When exporting Excel, we use the function exportDataAsExcel(), and as a result, we encounter an error.

[OlgaKush512]

Also, in the place where we use export through the toolbar, we encounter the same error.

[romgrk]

So it seems like this is an eval inside ExcelJS: https://github.com/exceljs/exceljs/issues/713

@cherniavskii I haven't looked at the export code yet, do you think we could use the bare version of ExcelJS as suggested in the issue above?

[cherniavskii]

I've added a comment in the related exceljs issue https://github.com/exceljs/exceljs/issues/713#issuecomment-1828759610 If using the bare version of exceljs works as a workaround - great, but the ultimate fix should be done on the exceljs side. I'll try to open an issue in exceljs with a proposal for issue resolution later.

[ryancogswell]

@cherniavskii I see in the exceljs issue you linked to that they believe it was fixed in the most recent release. I'm running into this same problem -- our CSP doesn't allow eval. It would be great if the new exceljs version can be incorporated soon (assuming it does indeed fix the problem).