Refused to connect to ... because it violates the document's Content Security Policy

[vnikolay]

When I try to upload image by fileChooser:

const [fileChooser] = await Promise.all([
  page.waitForFileChooser(),
  page.click(postButton), // some button that triggers file selection
]);

await page.waitFor(5000);
await fileChooser.accept(['./cat.jpg'])

I am getting this error in browser:

puppeteer_evaluation_script:4 Refused to connect to 'data:image/jpeg;base64,/9...' because it violates the document's Content Security Policy

How can I avoid this?

[mazlano27]

@vnikolay I'm getting this issue too, it was not there before.

I use →

await page.waitForXPath(inputElementXPath);
const inputElement = page.$x(inputElementXPath);
await inputElement[0].uploadFile(filePath);

puppeteer_evaluation_script__:4 Refused to connect to 'data:image/png;base64, ...' because it violates the following Content Security Policy directive

Would really appreciate any help - this broke my app.

[vnikolay]

@mazlano27

I found this setting:
await newPage.setBypassCSP(true);

It seems that the error has gone, but it still does not load a picture, don't know why.

[mazlano27]

@vnikolay I tried the same - setBypassCSP(true) - and got the same result. No error, but the image does not load

[vnikolay]

@mazlano27 It looks like the uploader is broken in last version : #5363

[mazlano27]

@vnikolay thank you for the the update. Will revert back to 2.0 for now

[paullewis]

This should be fixed as of 532ae57 as we changed the underlying implementation to use DOM.setFileInputFiles, which behaves a lot more as expected. We also fire events for change and input, too. Going to close this issue, but please let us know if it's not fixed.

[mazlano27]

This should be fixed as of 532ae57 as we changed the underlying implementation to use DOM.setFileInputFiles, which behaves a lot more as expected. We also fire events for change and input, too. Going to close this issue, but please let us know if it's not fixed.

Hey @paullewis - I updated to v3.0 and tried to run .uploadFile on an input that accepts image files. The file is uploaded as a document instead of an image - and this impacts the UI for the user. This was not the case is v2.0

[paullewis]

It won't be in 3.0.0 as it's not part of any release. In order to test it you'll need to npm install https://github.com/puppeteer/puppeteer

[mazlano27]

It won't be in 3.0.0 as it's not part of any release. In order to test it you'll need to npm install https://github.com/puppeteer/puppeteer

Thank you for the clarification, will wait for the release with the fix 👍