Skip to content

Commit

Permalink
BAH-3139 | Fix DOB flakiness (#154)
Browse files Browse the repository at this point in the history
  • Loading branch information
SooryaKumaranC-tw authored Aug 4, 2023
1 parent 1c7bb29 commit 2109197
Show file tree
Hide file tree
Showing 2 changed files with 113 additions and 54 deletions.
97 changes: 43 additions & 54 deletions src/containers/CreatePerson.js
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,11 @@ class CreatePerson extends Component {
lastName: '',
gender: '',
birthdate: moment(),
age: {
years: 0,
months: 0,
days: 0
},
birthdateEstimated: false,
organization: '',
email: '',
Expand Down Expand Up @@ -85,7 +90,28 @@ class CreatePerson extends Component {

handleChange = ({ target: input }) => {
const person = { ...this.state.person };
person[input.name] = input.value;
if (input.name === 'birthdate') {
var birthdate = input.value;
const today = moment();
person.age.years = moment.duration(today.diff(birthdate)).years();
person.age.months = moment.duration(today.diff(birthdate)).months();
person.age.days = moment.duration(today.diff(birthdate)).days();
person.birthdate = birthdate;
} else if (
input.name === 'years' ||
input.name === 'months' ||
input.name === 'days'
) {
person.age[input.name] = input.value;
const now = moment();
const currentDOB = moment()
.year(now.year() - person.age.years)
.month(now.month() - person.age.months)
.date(now.date() - person.age.days);
person.birthdate = currentDOB.format('YYYY-MM-DD');
} else {
person[input.name] = input.value;
}
this.setState({ person });
};

Expand All @@ -101,50 +127,6 @@ class CreatePerson extends Component {
});
};

fromAgetoDate = e => {
// input name: years, months or days
let inputName = e.target.name;
// the user input for the years or months or days
let inputValue = e.target.value;

// mapping the values with the momentsjs required format
const getMomentFormat = {
year: 'years',
month: 'months',
day: 'days'
};
// takes two dates (now and current birthdate input) and calculates
// the difference between them in years, months and days
function toAge(date) {
let now = moment();
let userPickedDate = moment(date);
const diffDuration = moment.duration(now.diff(userPickedDate));
const age = {
year: diffDuration.years(),
month: diffDuration.months(),
day: diffDuration.days()
};
return age;
}

this.setState(prevState => {
const prevBirthdate = prevState.person.birthdate;

const toAgeObject = toAge(prevBirthdate);
let diff = inputValue - toAgeObject[inputName];

const person = { ...this.state.person };
person.birthdate = moment(prevBirthdate)
.subtract(diff, getMomentFormat[inputName])
.subtract(1, 'days')
.format('YYYY-MM-DD');

return {
person
};
});
};

handleClearForm() {
this.setState({
person: {
Expand All @@ -160,6 +142,11 @@ class CreatePerson extends Component {
occupation: '',
gender: '',
birthdate: moment(),
age: {
years: 0,
months: 0,
days: 0
},
birthdateEstimated: false
},
isRequestError: false
Expand Down Expand Up @@ -347,6 +334,8 @@ class CreatePerson extends Component {
birthdateEstimated
} = this.state.person;

const { years, months, days } = this.state.person.age;

const {
isRequestError,
isRequestLoading,
Expand Down Expand Up @@ -457,35 +446,35 @@ class CreatePerson extends Component {
<Input
type={'number'}
title={'Years '}
name={'year'}
name={'years'}
aria-label={'Years'}
aria-required="true"
onChange={this.fromAgetoDate}
value={moment.duration(moment().diff(birthdate)).years()}
onChange={this.handleChange}
value={years}
id="age"
min={0}
max={120}
/>
<Input
type={'number'}
title={'Months '}
name={'month'}
name={'months'}
aria-label={'Months'}
aria-required="true"
onChange={this.fromAgetoDate}
value={moment.duration(moment().diff(birthdate)).months()}
onChange={this.handleChange}
value={months}
id="months"
min={0}
max={12}
/>
<Input
type={'number'}
title={'Days '}
name={'day'}
name={'days'}
aria-label={'Days'}
aria-required="true"
onChange={this.fromAgetoDate}
value={moment.duration(moment().diff(birthdate)).days()}
onChange={this.handleChange}
value={days}
id="days"
min={0}
max={31}
Expand Down
70 changes: 70 additions & 0 deletions src/containers/CreatePerson.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { shallow } from 'enzyme';
import CreatePerson from './CreatePerson';
import Input from '../components/common/Input';
import SelectFromList from '../components/common/Dropdown';
import moment from 'moment';

describe('CreatePerson', () => {
let wrapper;
Expand Down Expand Up @@ -58,4 +59,73 @@ describe('CreatePerson', () => {
expect(wrapper.state().person.gender).toEqual(exampleGenderSelected);
});
}); // end of gender options describe

describe('the user populates birthdate', () => {
const exampleDOB = '2019-07-01';
let dobInput;

beforeEach(() => {
dobInput = wrapper.find('#birthdate');
dobInput.simulate('change', {
target: { value: exampleDOB, name: 'birthdate' }
});
});

it('should update the state property birthdate', () => {
expect(wrapper.state().person.birthdate).toEqual(exampleDOB);
});

it('requires birthdate input', () => {
expect(dobInput.props().required).toBe(true);
});

it('should update the state property age', () => {
const age = { years: 0, months: 0, days: 0 };
const today = moment();
age.years = moment.duration(today.diff(exampleDOB)).years();
age.months = moment.duration(today.diff(exampleDOB)).months();
age.days = moment.duration(today.diff(exampleDOB)).days();
expect(wrapper.state().person.age.years).toEqual(age.years);
expect(wrapper.state().person.age.months).toEqual(age.months);
expect(wrapper.state().person.age.days).toEqual(age.days);
});
}); // end of birthdate describe

describe('the user populates age (year, month and day)', () => {
const exampleYears = 4;
const exampleMonths = 1;
const exampleDays = 2;
let yearsInput, monthsInput, daysInput;
beforeEach(() => {
yearsInput = wrapper.find('#age');
monthsInput = wrapper.find('#months');
daysInput = wrapper.find('#days');
yearsInput.simulate('change', {
target: { value: exampleYears, name: 'years' }
});
monthsInput.simulate('change', {
target: { value: exampleMonths, name: 'months' }
});
daysInput.simulate('change', {
target: { value: exampleDays, name: 'days' }
});
});

it('should update the state property years, months and days', () => {
expect(wrapper.state().person.age.years).toEqual(exampleYears);
expect(wrapper.state().person.age.months).toEqual(exampleMonths);
expect(wrapper.state().person.age.days).toEqual(exampleDays);
});

it('should update the state property age', () => {
const now = moment();
const dob = moment()
.year(now.year() - exampleYears)
.month(now.month() - exampleMonths)
.date(now.date() - exampleDays);
expect(wrapper.state().person.birthdate).toEqual(
dob.format('YYYY-MM-DD')
);
});
}); // end of birthdate describe
}); // end of outer describe

0 comments on commit 2109197

Please sign in to comment.