react-testing-library中的父节点

import { render, screen } from '@testing-library/react';
import MyComponent from './MyComponent';

test('gets the parent node', () => {
  render(<MyComponent />);
  
  // 假设父节点有一个 data-testid 属性
  const parentNode = screen.getByTestId('parent-node');
  
  // 现在你可以对父节点进行操作或断言
  expect(parentNode).toBeInTheDocument();
});

import { render, screen, fireEvent } from '@testing-library/react';
import MyComponent from './MyComponent';

test('simulates a click on the parent node', () => {
  render(<MyComponent />);
  
  const parentNode = screen.getByTestId('parent-node');
  
  // 模拟点击事件
  fireEvent.click(parentNode);
  
  // 进行断言
  expect(someOtherElement).toHaveTextContent('Clicked!');
});

import { render } from '@testing-library/react';
import ParentComponent from './ParentComponent';

test('passes state to child component', () => {
  const { getByTestId } = render(<ParentComponent />);
  
  const childComponent = getByTestId('child-component');
  
  // 假设子组件会根据接收到的状态显示不同的文本
  expect(childComponent).toHaveTextContent('Expected state from parent');
});