On each update - builds a new virtual DOM subtree - diffs it with the old one - computes the minimal set of DOM mutations and put them in a queue - batch executes all updates
Nooooooooooo! "To set the record straight: React components are far more powerful than Angular templates; they should be compared with Angular’s directives instead. [Directives are Angular's way of creating custom elements]." Pete Hunt quora.com/Pete-Hunt/Posts/Facebooks-React-vs-AngularJS-A-Closer-Look
jest.dontMock('../CheckboxWithLabel.js'); describe('CheckboxWithLabel', function() { it('changes the text after click', function() { var React = require('react/addons'); var CheckboxWithLabel = require('.. /CheckboxWithLabel.js'); var TestUtils = React.addons.TestUtils; var checkbox = TestUtils.renderIntoDocument(
jest.dontMock('../CheckboxWithLabel.js'); describe('CheckboxWithLabel', function() { it('changes the text after click', function() { var React = require('react/addons'); var CheckboxWithLabel = require('.. /CheckboxWithLabel.js'); var TestUtils = React.addons.TestUtils; var checkbox = TestUtils.renderIntoDocument(
jest.dontMock('../CheckboxWithLabel.js'); describe('CheckboxWithLabel', function() { it('changes the text after click', function() { var React = require('react/addons'); var CheckboxWithLabel = require('.. /CheckboxWithLabel.js'); var TestUtils = React.addons.TestUtils; var checkbox = TestUtils.renderIntoDocument(
jest.dontMock('../CheckboxWithLabel.js'); describe('CheckboxWithLabel', function() { it('changes the text after click', function() { var React = require('react/addons'); var CheckboxWithLabel = require('.. /CheckboxWithLabel.js'); var TestUtils = React.addons.TestUtils; var checkbox = TestUtils.renderIntoDocument(
jest.dontMock('../CheckboxWithLabel.js'); describe('CheckboxWithLabel', function() { it('changes the text after click', function() { var React = require('react/addons'); var CheckboxWithLabel = require('.. /CheckboxWithLabel.js'); var TestUtils = React.addons.TestUtils; var checkbox = TestUtils.renderIntoDocument(
// Verify that it's Off by default var label = TestUtils.findRenderedDOMComponentWithTag( checkbox, 'label'); expect( label.getDOMNode().textContent).toEqual('Off'); // Simulate a click and verify that it is now On var input = TestUtils.findRenderedDOMComponentWithTag( checkbox, 'input'); TestUtils.Simulate.change(input); expect( label.getDOMNode().textContent).toEqual('On');
// Verify that it's Off by default var label = TestUtils.findRenderedDOMComponentWithTag( checkbox, 'label'); expect( label.getDOMNode().textContent).toEqual('Off'); // Simulate a click and verify that it is now On var input = TestUtils.findRenderedDOMComponentWithTag( checkbox, 'input'); TestUtils.Simulate.change(input); expect( label.getDOMNode().textContent).toEqual('On');