html reporter not working when metadata served with content-encoding of 'gzip' #9276
Description
Describe the bug
If the html.meta.json.gz file is served with the Content-Encoding: gzip headers, then the HTML report doesn't work.
This can happen when trying to display the HTML report on CI/CD like Jenkins which might be configured in a way that adds the Content-Encoding: gzip header when serving the html.meta.json.gz file.
Reproduction
A simple reproduction with express:
import path from 'node:path';
import express from 'express';
import compression from 'compression';
const app = express();
// Enable gzip compression
app.use(compression({
filter: (req, res) => {
if (req.url.endsWith(".gz")) {
res.setHeader("Content-Encoding", "gzip");
return true;
}
return compression.filter(req, res);
}
}));
app.use(express.static(path.join('html'))); // set this to the HTML report directory
app.listen(3000, '0.0.0.0', () => {
console.log('App listening on port 3000');
});
When loading the report in the browser:
Exception is thrown in the console:
index-DnyN8l5D.js:44 Uncaught (in promise) Error: invalid distance
at dp (index-DnyN8l5D.js:44:44802)
at fce (index-DnyN8l5D.js:44:45468)
at pce (index-DnyN8l5D.js:44:45773)
at c (index-DnyN8l5D.js:44:47507)
This is because the HTML report Vue application tries to decompress the response again, but the browser already automatically decompressed it.
I think the code in this function should be rewritten:
My suggestion is something like this (obviously needs testing):
async function registerMetadata() {
const res = await fetch(window.METADATA_PATH!)
const content = new Uint8Array(await res.arrayBuffer());
if (content.length >= 2 && content[0] === 0x1f && content[1] === 0x8b) {
// we have gzip magic numbers, decompress
const decompressed = strFromU8(decompressSync(content));
metadata = parse(decompressed) as HTMLReportMetadata;
} else {
metadata = parse(strFromU8(content)) as HTMLReportMetadata;
}
const event = new Event('open')
ctx.ws.dispatchEvent(event)
}
Another solution of course is to change the web server used by Jenkins to NOT add the Content-Encoding: gzip header when serving an existing file with the .gz extension, but unfortunately I don't control the Jenkins configuration.
System Info
System:
OS: Linux 5.15 Ubuntu 24.04.3 LTS 24.04.3 LTS (Noble Numbat)
CPU: (32) x64 AMD Ryzen 9 5950X 16-Core Processor
Memory: 12.28 GB / 15.58 GB
Container: Yes
Shell: 5.2.21 - /bin/bash
Binaries:
Node: 24.11.1 - /usr/bin/node
Yarn: 1.22.22 - /mnt/c/Users/dezsi/AppData/Roaming/npm/yarn
npm: 11.6.2 - /usr/bin/npm
pnpm: 10.24.0 - /mnt/c/Users/dezsi/AppData/Roaming/npm/pnpm
npmPackages:
@vitest/browser-playwright: 4.0.14 => 4.0.14
@vitest/ui: 4.0.14 => 4.0.14
vitest: 4.0.14 => 4.0.14Used Package Manager
npm
Validations
- Follow our Code of Conduct
- Read the Contributing Guidelines.
- Read the docs.
- Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
- Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
- The provided reproduction is a minimal reproducible example of the bug.