Ƙara Gwaji zuwa Next.js Aikace-aikace: Jagora don Haɗawa Unit Test

A cikin wannan sashe, za mu jagorance ku ta hanyar haɓaka Next.js ingancin aikace-aikacenku ta ƙara gwajin naúrar da haɗin kai. Za mu yi amfani da dakunan karatu na gwaji kamar Jest kuma Testing Library don tabbatar da inganci da aikin aikace-aikacenku.

Gwajin naúrar tare da Jest

Jest sanannen ne testing library don yin gwajin naúrar a JavaScript aikace-aikace. Anan ga yadda zaku iya ƙara gwajin naúrar zuwa Next.js aikace-aikacenku ta amfani da Jest:

Shigar Jest da ɗakunan karatu masu alaƙa:

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

Ƙirƙiri Jest fayil ɗin daidaitawa( jest.config.js):

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

Rubuta gwajin naúrar ta amfani da Jest:

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

Gwajin Haɗin kai tare da Testing Library

Testing Library kayan aiki ne mai ƙarfi don gwada hulɗar masu amfani a aikace-aikace. Anan ga yadda zaku iya ƙara gwajin haɗin kai zuwa Next.js aikace-aikacenku ta amfani da Testing Library:

Shigar Testing Library da ɗakunan karatu masu alaƙa:

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

Rubuta gwajin haɗin kai ta amfani da 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();  
});  

Kammalawa

Wannan sashe ya gabatar da ku don haɓaka Next.js ingancin aikace-aikacenku ta ƙara naúrar da gwaje-gwajen haɗin kai ta amfani da dakunan gwaje-gwaje kamar Jest ko Testing Library. Ta hanyar yin gwaje-gwaje, zaku iya tabbatar da dogaro da aiki na aikace-aikacenku, yayin ganowa da magance batutuwa yadda ya kamata.