From 08a91291d9cfd2e9cb93b172ed29472fc6f0124d Mon Sep 17 00:00:00 2001 From: r4zorgeek Date: Sat, 12 Oct 2019 04:54:49 +0530 Subject: [PATCH] fix(localize): unforce defaults when options are given 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. --- packages/localize/src/date/formatDate.js | 18 +++----- packages/localize/stories/date.stories.js | 45 +++++++++++++++++++ .../localize/test/date/formatDate.test.js | 30 +++++++++++++ 3 files changed, 81 insertions(+), 12 deletions(-) diff --git a/packages/localize/src/date/formatDate.js b/packages/localize/src/date/formatDate.js index d72599c84..a0239eeb8 100644 --- a/packages/localize/src/date/formatDate.js +++ b/packages/localize/src/date/formatDate.js @@ -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 { diff --git a/packages/localize/stories/date.stories.js b/packages/localize/stories/date.stories.js index d88ed9580..ee531d144 100644 --- a/packages/localize/stories/date.stories.js +++ b/packages/localize/stories/date.stories.js @@ -61,6 +61,51 @@ storiesOf('Localize System|Date', module).add( })} + + Date without year + + + formatDate(new Date(), {weekday:'long',month:'long',day:'2-digit'}) + + + + ${formatDate(new Date(), { + weekday: 'long', + month: 'long', + day: '2-digit', + })} + + + + Date without month + + + formatDate(new Date(), {weekday:'long',year:'numeric',day:'2-digit'}) + + + + ${formatDate(new Date(), { + weekday: 'long', + year: 'numeric', + day: '2-digit', + })} + + + + Date without day + + + formatDate(new Date(), {weekday:'long',year:'numeric',month:'long'}) + + + + ${formatDate(new Date(), { + weekday: 'long', + month: 'long', + year: 'numeric', + })} + + Locale formatDate(new Date(){locale:'nl-NL'}) diff --git a/packages/localize/test/date/formatDate.test.js b/packages/localize/test/date/formatDate.test.js index e0d68de1c..131a4e29e 100644 --- a/packages/localize/test/date/formatDate.test.js +++ b/packages/localize/test/date/formatDate.test.js @@ -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('');