Skip to content

Commit

Permalink
Update test following review
Browse files Browse the repository at this point in the history
 - Use beforeEach and afterEach to set up and tear down container element for use in each test
 - Move any functions specific to one test to within test body (improves readability imo)
  • Loading branch information
GordyD committed Nov 19, 2017
1 parent c98f56b commit e233d0e
Showing 1 changed file with 34 additions and 35 deletions.
69 changes: 34 additions & 35 deletions packages/react-dom/src/__tests__/ReactDOMComponentTree-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,39 +13,19 @@ describe('ReactDOMComponentTree', () => {
let React;
let ReactDOM;
let ReactDOMServer;

function renderMarkupIntoDocument(elt) {
const container = document.createElement('div');
// Force server-rendering path:
container.innerHTML = ReactDOMServer.renderToString(elt);
return ReactDOM.hydrate(elt, container);
}

function simulateInput(elem, value) {
const inputEvent = new Event('input', {
bubbles: true,
});
setUntrackedInputValue.call(elem, value);
elem.dispatchEvent(inputEvent);
}

function simulateClick(elem) {
const event = new MouseEvent('click', {
bubbles: true,
});
elem.dispatchEvent(event);
}

const setUntrackedInputValue = Object.getOwnPropertyDescriptor(
HTMLInputElement.prototype,
'value',
).set;
let container;

beforeEach(() => {
React = require('react');
ReactDOM = require('react-dom');
ReactDOMServer = require('react-dom/server');
document.innerHTML = '';
container = document.createElement('div');
document.body.appendChild(container);
});

afterEach(() => {
document.body.removeChild(container);
container = null;
});

it('finds nodes for instances', () => {
Expand All @@ -68,7 +48,12 @@ describe('ReactDOMComponentTree', () => {
}

function renderAndGetRef(toRef) {
const inst = renderMarkupIntoDocument(<Component toRef={toRef} />);
// We need to unmount any React components from previous assertions in
// this test
ReactDOM.unmountComponentAtNode(container);
const elt = <Component toRef={toRef} />;
container.innerHTML = ReactDOMServer.renderToString(elt);
const inst = ReactDOM.hydrate(elt, container);
return inst.refs.target.nodeName;
}

Expand Down Expand Up @@ -99,10 +84,15 @@ describe('ReactDOMComponentTree', () => {
}
}

function simulateClick(elem) {
const event = new MouseEvent('click', {
bubbles: true,
});
elem.dispatchEvent(event);
}

const component = <ClosestInstance />;
const container = document.createElement('div');
ReactDOM.render(<section>{component}</section>, container);
document.body.appendChild(container);
expect(currentTargetID).toBe(null);
simulateClick(document.getElementById(nonReactElemID));
expect(currentTargetID).toBe(closestInstanceID);
Expand Down Expand Up @@ -130,10 +120,21 @@ describe('ReactDOMComponentTree', () => {
}
}

const setUntrackedInputValue = Object.getOwnPropertyDescriptor(
HTMLInputElement.prototype,
'value',
).set;

function simulateInput(elem, value) {
const inputEvent = new Event('input', {
bubbles: true,
});
setUntrackedInputValue.call(elem, value);
elem.dispatchEvent(inputEvent);
}

const component = <Controlled />;
const container = document.createElement('div');
const instance = ReactDOM.render(component, container);
document.body.appendChild(container);
spyOn(console, 'error');
expectDev(console.error.calls.count()).toBe(0);
simulateInput(instance.a, finishValue);
Expand All @@ -151,7 +152,6 @@ describe('ReactDOMComponentTree', () => {
it('finds instance of node that is attempted to be unmounted', () => {
spyOn(console, 'error');
const component = <div />;
const container = document.createElement('div');
const node = ReactDOM.render(<div>{component}</div>, container);
ReactDOM.unmountComponentAtNode(node);
expectDev(console.error.calls.count()).toBe(1);
Expand All @@ -171,7 +171,6 @@ describe('ReactDOMComponentTree', () => {
</div>
);
const anotherComponent = <div />;
const container = document.createElement('div');
const instance = ReactDOM.render(component, container);
ReactDOM.render(anotherComponent, instance);
expectDev(console.error.calls.count()).toBe(1);
Expand Down

0 comments on commit e233d0e

Please sign in to comment.