[Feature] baseURL aware routeFromHAR?

[gabriel-finch-kr]

I love Playwright. Thank you all.
I'm setting up some tooling around the wonderful routeFromHAR and was banging my head for a little bit trying to determine why my HAR wasn't being replayed in my CI pipeline. I finally realized (as the documentation states clearly) that "HAR replay matches URL and HTTP method strictly" and my organization's dynamic baseUrl use (varies depending on environment) was the problem. E.g. locally tests run against local.site.com, in CI pipeline against pipeline.site.com etc.
I can workaround this by finding/replacing domain in the HAR, but from my vantage it seems like a nice (toggle-able?) feature to allow baseUrl aware HAR recording and playback, essentially storing relative paths where appropriate rather than full URL.

page.routeFromHAR('network.har', {url: \/api/.*\, isRelative: true})

Maybe this breaks the HAR spec or there is some internal constraint making it challenging? Anyhow...I for one would find it very useful.

[dgozman]

@gabriel-finch-kr Unfortunately, this is not as easy as just rewriting the url. If some requests have Set-Cookie with a domain, we'll probably have to update them too. Same goes for CORS headers, and probably more things. Overall, great idea but not the highest priority at the moment. Leaving the issue open.

[samratluintel2]

@gabriel-finch-kr How do you replace the domains in the file? Do you create some scripts that manually goes over the har file and modify them? Or are there some hooks? page.routeFromHar seems to only take a string. I could not figured out a way to modify the har before I call page.routeFromHar

[lbarnes-cs]

I am in the same situation as @gabriel-finch-kr , both in terms of new to playwright and loving it, and using routeFromHAR with different domains for our local, QA, staging and production. I've been trying to see if there is an easy solution here. Whilst it would be great if it was a solution as purposed by Gabriel, I understand it isn't that simple.

To answer @samratluintel2 question how how you may have replaced the domains in the file, I can at least give an example on how I solved it.

I duplicated the .har file, adding a localhost suffix to the file name to the original. Then for the pipeline version, I added the pipeline suffix. Then I did a find and replace to change https://local.site.com to https://pipeline.site.com.

Then I use baseUrl to create a variable to know which suffix I should use.

test('Description...', async ({ page, baseURL }: { page: Page, baseURL: string }) => {
  const env = baseURL === 'https://local.site.com' ? 'localhost' : 'pipeline';
  await page.routeFromHAR(`network-${env}.har`);
  ...
});

It is not elegant, but for us, it is a step in the right direction. I understand I may be going about using the recorded network all wrong and maybe there is a better way with using mocks and maybe fixtures. I am still learning and hopefully over time this will become more obvious.

Thanks and good luck

[NoamGaash]

I believe my suggestion titled "smart matching algorithm" would cover this use case as well

[NoamGaash]

the advancedRouteFromHAR fixture supports urlComparator, that can be used to ignore base URL:

test("ignore base url", async ({ page, advancedRouteFromHAR }) => {
	await advancedRouteFromHAR("my-file.har", {
		matcher: customMatcher({
			urlComparator(a, b) {
				a = a.replace(/.*\.com/, "");
				b = b.replace(/.*\.com/, "");
				return a === b;
			},
		}),
	});
	await page.goto("/");
        // ... 
});

[kmermi1]

I have solved it by putting another entry in the same har file with different url so the same file can serve differnt environments.