CODEWITHSUNDEEP
javascriptangulartypescriptroutespuppeteer
GeoDev
GeoDev

Reputation: 423

How to navigate Angular routes without full reload in Puppeteer

I'm taking screenshot from a Angular website with Puppeteer and want to navigate routes without triggering a full page reload. Using page.goto() causes a reload, but Angular's client-side router should allow navigation without it.

For example:

await page.goto('http://localhost:4200/home'); // Full reload
await page.goto('http://localhost:4200/about'); // Full reload

I've also tried simulating a click on routerLink, which works:

await page.click('a[routerLink="/about"]');

However, I want to programmatically navigate without relying on existing links. Ideally, I'd like to use Angular's Router.navigate() or some equivalent through Puppeteer.

Upvotes: 1

Views: 39

Answers (1)

Naren Murali
Naren Murali

Reputation: 56803

I think you can try, I found similar code in angular github source code:

This should change the url and load the page without page refresh.

window.history.pushState(null, '', event.target.href);

Upvotes: 1

Related Questions