ayo/lion
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(localize): unforce defaults when options are given

Browse source 
should not force defaults when at least one of the three date options is given (day, month, year).
also added test cases and storybook demo.
This commit is contained in:
r4zorgeek 2019-10-12 04:54:49 +05:30 committed by Joren Broekema
parent dfb42593d2
commit 08a91291d9
3 changed files with 81 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
packages/localize/src/date/formatDate.js
View file

@ -13,22 +13,16 @@ export function formatDate(date, options) {
return '';
}
const formatOptions = options || {};
// make sure months and days are always 2-digits
if (!options) {
/**
* Set smart defaults if:
* 1) no options object is passed
* 2) options object is passed, but none of the following props on it: day, month, year.
*/
if (!options || (options && !options.day && !options.month && !options.year)) {
formatOptions.year = 'numeric';
formatOptions.month = '2-digit';
formatOptions.day = '2-digit';
}
if (options && !(options && options.year)) {
formatOptions.year = 'numeric';
}
if (options && !(options && options.month)) {
formatOptions.month = '2-digit';
}
if (options && !(options && options.day)) {
formatOptions.day = '2-digit';
}
const computedLocale = getLocale(formatOptions && formatOptions.locale);
let formattedDate = '';
try {

45
packages/localize/stories/date.stories.js
View file

@ -61,6 +61,51 @@ storiesOf('Localize System|Date', module).add(
})}
</td>
</tr>
<tr>
<td>Date without year</td>
<td>
<code>
formatDate(new Date(), {weekday:'long',month:'long',day:'2-digit'})
</code>
</td>
<td>
${formatDate(new Date(), {
weekday: 'long',
month: 'long',
day: '2-digit',
})}
</td>
</tr>
<tr>
<td>Date without month</td>
<td>
<code>
formatDate(new Date(), {weekday:'long',year:'numeric',day:'2-digit'})
</code>
</td>
<td>
${formatDate(new Date(), {
weekday: 'long',
year: 'numeric',
day: '2-digit',
})}
</td>
</tr>
<tr>
<td>Date without day</td>
<td>
<code>
formatDate(new Date(), {weekday:'long',year:'numeric',month:'long'})
</code>
</td>
<td>
${formatDate(new Date(), {
weekday: 'long',
month: 'long',
year: 'numeric',
})}
</td>
</tr>
<tr>
<td>Locale</td>
<td><code>formatDate(new Date(){locale:'nl-NL'})</code></td>

30
packages/localize/test/date/formatDate.test.js
View file

@ -108,6 +108,36 @@ describe('formatDate', () => {
expect(formatDate(parsedDate, options)).to.equal('maandag 01 januari 1940');
});
it('handles options without year', async () => {
const options = {
weekday: 'long',
month: 'long',
day: '2-digit',
};
const parsedDate = parseDate('12.10.2019');
expect(formatDate(parsedDate, options)).to.equal('Saturday, 12 October');
});
it('handles options without month', async () => {
const options = {
weekday: 'long',
year: 'numeric',
day: '2-digit',
};
const parsedDate = parseDate('12.10.2019');
expect(formatDate(parsedDate, options)).to.equal('Saturday 12 2019');
});
it('handles options without day', async () => {
const options = {
weekday: 'long',
year: 'numeric',
month: 'long',
};
const parsedDate = parseDate('12.10.2019');
expect(formatDate(parsedDate, options)).to.equal('October 2019 Saturday');
});
it('returns empty string when input is not a Date object', async () => {
const date = '1-1-2016';
expect(formatDate(date)).to.equal('');