Question

我刚刚加入了一个前团队，并被要求对应用程序进行一些测试，我需要检查只有在用户输入的网址不正确时，我的“未找到”页面才会出现。

我知道如果我们的应用程序路由使用react路由器但我的团队不使用它，则存在MemoryRouter：

<MemoryRouter initialEntries={["/random"]}>
    <Routes />
</MemoryRouter>

这是管理路由的组件：

const routes = {
  path: "",
  children: [
    {
      path: "/",
      load: () => import(/* webpackChunkName: 'home' */ "./home")
    },
    {
      path: "/login",
      load: () => import(/* webpackChunkName: 'login' */ "./login")
    },
    {
      path: "/delivery",
      load: () => import(/* webpackChunkName: 'delivery' */ "./delivery")
    },
    {
      path: "/offers",
      load: () => import(/* webpackChunkName: 'delivery' */ "./offers")
    },
    // Wildcard routes, e.g. { path: '(.*)', ... } (must go last)
    {
      path: "(.*)",
      load: () => import(/* webpackChunkName: 'not-found' */ "./not-found")
    }
  ],
  async action({ next }) {
    const route = await next();
    return route;
  }
};

**export default routes:**

所以我仍然尝试使用MemoryRouter，但是它不起作用：

import React from "react";
import { mount } from "enzyme";
import { MemoryRouter } from "react-router";
import { Route } from "react-router-dom";
import NotFoundPage from "../routes/not-found/NotFound";
import Routes from "../routes/index";

describe("testing NotFoundPage", () => {
  it("should go to 404 page", () => {
    const component = mount(
      <MemoryRouter initialEntries={["/random"]}>
        <Routes />
      </MemoryRouter>
    );
    expect(component.find(NotFoundPage)).toHaveLength(1);
  });
});

用玩笑和酶测试NotFoundPage

0 个答案: