close

向应用程序添加测试 Next.js ：合并指南 Unit Test

在本节中，我们将指导您完成通过添加单元和集成测试来提高应用程序质量的过程 Next.js。 Jest 我们将使用和 等测试库 Testing Library 来确保您的应用程序的可靠性和功能性。

单元测试 Jest

Jest 是 testing library 在应用程序中执行单元测试的流行方法 JavaScript。 Next.js 以下是如何使用 以下命令将单元测试添加到应用程序中 Jest：

安装 Jest 及相关库： 

npm install jest @babel/preset-env @babel/preset-react babel-jest react-test-renderer --save-dev

创建 Jest 配置文件（ jest.config.js ）： 

module.exports = {  
  testEnvironment: 'jsdom',  
  transform: {  
    '^.+\\.jsx?$': 'babel-jest',  
  },  
};

使用以下方法编写单元测试 Jest： 

import { sum } from './utils';  
  
test('adds 1 + 2 to equal 3',() => {  
  expect(sum(1, 2)).toBe(3);  
});

集成测试 Testing Library

Testing Library 是一个强大的工具包，用于测试应用程序中的用户交互。 Next.js 以下是如何使用 以下方法将集成测试添加到应用程序中 Testing Library：

安装 Testing Library 及相关库： 

npm install @testing-library/react @testing-library/jest-dom --save-dev

使用以下方法编写集成测试 Testing Library： 

import { render, screen } from '@testing-library/react';  
import App from './App';  
  
test('renders learn react link',() => {  
  render(<App />);  
  const linkElement = screen.getByText(/learn react/i);  
  expect(linkElement).toBeInTheDocument();  
});

结论

本部分向您介绍如何使用测试库（例如或 ） Next.js 添加单元和集成测试来 提高应用程序的质量 。 通过执行测试，您可以确保应用程序的可靠性和功能，同时有效地检测和解决问题。 Jest Testing Library