Skip to content

Commit

Permalink
Remove dormant createBatch experiment (#17035)
Browse files Browse the repository at this point in the history 
* Remove dormant createBatch experiment

In a hybrid React app with multiple roots, `createBatch` is used to
coordinate an update to a root with its imperative container.

We've pivoted away from multi-root, hybrid React apps for now to focus
on single root apps.

This PR removes the API from the codebase. It's possible we'll add back
some version of this feature in the future.

* Remove unused export
  • Loading branch information
@acdlite
acdlite committed Oct 7, 2019
1 parent cd1b167 commit 71d012e
Show file tree
Hide file tree
Showing 10 changed files with 150 additions and 815 deletions.
223 changes: 0 additions & 223 deletions packages/react-dom/src/__tests__/ReactDOMRoot-test.js
View file
Expand Up @@ -43,35 +43,6 @@ describe('ReactDOMRoot', () => {
expect(container.textContent).toEqual('');
});

it('`root.render` returns a thenable work object', () => {
const root = ReactDOM.unstable_createRoot(container);
const work = root.render('Hi');
let ops = [];
work.then(() => {
ops.push('inside callback: ' + container.textContent);
});
ops.push('before committing: ' + container.textContent);
Scheduler.unstable_flushAll();
ops.push('after committing: ' + container.textContent);
expect(ops).toEqual([
'before committing: ',
// `then` callback should fire during commit phase
'inside callback: Hi',
'after committing: Hi',
]);
});

it('resolves `work.then` callback synchronously if the work already committed', () => {
const root = ReactDOM.unstable_createRoot(container);
const work = root.render('Hi');
Scheduler.unstable_flushAll();
let ops = [];
work.then(() => {
ops.push('inside callback');
});
expect(ops).toEqual(['inside callback']);
});

it('supports hydration', async () => {
const markup = await new Promise(resolve =>
resolve(
Expand Down Expand Up @@ -129,200 +100,6 @@ describe('ReactDOMRoot', () => {
expect(container.textContent).toEqual('abdc');
});

it('can defer a commit by batching it', () => {
const root = ReactDOM.unstable_createRoot(container);
const batch = root.createBatch();
batch.render(<div>Hi</div>);
// Hasn't committed yet
expect(container.textContent).toEqual('');
// Commit
batch.commit();
expect(container.textContent).toEqual('Hi');
});

it('applies setState in componentDidMount synchronously in a batch', done => {
class App extends React.Component {
state = {mounted: false};
componentDidMount() {
this.setState({
mounted: true,
});
}
render() {
return this.state.mounted ? 'Hi' : 'Bye';
}
}

const root = ReactDOM.unstable_createRoot(container);
const batch = root.createBatch();
batch.render(<App />);

Scheduler.unstable_flushAll();

// Hasn't updated yet
expect(container.textContent).toEqual('');

let ops = [];
batch.then(() => {
// Still hasn't updated
ops.push(container.textContent);

// Should synchronously commit
batch.commit();
ops.push(container.textContent);

expect(ops).toEqual(['', 'Hi']);
done();
});
});

it('does not restart a completed batch when committing if there were no intervening updates', () => {
let ops = [];
function Foo(props) {
ops.push('Foo');
return props.children;
}
const root = ReactDOM.unstable_createRoot(container);
const batch = root.createBatch();
batch.render(<Foo>Hi</Foo>);
// Flush all async work.
Scheduler.unstable_flushAll();
// Root should complete without committing.
expect(ops).toEqual(['Foo']);
expect(container.textContent).toEqual('');

ops = [];

// Commit. Shouldn't re-render Foo.
batch.commit();
expect(ops).toEqual([]);
expect(container.textContent).toEqual('Hi');
});

it('can wait for a batch to finish', () => {
const root = ReactDOM.unstable_createRoot(container);
const batch = root.createBatch();
batch.render('Foo');

Scheduler.unstable_flushAll();

// Hasn't updated yet
expect(container.textContent).toEqual('');

let ops = [];
batch.then(() => {
// Still hasn't updated
ops.push(container.textContent);
// Should synchronously commit
batch.commit();
ops.push(container.textContent);
});

expect(ops).toEqual(['', 'Foo']);
});

it('`batch.render` returns a thenable work object', () => {
const root = ReactDOM.unstable_createRoot(container);
const batch = root.createBatch();
const work = batch.render('Hi');
let ops = [];
work.then(() => {
ops.push('inside callback: ' + container.textContent);
});
ops.push('before committing: ' + container.textContent);
batch.commit();
ops.push('after committing: ' + container.textContent);
expect(ops).toEqual([
'before committing: ',
// `then` callback should fire during commit phase
'inside callback: Hi',
'after committing: Hi',
]);
});

it('can commit an empty batch', () => {
const root = ReactDOM.unstable_createRoot(container);
root.render(1);

Scheduler.unstable_advanceTime(2000);
// This batch has a later expiration time than the earlier update.
const batch = root.createBatch();

// This should not flush the earlier update.
batch.commit();
expect(container.textContent).toEqual('');

Scheduler.unstable_flushAll();
expect(container.textContent).toEqual('1');
});

it('two batches created simultaneously are committed separately', () => {
// (In other words, they have distinct expiration times)
const root = ReactDOM.unstable_createRoot(container);
const batch1 = root.createBatch();
batch1.render(1);
const batch2 = root.createBatch();
batch2.render(2);

expect(container.textContent).toEqual('');

batch1.commit();
expect(container.textContent).toEqual('1');

batch2.commit();
expect(container.textContent).toEqual('2');
});

it('commits an earlier batch without committing a later batch', () => {
const root = ReactDOM.unstable_createRoot(container);
const batch1 = root.createBatch();
batch1.render(1);

// This batch has a later expiration time
Scheduler.unstable_advanceTime(2000);
const batch2 = root.createBatch();
batch2.render(2);

expect(container.textContent).toEqual('');

batch1.commit();
expect(container.textContent).toEqual('1');

batch2.commit();
expect(container.textContent).toEqual('2');
});

it('commits a later batch without committing an earlier batch', () => {
const root = ReactDOM.unstable_createRoot(container);
const batch1 = root.createBatch();
batch1.render(1);

// This batch has a later expiration time
Scheduler.unstable_advanceTime(2000);
const batch2 = root.createBatch();
batch2.render(2);

expect(container.textContent).toEqual('');

batch2.commit();
expect(container.textContent).toEqual('2');

batch1.commit();
Scheduler.unstable_flushAll();
expect(container.textContent).toEqual('1');
});

it('handles fatal errors triggered by batch.commit()', () => {
const root = ReactDOM.unstable_createRoot(container);
const batch = root.createBatch();
const InvalidType = undefined;
expect(() => batch.render(<InvalidType />)).toWarnDev(
['React.createElement: type is invalid'],
{withoutStack: true},
);
expect(() => batch.commit()).toThrow('Element type is invalid');
});

it('throws a good message on invalid containers', () => {
expect(() => {
ReactDOM.unstable_createRoot(<div>Hi</div>);
Expand Down

0 comments on commit 71d012e

Please sign in to comment.