Basic validator mixin for React

Validator.js

var ValidatorMixin = {
  validate: function() {
    var obj = this.state[this.validationObject];
    var errors = {};
    for (var key in this.validationRules) {
      var rule = this.validationRules[key];
      if (!rule.valid(obj[key])) {
        errors[key] = rule.message;
      }
    }

    if (Object.keys(errors).length === 0) {
      this.setState({errors: null});
      return true;
    } else {
      this.setState({errors: errors});
      return false;
    }
  }
};

var ValidationRules = {
  notEmptyHtml: function(v) {
    v = v.replace(/<\/?[a-z]*>/g, '');
    v = v.replace(/&nbsp;/g, '');
    return !String.isEmpty(v);
  }
};

module.exports = {
  mixin: ValidatorMixin,
  rules: ValidationRules
};

Validator_spec.js

/* jshint expr:true */

var React = require('react/addons');
var TestUtils = React.addons.TestUtils;

var chai = require('chai');
var expect = chai.expect;

var Validator = require('components/mixins/Validator');

var valid = function() { return true; };
var message = 'dummy message';

var testComponent;

function buildTestComponent() {
  return React.createClass({
    mixins: [Validator.mixin],
    validationObject: 'data',
    validationRules: {
      value: {
        valid: valid,
        message: message
      }
    },

    getInitialState: function() {
      return {
        data: {
          value: 10
        }
      };
    },

    render: function() {
      return <div></div>;
    }
  });
}

describe('Validator mixin', function() {
  it('validates when all the rules pass', function () {
    var subject = TestUtils.renderIntoDocument(React.createElement(buildTestComponent()));

    expect(subject.validate()).to.be.true;
    expect(subject.state.errors).to.not.exist;
  });

  it('updates state of the mixed in component if there is a validation error', function() {
    valid = function(v) {
      return (v === 1);
    };
    message = 'value must be 1';

    var subject = TestUtils.renderIntoDocument(React.createElement(buildTestComponent()));

    expect(subject.validate()).to.be.false;
    expect(subject.state.errors).to.exist;
    expect(subject.state.errors.value).to.eq(message);
  });

  it('clears errors if the test passes after failing', function() {
    valid = function(v) { return (v === 1); };
    message = 'value must be 1';

    var subject = TestUtils.renderIntoDocument(React.createElement(buildTestComponent()));
    expect(subject.validate()).to.be.false;

    subject.setState({data: {value: 1}});

    expect(subject.validate()).to.be.true;
    expect(subject.state.errors).to.not.exist;
  });
});

describe('validation methods', function() {
  describe('not empty html (notEmptyHtml)', function() {
    it('validates when there is valid content in html tags', function() {
      var testString = "<p>This is a fertile land. And we shall call it, This Land.</p>";

      expect(Validator.rules.notEmptyHtml(testString)).to.be.true;
    });

    it('does not validate when the content between tags is empty', function() {
      var testString = "<p></p>";

      expect(Validator.rules.notEmptyHtml(testString)).to.be.false;
    });

    it('treats &nbsp; as spaces', function() {
      var testString = "&nbsp;&nbsp;";

      expect(Validator.rules.notEmptyHtml(testString)).to.be.false;
    });

    it('treats &nbsp; inside html as empty', function() {
      var testString = '<p>&nbsp; &nbsp;</p>';

      expect(Validator.rules.notEmptyHtml(testString)).to.be.false;
    });
  });
});