Question

快速摘要-我有一个React应用。单元测试库是反应测试库。该组件是由react-router-dom

中的withRouter封装的

问题-即使显示8个测试通过和一些跳过的信息，代码覆盖率也显示为0％。如果我从withRouter卸下组件，则代码覆盖率显示正确的覆盖率结果。

请检查下面我要匹配快照的代码。

public function index(Request $req) 
{
    if ($req->search == "") {
          $books = Book::paginate(5);
          return view('admin.books.index', compact('books'));

    } else {

            $validated = $req->validate([
                'search' => 'alpha', 
            ]);

   $books = Book::whereHas('authors', function($query) use($req) {
            $query->where('name', 'like', '%' . $req->search . '%');
        })->paginate(5);
  return view('admin.books.index', compact('books'));
  }

}

我应该能够将withRouter用于该组件并查看覆盖范围。

Answer 1

我认为您的测试应该是这样的：

it('renders the component', () => {
  const component = mount(<BrowserRouter><Profile /></BrowserRouter>);
  expect(component).toMatchSnapshot();
});

Answer 2

withRouter用于在您的应用程序中注入路由器数据。

在测试中，您必须将路由器呈现为组件树的一部分：

import { MemoryRouter } from 'react-router-dom';

it('renders the component', () => {
  const { container } = render(<MemoryRouter><Profile /></MemoryRouter>);
  expect(container).toMatchSnapshot();
});

如果您要确保应用程序正常运行，建议不要仅使用快照测试。

与Router一起使用时，代码覆盖率返回0％

2 个答案: