如何在应用测试中导航至指定路径，验证未授权用户重定向至登录页

针对你测试未授权用户访问会员页面是否跳转登录页的场景，以下是几种可行的实现方式，基于React Testing Library和React Router（主流路由库）：

方法1：直接修改window.location（简单快捷） #

直接通过window.location.assign修改地址，配合waitFor等待路由异步跳转完成：

import { render, waitFor } from '@testing-library/react';
import App from './App';

// 修正原代码语法错误：() = { 改为 () => {
test('Unauthorized, open member page', async () => {
  // 渲染整个应用
  render(<App />);

  // 触发路由地址变更
  window.location.assign('/members/profile');

  // 等待路由跳转完成后断言
  await waitFor(() => {
    // 用toContain更灵活，避免硬编码完整URL
    expect(window.location.href).toContain('/login');
  });
});

方法2：使用React Router的navigate钩子（更贴合路由逻辑） #

如果项目使用React Router v6，可以通过renderHook获取useNavigate钩子来触发跳转：

import { render, waitFor, renderHook } from '@testing-library/react';
import { useNavigate, BrowserRouter } from 'react-router-dom';
import App from './App';

test('Unauthorized, open member page', async () => {
  // 获取navigate函数
  const { result } = renderHook(() => useNavigate(), {
    wrapper: BrowserRouter,
  });
  const navigate = result.current;

  // 渲染应用（需用BrowserRouter包裹，和项目实际路由结构一致）
  render(<App />, { wrapper: BrowserRouter });

  // 跳转到会员页面
  navigate('/members/profile');

  // 等待跳转并断言
  await waitFor(() => {
    expect(window.location.href).toContain('/login');
  });
});

方法3：初始化时设置路由（适合直接测试跳转逻辑） #

用MemoryRouter的initialEntries参数，直接让应用初始渲染在会员页面，验证是否自动跳转：

import { render, waitFor } from '@testing-library/react';
import { MemoryRouter } from 'react-router-dom';
import App from './App';

test('Unauthorized, open member page', async () => {
  // 初始路由设为会员页面
  render(
    <MemoryRouter initialEntries={['/members/profile']}>
      <App />
    </MemoryRouter>
  );

  // 等待跳转完成并断言
  await waitFor(() => {
    expect(window.location.href).toContain('/login');
  });
});

关键注意事项 #

• 路由跳转是异步操作：必须用waitFor或findBy*系列查询等待断言，不能同步判断，否则会因跳转未完成导致测试失败。
• React Router版本兼容：如果用v5，将useNavigate替换为useHistory，MemoryRouter用法基本一致。
• URL断言灵活性：避免硬编码完整http://localhost/login，用toContain('/login')适配不同测试环境的域名端口。

内容的提问来源于stack exchange，提问作者DarkTrick