React Jest/React-testing-Library route change not working properly

Question

I have been trying to record URL changes on click of anchor tag. While this works on the actual page, it doesn't when I write tests in Jest.

Here's the code:

import { renderApp } from "<src>/tests/util";
import { fireEvent, wait } from "react-testing-library";

import {
  getLocationAPath,
  getLocationBPath,
  getLocationCPath
} from "<src>/paths";

let getByDataQa;
let history;

beforeEach(() => {
  ({ getByDataQa, history } = renderApp(getLocationAPath(), {}));
});

test("Validate if routes work", async () => {
  let routePath;
  fireEvent.click(getByDataQa("Container.locB"));
  //await wait();
  routePath = getLocationBPath();
  expect(history.location.pathname).toEqual(routePath);

  fireEvent.click(getByDataQa("Container.locC"));
  routePath = getLocationCPath();
  console.log(history.location.pathname);
  expect(history.location.pathname).toEqual(routePath);

});

<li> <a href={getLocationBPath()} className={classNames(styles.bar)} data-qa="foo" title="xyz" /> </li> — ABGR
– ABGR, Commented Feb 16, 2019 at 11:01

ABGR · Accepted Answer · 2020-05-03 14:20:27Z

1

I replaced anchors with href to Links. That solved the issue.

edited May 3, 2020 at 14:20

answered Feb 21, 2019 at 8:20

ABGR

5,2634 gold badges34 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

React Jest/React-testing-Library route change not working properly

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related