fix(network): process last inserted routes first in request interception (#7585)

src/client/browserContext.ts

@@ -254,7 +254,7 @@ export class BrowserContext extends ChannelOwner<channels.BrowserContextChannel,
 
   async route(url: URLMatch, handler: network.RouteHandler): Promise<void> {
     return this._wrapApiCall(async (channel: channels.BrowserContextChannel) => {
-      this._routes.push({ url, handler });
+      this._routes.unshift({ url, handler });
       if (this._routes.length === 1)
         await channel.setNetworkInterceptionEnabled({ enabled: true });
     });

src/client/page.ts

@@ -444,7 +444,7 @@ export class Page extends ChannelOwner<channels.PageChannel, channels.PageInitia
 
   async route(url: URLMatch, handler: RouteHandler): Promise<void> {
     return this._wrapApiCall(async (channel: channels.PageChannel) => {
-      this._routes.push({ url, handler });
+      this._routes.unshift({ url, handler });
       if (this._routes.length === 1)
         await channel.setNetworkInterceptionEnabled({ enabled: true });
     });

tests/browsercontext-route.spec.ts

@@ -45,11 +45,10 @@ it('should unroute', async ({browser, server}) => {
   const page = await context.newPage();
 
   let intercepted = [];
-  const handler1 = route => {
+  await context.route('**/*', route => {
     intercepted.push(1);
     route.continue();
-  };
-  await context.route('**/empty.html', handler1);
+  });
   await context.route('**/empty.html', route => {
     intercepted.push(2);
     route.continue();
@@ -58,22 +57,23 @@ it('should unroute', async ({browser, server}) => {
     intercepted.push(3);
     route.continue();
   });
-  await context.route('**/*', route => {
+  const handler4 = route => {
     intercepted.push(4);
     route.continue();
-  });
+  };
+  await context.route('**/empty.html', handler4);
   await page.goto(server.EMPTY_PAGE);
-  expect(intercepted).toEqual([1]);
+  expect(intercepted).toEqual([4]);
 
   intercepted = [];
-  await context.unroute('**/empty.html', handler1);
+  await context.unroute('**/empty.html', handler4);
   await page.goto(server.EMPTY_PAGE);
-  expect(intercepted).toEqual([2]);
+  expect(intercepted).toEqual([3]);
 
   intercepted = [];
   await context.unroute('**/empty.html');
   await page.goto(server.EMPTY_PAGE);
-  expect(intercepted).toEqual([4]);
+  expect(intercepted).toEqual([1]);
 
   await context.close();
 });

tests/page/page-route.spec.ts

@@ -39,11 +39,10 @@ it('should intercept', async ({page, server}) => {
 
 it('should unroute', async ({page, server}) => {
   let intercepted = [];
-  const handler1 = route => {
+  await page.route('**/*', route => {
     intercepted.push(1);
     route.continue();
-  };
-  await page.route('**/empty.html', handler1);
+  });
   await page.route('**/empty.html', route => {
     intercepted.push(2);
     route.continue();
@@ -52,22 +51,23 @@ it('should unroute', async ({page, server}) => {
     intercepted.push(3);
     route.continue();
   });
-  await page.route('**/*', route => {
+  const handler4 = route => {
     intercepted.push(4);
     route.continue();
-  });
+  };
+  await page.route('**/empty.html', handler4);
   await page.goto(server.EMPTY_PAGE);
-  expect(intercepted).toEqual([1]);
+  expect(intercepted).toEqual([4]);
 
   intercepted = [];
-  await page.unroute('**/empty.html', handler1);
+  await page.unroute('**/empty.html', handler4);
   await page.goto(server.EMPTY_PAGE);
-  expect(intercepted).toEqual([2]);
+  expect(intercepted).toEqual([3]);
 
   intercepted = [];
   await page.unroute('**/empty.html');
   await page.goto(server.EMPTY_PAGE);
-  expect(intercepted).toEqual([4]);
+  expect(intercepted).toEqual([1]);
 });
 
 it('should work when POST is redirected with 302', async ({page, server}) => {