how to pass request headers to Percy snapshot?

Question

I'm trying to use Percy.io to snapshot pages on a site that requires a custom header in the request (any requests missing this header receive a HTTP 403).

I'm looking at the docs here: https://docs.percy.io/docs/cli-configuration#snapshot

I'm confused. The discovery section includes a request-headers option:

request-headers: An object containing HTTP headers to be sent for each request made during asset discovery.

But that seems to relate only to asset discovery - fetching CSS, JS and other page assets required by the URL I'm trying to snapshot.

I want to send a custom HTTP header with the original request; the one for the URL I want a snapshot of. And I don't see any option for it. But... it must be possible, no?

Here's what I'm doing:

const puppeteer = require('puppeteer');
const percySnapshot = require('@percy/puppeteer');

const pageReferences = [
    'https://www.my-url.com',
];

const options = {
    requestHeaders: {
        "proxy-authorization":"************"
    }
};

(async () => {
    const browser = await puppeteer.launch({
        headless: true,
        args: ['--no-sandbox']
    });
    let page = await browser.newPage();
    await page.goto(pageReferences[0]);
    await percySnapshot(page, pageReferences[0], options);
})();

That gives me a snapshot of a 403 error page. But I can otherwise reach the page fine with the correct header:

$ curl -I -H "proxy-authorization:***********" https://www.my-url.com
HTTP/2 200

What am I missing here?

Answer 1

Asset discovery is the same as what you are calling the "original request". Percy loads all the assets related to a page (html, css, js, images, etc.) from your server - where you will need authorization.

The easiest way is to create a local .percy.yml config file. Into that, add your headers:

version: 2
  snapshot:
  widths: [390, 1280]
  discovery:
    proxy-authorization: secret
    # and/or for your target
    authorization:
      username: itsme
      password: supersecret

Nice side effect: you don't have to commit your secrets to your code version control if you keep the percy.yml local