Brotli encoding request fails (ERR_CONTENT_DECODING_FAILED)

[homosapiens-engineer]

Requests with encoding content by Brotli compression algorithm always fails.

Current behavior:

Request header:

Accept-Encoding: gzip, deflate, br

Response header:

content-encoding: br

Result:

Request has status 200 OK, but failed with an error ERR_CONTENT_DECODING_FAILED.

Desired behavior:

Request header:

Accept-Encoding: gzip, deflate, br

Response header:

content-encoding: br

Result:
Request 200 OK. Files successfully decoded.

Test code to reproduce

Start any tests on project, where files are encoded with Brotli algorithm.
Use any browser and method to run the tests.

Versions

Requests began to fail, when the encoding of our files was changed (2 month ago)
In the last version of Cypress (3.8.2) bug also exists and could be reproduced in any browser.

[jennifer-shehane]

@backfromreality Can you provide a repo with Brotli encoded files used in a request through Cypress tests? Providing a way for us to get this running quickly will be the fastest way to get your issue addressed.

[homosapiens-engineer]

@jennifer-shehane I tried to start own app on localhost with brotli encoded files and visit localhost by cypress but got an error like this #5446
so I'll wait for fix

also found one more unclear thing for me
if we are visiting google.co.in the html file and some JS files have content-encoding: br

when we are trying to visit google.co.in with cypress, these files have content-encoding: gzip

repo with google.co.in visiting ---> repo

[flotwig]

@backfromreality Cypress only currently supports injecting into non-compressed or gzip-compressed content. But Brotli could probably be added easily too since IIRC it's part of Node's standard lib.

[homosapiens-engineer]

UPD:
(ERR_CONTENT_DECODING_FAILED) an error occurred due to incorrect server-side environment settings

You can close this issue, or rename and bind it to this comment #6197 (comment)

[egemon]

Same issue for me. It passes accept-encoding brotle but can't really decode it.

[egemon]

@backfromreality could u tell me why exactly server config was incorrect? I can't really find smth wrong, I think maybe google just knows that cypress doesn't work with brotli and ignore fact that it sends accept brotli header?

[egemon]

https://docs.cypress.io/api/commands/visit.html#Arguments
used this feature to workaround for now.

[mankinchi]

I'm facing the similar issue. My server is compressed file to .brr. However, whenever my frontend request the compressed file, server can only return the gzip file. It's similar to the case of google.co.in mentioned above

[OlenaVakulenko]

@egemon Hi! Could you please specify which arguments did you add to visit() to workaround the issue?

[OlenaVakulenko]

@jennifer-shehane I have this issue reproduced while trying to visit public site https://www.pravda.com.ua/cdn/covid-19/cpa/ with cypress.
Will it help?

describe('Should load the site', () => {
  it('Should load the site', () => {
    cy.visit('https://www.pravda.com.ua/cdn/covid-19/cpa/')
  })
})

[karlmageddon]

Following-up on this since we're bumping into the same issue.

@egemon How did you work around it?

[flotwig]

Cypress strips any non-gzip Accept-Encoding values:

cypress/packages/proxy/lib/http/request-middleware.ts

Lines 69 to 82 in 64a60f4

	const StripUnsupportedAcceptEncoding: RequestMiddleware = function () {
	// Cypress can only support plaintext or gzip, so make sure we don't request anything else
	const acceptEncoding = this.req.headers['accept-encoding']
	if (acceptEncoding) {
	if (acceptEncoding.includes('gzip')) {
	this.req.headers['accept-encoding'] = 'gzip'
	} else {
	delete this.req.headers['accept-encoding']
	}
	}
	this.next()
	}

So unless there's some bug with this, it is a problem with your upstream server for continuing to serve br-encoded content when Accept-Encoding does not contain br.

[karlmageddon]

I'm looking at the headers of the cy.visit() request and it contains: Accept-Encoding: gzip, deflate, br

[bgk17]

I'm looking at the headers of the cy.visit() request and it contains: Accept-Encoding: gzip, deflate, br

Yes, i'm seeing the same thing.

[chao-ding-awx]

any updates on this??? I have a more specific scenario.
My page using an npm which load a js file which is Brotli encoding.
Then it failed with ERR_CONTENT_DECODING_FAILED, and I have no way to change the head of the request

[pmeyer34]

UPD:
(ERR_CONTENT_DECODING_FAILED) an error occurred due to incorrect server-side environment settings

You can close this issue, or rename and bind it to this comment #6197 (comment)

Hello, can you tell me which settings was wrong ? i have the same issue and it seems related to server conf also

[csvan]

@flotwig are there any current plans to add brotli support? I found this to actually cause problems when running against apps served via CloudFront - https://stackoverflow.com/questions/68054148/why-does-cloudfront-sometimes-serve-gzip-instead-of-br-when-both-are-enabled

In short, if Cypress is the first to access a resource via CloudFront, it causes the asset to permanently be cached as gzip in cloudfront since the accept-encoding header only accepts gzip. Subsequent clients will get gzip files even if they support brotli, which brings overall performance down.

Apart from that, brotli support would probably improve Cypress performance overall due to less bytes on the wire, so would be a great thing to have. As you correctly assume, Node has native support for Brotli - https://nodejs.org/api/zlib.html#zlib_class_brotlioptions

[keul]

I tested those behaviors inspecting my own server. Some notes:

1. as @flotwig said: cypress will transform any accept-encoding header containing "gzip" to just "gzip", stripping away everything

2. do not trust the network tab of the browser inside the cypress test! This is discussed on other issues:

    cy.visit({
      url: '/foo',
      headers: {
        'Accept-Encoding': 'gzip, nnnnn',
        'Foo-Bar': 'something',
      },
    });

   If you look at the network tab only it seems to not be working, but headers are changed someway after. To do some real tests inspect the server side received headers

3. I did not find any workaround for this specific issue: using headers option of visit() is not working for the following reason:

   • as documented in the reference, it's only valid for the main resource (not for assets)
   • you can't manipulate the accept-encoding, for the reason at point 1.

Side note: although I highly hope that cypress will introduce brotli support (we are in 2022… and today is the second birthday of this issue 🥳 🥳 🥳 🥳 ) if this behavior is leading any issue to your tests, you have (probably) a proxy cache issue: you should provide both brotli and gzip content.

[jennifer-shehane]

We'll be opened a PR to address some of the situations in this thread, but not all. This issue should address when:

• There is an Accept-Encoding header and the only encodings passed down in the header are not gzip
• There is no Accept-Encoding header