DEV Community

Arya
Arya

Posted on

Browser refresh on click of Home button using href

I have a question on writing angular testcases on browser refresh.
Angular is a single page application .there is no browser refresh after logging in. I am building a website with angular in the frontend but not entirely. You will see what i mean in the below example scenario

When I am in Contacts page of the application ,and I click on the logo ,it should navigate me to the homepage always.
I could have simply gone with router link, but there is a catch.
See when Iam in contacts page of the application, the contacts tab is selected in the left-nav-item. When i click on the logo to navigate to the home button, the selection should not be there anymore. means it should work like a browser refresh. For that ,Iam using href instead of router link


Logo

This will reload the page. See, what i mean when i said not fully angular .

Now my issue is with the testcases.I cant write element.click()

it("should navigate to home page on click of logo",() => {
const element = fixture.nativeElement.querySelector(".appName a") as HTMLElement;

spyOn(window.location, 'reload');
element.click();
expect(window.location.reload).toHaveBeenCalled();
});

here element.click() will reload the page and so the test cases also stop to return Not Found.

I need to trigger the click() here to check if the browser is refreshed.Any suggestion on how to achieve it?

Postmark Image

Speedy emails, satisfied customers

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay