react-jsonschema-form-validation/dist/Form/helpers.test.js

Simple form validation using JSON Schema and AJV

import Ajv from 'ajv';
import React from 'react';
import { mount } from 'enzyme';
import * as helpers from './helpers';
describe('.createAjv()', function () {
  it('should return an Ajv instance', function () {
    var ajv = helpers.createAjv();
    expect(ajv).toBeInstanceOf(Ajv);
  });
});
describe('.empty(value)', function () {
  it('should return undefined if value is undefined, null or an empty string', function () {
    expect(helpers.empty(undefined)).toBeUndefined();
    expect(helpers.empty(null)).toBeUndefined();
    expect(helpers.empty('')).toBeUndefined();
  });
});
describe('.formatData(data)', function () {
  it('should call .empty() deeply for every values of the data object', function () {
    var data = {
      empt: '',
      arr: [],
      nest: {
        val: '',
        arr: [{
          val: null
        }]
      }
    };
    expect(helpers.formatData(data)).toEqual({
      empt: undefined,
      arr: [],
      nest: {
        val: undefined,
        arr: [{
          val: undefined
        }]
      }
    });
  });
});
describe('.formatErrors(errors)', function () {
  it('should add a property field to each errors', function () {
    var errors = [{
      dataPath: 'input'
    }];
    expect(helpers.formatErrors(errors)[0]).toHaveProperty('field');
  });
  it('should add a property field for required errors', function () {
    var errors = [{
      dataPath: 'nested',
      keyword: 'required',
      params: {
        missingProperty: 'input'
      }
    }];
    expect(helpers.formatErrors(errors)[0].field).toStrictEqual('nested.input');
    errors = [{
      dataPath: '',
      keyword: 'required',
      params: {
        missingProperty: 'input'
      }
    }];
    expect(helpers.formatErrors(errors)[0].field).toStrictEqual('input');
  });
  it('should array bracket notation to dot notation', function () {
    var errors = [{
      dataPath: 'arr[0].input'
    }];
    expect(helpers.formatErrors(errors)[0].field).toStrictEqual('arr.0.input');
  });
});
describe('.filterByFieldNameWithWildcard(fields, fieldName)', function () {
  it('should filter fields by their field property', function () {
    var fields = [{
      field: 'name'
    }, {
      field: 'name1'
    }, {
      field: '1name'
    }, {
      field: ''
    }, {}];
    expect(helpers.filterByFieldNameWithWildcard(fields, 'name')).toEqual([{
      field: 'name'
    }]);
  });
  it('should allow to filter fields by their field property beginning with using wildcard', function () {
    var fields = [{
      field: 'name'
    }, {
      field: 'name1'
    }, {
      field: '1name'
    }, {
      field: ''
    }, {}];
    expect(helpers.filterByFieldNameWithWildcard(fields, 'name*')).toEqual([{
      field: 'name'
    }, {
      field: 'name1'
    }]);
  });
});
describe('.getInputCheckboxValue(target)', function () {
  it('should return a boolean depending on checked attribute', function () {
    var input = mount(React.createElement("input", {
      name: "field",
      type: "checkbox"
    }));
    input.instance().checked = true;
    var checkbox = input.getDOMNode();
    expect(helpers.getInputCheckboxValue(checkbox)).toBe(true);
    input.instance().checked = false;
    expect(helpers.getInputCheckboxValue(checkbox)).toBe(false);
    input.instance().checked = undefined;
    expect(helpers.getInputCheckboxValue(checkbox)).toBe(false);
  });
});
describe('.getInputFileValue(target)', function () {
  it('should return a File if a file is selected and multiple attribute is false', function () {
    var input = mount(React.createElement("input", {
      name: "field",
      type: "file"
    }));
    var file = input.getDOMNode();
    Object.defineProperty(file, 'files', {
      value: ['file1'],
      configurable: true
    });
    Object.defineProperty(file, 'value', {
      value: 'path/file1'
    });
    expect(helpers.getInputFileValue(file)).toBe('file1');
    Object.defineProperty(file, 'files', {
      value: ['file1', 'file2'],
      configurable: true
    });
    expect(helpers.getInputFileValue(file)).toBe('file1');
  });
  it('should return a list of File if a file is selected and multiple attribute is true', function () {
    var input = mount(React.createElement("input", {
      name: "field",
      type: "file"
    }));
    var file = input.getDOMNode();
    file.multiple = true;
    Object.defineProperty(file, 'files', {
      value: ['file1'],
      configurable: true
    });
    Object.defineProperty(file, 'value', {
      value: 'path/file1'
    });
    expect(helpers.getInputFileValue(file)).toEqual(['file1']);
    Object.defineProperty(file, 'files', {
      value: ['file1', 'file2'],
      configurable: true
    });
    expect(helpers.getInputFileValue(file)).toEqual(['file1', 'file2']);
  });
  it('should an empty string if no file is selected', function () {
    var input = mount(React.createElement("input", {
      name: "field",
      type: "file"
    }));
    var file = input.getDOMNode();
    expect(helpers.getInputFileValue(file)).toBe('');
    file.multiple = true;
    expect(helpers.getInputFileValue(file)).toBe('');
  });
});
describe('.getInputNumberValue(target)', function () {
  it('should return a Number if input is not empty', function () {
    var input = mount(React.createElement("input", {
      name: "field",
      type: "number"
    }));
    var number = input.getDOMNode();
    number.value = 3;
    expect(helpers.getInputNumberValue(number)).toBe(3);
    number.value = Math.PI;
    expect(helpers.getInputNumberValue(number)).toBe(Math.PI);
    number.value = '3.14';
    expect(helpers.getInputNumberValue(number)).toBeCloseTo(Math.PI);
    number.value = -753141.43;
    expect(helpers.getInputNumberValue(number)).toBeCloseTo(-753141.43);
    number.value = 0;
    expect(helpers.getInputNumberValue(number)).toBeCloseTo(0);
  });
  it('should an empty string if input is empty', function () {
    var input = mount(React.createElement("input", {
      name: "field",
      type: "number"
    }));
    var number = input.getDOMNode();
    expect(helpers.getInputNumberValue(number)).toBe('');
  });
});
describe('.getFieldValue(target)', function () {
  it('should return string value for text input type text', function (done) {
    var handleChange = function handleChange(_ref) {
      var target = _ref.target;
      var value = helpers.getFieldValue(target);
      expect(value).toBe('newvalue');
      done();
    };

    var input = mount(React.createElement("input", {
      name: "field",
      type: "text",
      onChange: handleChange
    }));
    input.getDOMNode().value = 'newvalue';
    input.simulate('change');
  });
  it('should return a string value for textarea', function (done) {
    var handleChange = function handleChange(event) {
      var target = event.target;
      var value = helpers.getFieldValue(target);
      expect(value).toBe('newvalue');
      done();
    };

    var input = mount(React.createElement("textarea", {
      name: "field",
      type: "text",
      onChange: handleChange
    }));
    input.instance().value = 'newvalue';
    input.simulate('change');
  });
  it('should return a boolean value for checkbox', function (done) {
    var handleChange = function handleChange(event) {
      var target = event.target;
      var value = helpers.getFieldValue(target);
      expect(value).toBe(true);
      done();
    };

    var input = mount(React.createElement("input", {
      name: "field",
      type: "checkbox",
      onChange: handleChange
    }));
    input.instance().checked = true;
    input.simulate('change');
  });
  it('should return a string value for radio', function (done) {
    var handleChange = function handleChange(event) {
      var target = event.target;
      var value = helpers.getFieldValue(target);
      expect(value).toBe('value1');
      done();
    };

    var input = mount(React.createElement("input", {
      name: "field",
      type: "radio",
      value: "value1",
      onChange: handleChange
    }));
    input.instance().checked = true;
    input.simulate('change');
  });
  it('should return a file or an array of files as value for input file', function (done) {
    var handleChange = function handleChange(event) {
      var target = event.target;
      var value = helpers.getFieldValue(target);
      expect(value).toBe('file1');
      done();
    };

    var input = mount(React.createElement("input", {
      name: "field",
      type: "file",
      onChange: handleChange
    }));
    var domInput = input.getDOMNode();
    Object.defineProperty(domInput, 'files', {
      value: ['file1']
    });
    Object.defineProperty(domInput, 'value', {
      value: 'path/file1'
    });
    input.simulate('change');

    handleChange = function handleChange(event) {
      var target = event.target;
      var value = helpers.getFieldValue(target);
      expect(value).toEqual(['file1', 'file2']);
      done();
    };

    input = mount(React.createElement("input", {
      name: "field",
      type: "file",
      multiple: true,
      onChange: handleChange
    }));
    domInput = input.getDOMNode();
    Object.defineProperty(domInput, 'files', {
      value: ['file1', 'file2']
    });
    Object.defineProperty(domInput, 'value', {
      value: 'path/file1'
    });
    input.simulate('change');
  });
  it('should a number value for input number', function (done) {
    var handleChange = function handleChange(event) {
      var target = event.target;
      var value = helpers.getFieldValue(target);
      expect(value).toBe(12.2);
      done();
    };

    var input = mount(React.createElement("input", {
      name: "field",
      type: "number",
      onChange: handleChange
    }));
    input.instance().value = '12.2';
    input.simulate('change');
  });
});
describe('.updateDataFromEvents(data, events)', function () {
  it('should copy data object if modified', function () {
    var data = {
      field: 'val'
    };
    var event = {
      target: {
        name: 'field',
        value: 'newval'
      }
    };
    var result = helpers.updateDataFromEvents(data, event);
    expect(result).toEqual({
      field: 'newval'
    });
    expect(result).not.toBe(data);
  });
  it('should allow to pass events as a single Event or an array of Events', function () {
    var spy = jest.spyOn(Array.prototype, 'forEach');
    var data = {
      field: 'val'
    };
    var event = {
      target: {
        name: 'field',
        value: 'newval'
      }
    };
    helpers.updateDataFromEvents(data, [event]);
    expect(spy).toHaveBeenCalled();
    helpers.updateDataFromEvents(data, event);
    expect(spy).toHaveBeenCalled();
    spy.mockRestore();
  });
  it('should return data object if not modified', function () {
    var data = {
      field: 'val'
    };
    var result = helpers.updateDataFromEvents(data);
    expect(result).toBe(data);
  });
  it('should allow to update nested objects', function () {
    var data = {
      nested: {
        field: 'val'
      }
    };
    var event = {
      target: {
        name: 'nested.field',
        value: 'newval'
      }
    };
    var result = helpers.updateDataFromEvents(data, event);
    expect(result).toEqual({
      nested: {
        field: 'newval'
      }
    });
    expect(result).not.toBe(data);
  });
  it('should allow to update nested arrays', function () {
    var data = {
      nested: {
        arr: [{
          field: 'val1'
        }, {
          field: 'val2'
        }]
      }
    };
    var event = {
      target: {
        name: 'nested.arr.1.field',
        value: 'newval2'
      }
    };
    var result = helpers.updateDataFromEvents(data, event);
    expect(result).toEqual({
      nested: {
        arr: [{
          field: 'val1'
        }, {
          field: 'newval2'
        }]
      }
    });
    expect(result).not.toBe(data);
  });
  it('should copy only nested objects that have been modified', function () {
    var data = {
      nested1: {
        field: 'val'
      },
      nested2: {
        field: 'val'
      }
    };
    var event = {
      target: {
        name: 'nested1.field',
        value: 'newval'
      }
    };
    var result = helpers.updateDataFromEvents(data, event);
    expect(result).toEqual({
      nested1: {
        field: 'newval'
      },
      nested2: {
        field: 'val'
      }
    });
    expect(result).not.toBe(data);
    expect(result.nested1).not.toBe(data.nested1);
    expect(result.nested2).toBe(data.nested2);
  });
});