JSFiddle - React, Tailwind, and code Playground

by Fagner Brack

HTML

<script src="https://code.jquery.com/qunit/qunit-2.6.1.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.6.1.css">
<div id="qunit"></div>
<div id="qunit-fixture"></div>

JavaScript

window.require = (moduleName) => {
	return {
    './get-age-from-date.js': (date, now) => {
      return now - date.split('-')[0] + ' years';
    },
    './get-value.js': (formFieldLookupName, providerFields) => {
	    const getAgeFromDate = require('./get-age-from-date.js');
      if (formFieldLookupName === 'age') {
        return getAgeFromDate(
          providerFields.dateOfBirth,
          2018 // Imagine new Date() something
        );
      }
      return providerFields[formFieldLookupName];
    },
    './prefill-fields.js': (formFields, providerFields) => {
      const getValue = require('./get-value.js');
      return Object.keys(formFields).reduce((accumulator, fieldName) => {
        accumulator[fieldName] = getValue(fieldName, providerFields);
        return accumulator;
      }, {});
    },
  }[moduleName];
};

QUnit.test('prefillFields(formFields, providerFields)', (assert) => {
  const prefillFields = require('./prefill-fields.js');
  assert.deepEqual(prefillFields({}, {}), {});
  
  assert.deepEqual(prefillFields(
    { name: '' },
    { name: 'John' }
  ), { name: 'John' });

  assert.deepEqual(prefillFields(
    { name: '' },
    { name: 'Mary' }
  ), { name: 'Mary' });

  assert.deepEqual(prefillFields(
    { name: '', height: '' },
    { name: 'Mary', height: '69"' }
  ), { name: 'Mary', height: '69"' });

  assert.deepEqual(prefillFields(
    { name: '', height: '' },
    { name: 'Mary', height: '73"' }
  ), { name: 'Mary', height: '73"' });
});

QUnit.test('getValue(formFieldLookupValue, providerFields)', (assert) => {
  const getValue = require('./get-value.js');
  assert.deepEqual(getValue('name', { name: 'Mike' }), 'Mike');
  assert.deepEqual(getValue('age', { dateOfBirth: '1990-06-07' }), '28 years');
});

QUnit.test('getAgeFromDate(date, now)', (assert) => {
	const getAgeFromDate = require('./get-age-from-date.js');
  assert.deepEqual(getAgeFromDate('1990-04-04', 2018), '28 years');
  assert.deepEqual(getAgeFromDate('1986-06-07',...