Inconsistency: Execution order for DNR modifyHeaders and `webRequest.onBeforeSendHeaders`

[cyfung1031]

What is the correct execution order for DNR modifyHeaders and webRequest.onBeforeSendHeaders?
Why there is difference between Chrome and Firefox?
I filed it as a Firefox bug as well. https://bugzilla.mozilla.org/show_bug.cgi?id=2040251

Steps to reproduce:

This is about the behavioral difference between Firefox MV3 and Chrome MV3.

The demo code is upload to https://github.com/cyfung1031/MV3-Header-Probe

In Extension Event Page / Service Worker.

async function setup() {
  const rule = {
    id: RULE_ID,
    action: {
      type: "modifyHeaders",
      requestHeaders: [
        {
          header: CUSTOM_HEADER_ID,
          operation: "remove",
        },
      ],
    },
    priority: 1,
    condition: {
      resourceTypes: ["xmlhttprequest"],
      tabIds: [-1],
    },
  };

  await updateSessionRules({
    removeRuleIds: [RULE_ID],
    addRules: [rule],
  });

  api.webRequest.onBeforeSendHeaders.addListener(
    (details) => {
      const lastError = getLastError();
      if (lastError) {
        console.error(lastError);
        return;
      }

      if (details.tabId !== -1) {
        return;
      }

      const requestId = details.requestId;

      const requestHeaders = details.requestHeaders ?? [];
      const myID = requestHeaders.find((header) => header.name.toLowerCase() === CUSTOM_HEADER_ID)?.value;

      if (myID) {
        console.log(`[${CUSTOM_HEADER_ID}] The request id for "${myID}" is ${requestId}`);
      } else {
        console.log(`[${CUSTOM_HEADER_ID}] Not visible for request ${requestId}`);
      }

      const myRef = requestHeaders.find((header) => header.name.toLowerCase() === CUSTOM_HEADER_REF)?.value;

      if (myRef) {
        console.log(`[${CUSTOM_HEADER_REF}] The request id for "${myRef}" is ${requestId}`);
      } else {
        console.log(`[${CUSTOM_HEADER_REF}] Not visible for request ${requestId}`);
      }

      console.dir({ requestId, requestHeaders });
    },
    {
      urls: ["<all_urls>"],
      types: ["xmlhttprequest"],
      tabId: -1,
    },
    ["requestHeaders"],
  );
}

async function makeNetworkRequest() {
  const response = await fetch("https://httpbun.com/get", {
    method: "GET",
    headers: {
      [CUSTOM_HEADER_ID]: "A1234",
      [CUSTOM_HEADER_REF]: "B5678",
    },
  });

  console.log("Sample request completed", response.status);
}

(Full coding: https://github.com/cyfung1031/MV3-Header-Probe/raw/refs/heads/main/src/background.js)

at the beginning, do setup()
then call makeNetworkRequest(), e.g. by action.onClicked

Firefox MV3:

[x-my-custom-id] Not visible for request 1211
[x-my-custom-ref] The request id for "B5678" is 1211

Chrome MV3:

[x-my-custom-id] The request id for "A1234" is 214
[x-my-custom-ref] The request id for "B5678" is 214

[dotproto]

@cyfung1031, I just submitted cyfung1031/MV3-Header-Probe#1 for your test case in order to verify that the behavior you observed also applies to static and dynamic DNR rules.

[cyfung1031]

@cyfung1031, I just submitted cyfung1031/MV3-Header-Probe#1 for your test case in order to verify that the behavior you observed also applies to static and dynamic DNR rules.

Thank you so much.

Firefox

Chrome

[dotproto]

Updating the test to include Safari support is going to be a bit more difficult because it uses an allow list to control what headers an extension can set. See acceptedHeaderNames in Source/WebKit/UIProcess/Extensions/Cocoa/_WKWebExtensionDeclarativeNetRequestRule.mm

[dotproto]

What is the correct execution order for DNR modifyHeaders and webRequest.onBeforeSendHeaders?

I'm not sure if we've aligned on a "correct" order, but hopefully @Rob--W can speak to this more directly.

[carlosjeurissen]

Updated the demo to work cross-browser without build scripts. And added support for Safari. As well as log onSendHeaders. See:
https://jeurissen.co/webext-demos/webrequest-dnr-onbeforesendheaders-order

Turns out Safari aligns with Firefox here. Meaning the modified versions are both visible in onBeforeSendHeaders and onSendHeaders. While in Chrome it is only visible with onSendHeaders.

[carlosjeurissen]

For those wondering why above demo is a bit quirky, in addition to WebKit restriction to what headers can be modified (as mentioned by in #1004 (comment)), there are two more issues:

WebKit currently does not modify network fetch calls initiated from extension pages with DNR, see:
https://jeurissen.co/webext-demos/dnr-in-extension-page

WebKit currently does not fire webRequest events for pages created with tabs.create. See:
https://jeurissen.co/webext-demos/webrequest-tabs-create

[carlosjeurissen]

From the perspective of extension developers. There are two sides. When strictly speaking of webRequest from the non blocking / reporting side. Seems the current Chrome behaviour would give the most flexibility. As you have both the before and after DNR changes by listening to both onBeforeSendHeaders and onSendHeaders.

However when considering blocking webRequests, the behaviour of having DNR go first would allow webRequest to make final adjustments in the webRequest blocking API.

In any case changing the behaviour in either browser to match the other obviously can be a breaking changes for some extensions.

[cyfung1031]

@dotproto @carlosjeurissen

I am surprised that no one has realized this matter before.

Could you guys bring it into the public meeting in 2026-06-04 ?

• Agenda discussion for public meeting on 2026-06-04 #1003

Thank you so much.