How to test a href inside an object?

Question

I am implementing an sideBar in which i want to test my MenuItems routes href: "/", & href: "/AdminPage" by using enzyme.

but when I am trying to test my href by then getting error.

SideBar.js

import React, { useState } from "react";
import "./SideBar.css";

//More imports

const SideBar = ({ children }) => {
  const MenuItems = [
    {
      href: "/",
      icon: <Home/>,
      id: "Home",
      text: "Home",
    },
    {
      href: "/admin-page",
      icon: <Admin />,
      id: "AdminPage",
      text: "AdminPAge",
    }
  ];

  return (
    <Navigation
      activeMenuItemId={activeMenuItemId}
      collapsedToggleLabel="Expand navigation"
      menuItems={menuItems}
      dataTestId="NavigationTest"
    >
      {children}
    </Navigation>
  );
};

export default SideBar;

SideBar.test.js

import React from "react";
import { shallow } from "enzyme";
import { shallowToJson } from "enzyme-to-json";
import SideBar from "../SideBar";

describe("SideBar", () => {
  describe("Snapshots", () => {
    let component;

    beforeEach(() => {
      component = shallow(<SideBar />);
    });

    it("should be as expected", () => {
      expect(shallowToJson(component)).toMatchSnapshot();
    });
  });

   test('SideBar should render correctly in "debug" mode', () => {
    const component = shallow(<SideBar debug />);
    expect(component).toBeTruthy();
  });

 //here i was trying to test the href.
 test('Testing href', () => {
    const component = shallow(<SideBar />);
  });
});

Looking for a solution how I can test the href(rerouting) or is there any other way to test it?