Facebook/react
1
0
Fork 0
mirror of https://github.com/facebook/react.git synced 2025-11-01 09:12:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

Convert ReactCompositeComponentDOMMinimalism to createRoot (#28194)

Browse Source 
Not sure if this was also meant to test findDOMNode. But sounded like it
was more interested in the rendering aspect and findDOMNode was just
used as a utility. If we want to keep the findDOMNode tests, I'd just
rename it to a legacy test to indicate it needs to be flagged.
This commit is contained in:
Sebastian Silbermann
2024-02-02 09:15:19 +01:00
committed by GitHub
parent 3cfe0cc0c2
commit c4e9ed3fef
1 changed files with 44 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/react-dom/src/__tests__/ReactCompositeComponentDOMMinimalism-test.js
Vendored
+44 -34
View File
@@ -11,15 +11,13 @@
// Requires
let React;
let ReactDOM;
let ReactTestUtils;
let ReactDOMClient;
let act;
// Test components
let LowerLevelComposite;
let MyCompositeComponent;
let expectSingleChildlessDiv;
/**
* Integration test, testing the combination of JSX with our unit of
* abstraction, `ReactCompositeComponent` does not ever add superfluous DOM
@@ -28,8 +26,8 @@ let expectSingleChildlessDiv;
describe('ReactCompositeComponentDOMMinimalism', () => {
beforeEach(() => {
React = require('react');
ReactDOM = require('react-dom');
ReactTestUtils = require('react-dom/test-utils');
ReactDOMClient = require('react-dom/client');
act = require('internal-test-utils').act;
LowerLevelComposite = class extends React.Component {
render() {
@@ -42,39 +40,51 @@ describe('ReactCompositeComponentDOMMinimalism', () => {
return <LowerLevelComposite>{this.props.children}</LowerLevelComposite>;
}
};
expectSingleChildlessDiv = function (instance) {
const el = ReactDOM.findDOMNode(instance);
expect(el.tagName).toBe('DIV');
expect(el.children.length).toBe(0);
};
});
it('should not render extra nodes for non-interpolated text', () => {
let instance = <MyCompositeComponent>A string child</MyCompositeComponent>;
instance = ReactTestUtils.renderIntoDocument(instance);
expectSingleChildlessDiv(instance);
it('should not render extra nodes for non-interpolated text', async () => {
const container = document.createElement('div');
const root = ReactDOMClient.createRoot(container);
await act(() => {
root.render(<MyCompositeComponent>A string child</MyCompositeComponent>);
});
const instance = container.firstChild;
expect(instance.tagName).toBe('DIV');
expect(instance.children.length).toBe(0);
});
it('should not render extra nodes for non-interpolated text', () => {
let instance = (
<MyCompositeComponent>{'Interpolated String Child'}</MyCompositeComponent>
);
instance = ReactTestUtils.renderIntoDocument(instance);
expectSingleChildlessDiv(instance);
it('should not render extra nodes for non-interpolated text', async () => {
const container = document.createElement('div');
const root = ReactDOMClient.createRoot(container);
await act(() => {
root.render(
<MyCompositeComponent>
{'Interpolated String Child'}
</MyCompositeComponent>,
);
});
const instance = container.firstChild;
expect(instance.tagName).toBe('DIV');
expect(instance.children.length).toBe(0);
});
it('should not render extra nodes for non-interpolated text', () => {
let instance = (
<MyCompositeComponent>
<ul>This text causes no children in ul, just innerHTML</ul>
</MyCompositeComponent>
);
instance = ReactTestUtils.renderIntoDocument(instance);
const el = ReactDOM.findDOMNode(instance);
expect(el.tagName).toBe('DIV');
expect(el.children.length).toBe(1);
expect(el.children[0].tagName).toBe('UL');
expect(el.children[0].children.length).toBe(0);
it('should not render extra nodes for non-interpolated text', async () => {
const container = document.createElement('div');
const root = ReactDOMClient.createRoot(container);
await act(() => {
root.render(
<MyCompositeComponent>
<ul>This text causes no children in ul, just innerHTML</ul>
</MyCompositeComponent>,
);
});
const instance = container.firstChild;
expect(instance.tagName).toBe('DIV');
expect(instance.children.length).toBe(1);
expect(instance.children[0].tagName).toBe('UL');
expect(instance.children[0].children.length).toBe(0);
});
});