Skip to content

Commit 220c8b9

Browse files
keithamuskeithamus
authored
Merge pull request #237 from github/allow-opting-out-of-months-and-weekdays-on-datetime-format
2 parents 5d5e35a + c286cbd commit 220c8b9

File tree

2 files changed

+21
-3
lines changed

2 files changed

+21
-3
lines changed

‎src/relative-time-element.ts‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -218,7 +218,7 @@ export default class RelativeTimeElement extends HTMLElement implements Intl.Dat
218218
get weekday() {
219219
const weekday = this.getAttribute('weekday')
220220
if (weekday === 'long' || weekday === 'short' || weekday === 'narrow') return weekday
221-
if (this.format === 'datetime') return this.formatStyle
221+
if (this.format === 'datetime' && weekday !== '') return this.formatStyle
222222
}
223223

224224
set weekday(value: 'short' | 'long' | 'narrow' | undefined) {
@@ -236,8 +236,9 @@ export default class RelativeTimeElement extends HTMLElement implements Intl.Dat
236236

237237
get month() {
238238
const format = this.format
239-
const defaultFormatStyle = format === 'datetime' ? this.formatStyle : 'short'
240-
const month = this.getAttribute('month') ?? defaultFormatStyle
239+
let month = this.getAttribute('month')
240+
if (month === '') return
241+
month ??= format === 'datetime' ? this.formatStyle : 'short'
241242
if (month === 'numeric' || month === '2-digit' || month === 'short' || month === 'long' || month === 'narrow') {
242243
return month
243244
}

‎test/relative-time.js‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -763,6 +763,7 @@ suite('relative-time', function () {
763763
{datetime: '2022-10-24T14:46:00.000Z', format: 'relative', precision: 'hour', expected: 'now'},
764764
{datetime: '2022-10-24T14:46:00.000Z', format: 'relative', threshold: 'PT0S', expected: 'on Oct 24'},
765765
{datetime: '2022-10-24T14:46:00.000Z', format: 'datetime', expected: 'Mon, Oct 24'},
766+
{datetime: '2022-10-24T14:46:00.000Z', format: 'datetime', weekday: '', month: '', expected: '24'},
766767
{datetime: '2022-10-24T14:46:00.000Z', format: 'duration', expected: '0 seconds'},
767768
{datetime: '2022-10-24T14:46:00.000Z', format: 'duration', precision: 'minute', expected: '0 minutes'},
768769
{datetime: '2022-10-24T14:46:00.000Z', format: 'duration', precision: 'day', expected: '0 days'},
@@ -774,6 +775,7 @@ suite('relative-time', function () {
774775
{datetime: '2022-10-24T14:46:08.000Z', format: 'relative', precision: 'hour', expected: 'now'},
775776
{datetime: '2022-10-24T14:46:08.000Z', format: 'relative', threshold: 'PT0S', expected: 'on Oct 24'},
776777
{datetime: '2022-10-24T14:46:08.000Z', format: 'datetime', expected: 'Mon, Oct 24'},
778+
{datetime: '2022-10-24T14:46:00.000Z', format: 'datetime', weekday: '', month: '', expected: '24'},
777779
{datetime: '2022-10-24T14:46:08.000Z', format: 'duration', expected: '8 seconds'},
778780
{datetime: '2022-10-24T14:46:08.000Z', format: 'duration', precision: 'minute', expected: '0 minutes'},
779781
{datetime: '2022-10-24T14:46:08.000Z', format: 'duration', precision: 'day', expected: '0 days'},
@@ -787,6 +789,7 @@ suite('relative-time', function () {
787789
{datetime: '2022-10-24T14:46:50.000Z', format: 'relative', precision: 'hour', expected: 'now'},
788790
{datetime: '2022-10-24T14:46:50.000Z', format: 'relative', threshold: 'PT0S', expected: 'on Oct 24'},
789791
{datetime: '2022-10-24T14:46:50.000Z', format: 'datetime', expected: 'Mon, Oct 24'},
792+
{datetime: '2022-10-24T14:46:50.000Z', format: 'datetime', weekday: '', month: '', expected: '24'},
790793
{datetime: '2022-10-24T14:46:50.000Z', format: 'duration', expected: '50 seconds'},
791794
{datetime: '2022-10-24T14:46:50.000Z', format: 'duration', precision: 'minute', expected: '0 minutes'},
792795
{datetime: '2022-10-24T14:46:50.000Z', format: 'duration', precision: 'day', expected: '0 days'},
@@ -800,6 +803,7 @@ suite('relative-time', function () {
800803
{datetime: '2022-10-24T14:47:30.000Z', format: 'relative', precision: 'hour', expected: 'now'},
801804
{datetime: '2022-10-24T14:47:30.000Z', format: 'relative', threshold: 'PT0S', expected: 'on Oct 24'},
802805
{datetime: '2022-10-24T14:47:30.000Z', format: 'datetime', expected: 'Mon, Oct 24'},
806+
{datetime: '2022-10-24T14:47:30.000Z', format: 'datetime', weekday: '', month: '', expected: '24'},
803807
{datetime: '2022-10-24T14:47:30.000Z', format: 'duration', expected: '1 minute, 30 seconds'},
804808
{datetime: '2022-10-24T14:47:30.000Z', format: 'duration', precision: 'minute', expected: '1 minute'},
805809
{datetime: '2022-10-24T14:47:30.000Z', format: 'duration', precision: 'day', expected: '0 days'},
@@ -813,6 +817,7 @@ suite('relative-time', function () {
813817
{datetime: '2022-11-13T15:46:00.000Z', format: 'relative', precision: 'hour', expected: 'in 3 weeks'},
814818
{datetime: '2022-11-13T15:46:00.000Z', format: 'relative', threshold: 'PT0S', expected: 'on Nov 13'},
815819
{datetime: '2022-11-13T15:46:00.000Z', format: 'datetime', expected: 'Sun, Nov 13'},
820+
{datetime: '2022-11-13T15:46:00.000Z', format: 'datetime', weekday: '', month: '', expected: '13'},
816821
{datetime: '2022-11-13T15:46:00.000Z', format: 'duration', expected: '20 days, 1 hour'},
817822
{datetime: '2022-11-13T15:46:00.000Z', format: 'duration', precision: 'minute', expected: '20 days, 1 hour'},
818823
{datetime: '2022-11-13T15:46:00.000Z', format: 'duration', precision: 'day', expected: '20 days'},
@@ -826,6 +831,7 @@ suite('relative-time', function () {
826831
{datetime: '2022-12-03T15:46:00.000Z', format: 'relative', precision: 'hour', expected: 'on Dec 3'},
827832
{datetime: '2022-12-03T15:46:00.000Z', format: 'relative', threshold: 'PT0S', expected: 'on Dec 3'},
828833
{datetime: '2022-12-03T15:46:00.000Z', format: 'datetime', expected: 'Sat, Dec 3'},
834+
{datetime: '2022-12-03T15:46:00.000Z', format: 'datetime', weekday: '', month: '', expected: '3'},
829835
{datetime: '2022-12-03T15:46:00.000Z', format: 'duration', expected: '1 month, 10 days, 1 hour'},
830836
{
831837
datetime: '2022-12-03T15:46:00.000Z',
@@ -844,6 +850,7 @@ suite('relative-time', function () {
844850
{datetime: '2024-10-24T14:46:00.000Z', format: 'relative', precision: 'hour', expected: 'on Oct 24, 2024'},
845851
{datetime: '2024-10-24T14:46:00.000Z', format: 'relative', threshold: 'PT0S', expected: 'on Oct 24, 2024'},
846852
{datetime: '2024-10-24T14:46:00.000Z', format: 'datetime', expected: 'Thu, Oct 24, 2024'},
853+
{datetime: '2024-10-24T14:46:00.000Z', format: 'datetime', weekday: '', month: '', expected: '2024 (day: 24)'},
847854
{datetime: '2024-10-24T14:46:00.000Z', format: 'duration', expected: '2 years, 11 days'},
848855
{datetime: '2024-10-24T14:46:00.000Z', format: 'duration', precision: 'minute', expected: '2 years, 11 days'},
849856
{datetime: '2024-10-24T14:46:00.000Z', format: 'duration', precision: 'day', expected: '2 years, 11 days'},
@@ -857,6 +864,7 @@ suite('relative-time', function () {
857864
{datetime: '2022-10-24T14:45:52.000Z', format: 'relative', precision: 'hour', expected: 'now'},
858865
{datetime: '2022-10-24T14:45:52.000Z', format: 'relative', threshold: 'PT0S', expected: 'on Oct 24'},
859866
{datetime: '2022-10-24T14:45:52.000Z', format: 'datetime', expected: 'Mon, Oct 24'},
867+
{datetime: '2022-10-24T14:45:52.000Z', format: 'datetime', weekday: '', month: '', expected: '24'},
860868
{datetime: '2022-10-24T14:45:52.000Z', format: 'duration', expected: '8 seconds'},
861869
{datetime: '2022-10-24T14:45:52.000Z', format: 'duration', precision: 'minute', expected: '0 minutes'},
862870
{datetime: '2022-10-24T14:45:52.000Z', format: 'duration', precision: 'day', expected: '0 days'},
@@ -870,6 +878,7 @@ suite('relative-time', function () {
870878
{datetime: '2022-10-24T14:45:10.000Z', format: 'relative', precision: 'hour', expected: 'now'},
871879
{datetime: '2022-10-24T14:45:10.000Z', format: 'relative', threshold: 'PT0S', expected: 'on Oct 24'},
872880
{datetime: '2022-10-24T14:45:10.000Z', format: 'datetime', expected: 'Mon, Oct 24'},
881+
{datetime: '2022-10-24T14:45:10.000Z', format: 'datetime', weekday: '', month: '', expected: '24'},
873882
{datetime: '2022-10-24T14:45:10.000Z', format: 'duration', expected: '50 seconds'},
874883
{datetime: '2022-10-24T14:45:10.000Z', format: 'duration', precision: 'minute', expected: '0 minutes'},
875884
{datetime: '2022-10-24T14:45:10.000Z', format: 'duration', precision: 'day', expected: '0 days'},
@@ -883,6 +892,7 @@ suite('relative-time', function () {
883892
{datetime: '2022-10-24T14:44:30.000Z', format: 'relative', precision: 'hour', expected: 'now'},
884893
{datetime: '2022-10-24T14:44:30.000Z', format: 'relative', threshold: 'PT0S', expected: 'on Oct 24'},
885894
{datetime: '2022-10-24T14:44:30.000Z', format: 'datetime', expected: 'Mon, Oct 24'},
895+
{datetime: '2022-10-24T14:44:30.000Z', format: 'datetime', weekday: '', month: '', expected: '24'},
886896
{datetime: '2022-10-24T14:44:30.000Z', format: 'duration', expected: '1 minute, 30 seconds'},
887897
{datetime: '2022-10-24T14:44:30.000Z', format: 'duration', precision: 'minute', expected: '1 minute'},
888898
{datetime: '2022-10-24T14:44:30.000Z', format: 'duration', precision: 'day', expected: '0 days'},
@@ -896,6 +906,7 @@ suite('relative-time', function () {
896906
{datetime: '2022-10-04T14:46:00.000Z', format: 'relative', precision: 'hour', expected: '3 weeks ago'},
897907
{datetime: '2022-10-04T14:46:00.000Z', format: 'relative', threshold: 'PT0S', expected: 'on Oct 4'},
898908
{datetime: '2022-10-04T14:46:00.000Z', format: 'datetime', expected: 'Tue, Oct 4'},
909+
{datetime: '2022-10-04T14:46:00.000Z', format: 'datetime', weekday: '', month: '', expected: '4'},
899910
{datetime: '2022-10-04T14:46:00.000Z', format: 'duration', expected: '20 days'},
900911
{datetime: '2022-10-04T14:46:00.000Z', format: 'duration', precision: 'minute', expected: '20 days'},
901912
{datetime: '2022-10-04T14:46:00.000Z', format: 'duration', precision: 'day', expected: '20 days'},
@@ -909,6 +920,7 @@ suite('relative-time', function () {
909920
{datetime: '2022-09-14T14:46:00.000Z', format: 'relative', precision: 'hour', expected: 'on Sep 14'},
910921
{datetime: '2022-09-14T14:46:00.000Z', format: 'relative', threshold: 'PT0S', expected: 'on Sep 14'},
911922
{datetime: '2022-09-14T14:46:00.000Z', format: 'datetime', expected: 'Wed, Sep 14'},
923+
{datetime: '2022-09-14T14:46:00.000Z', format: 'datetime', weekday: '', month: '', expected: '14'},
912924
{datetime: '2022-09-14T14:46:00.000Z', format: 'duration', expected: '1 month, 10 days'},
913925
{datetime: '2022-09-14T14:46:00.000Z', format: 'duration', precision: 'minute', expected: '1 month, 10 days'},
914926
{datetime: '2022-09-14T14:46:00.000Z', format: 'duration', precision: 'day', expected: '1 month, 10 days'},
@@ -922,6 +934,7 @@ suite('relative-time', function () {
922934
{datetime: '2020-10-24T14:46:00.000Z', format: 'relative', precision: 'hour', expected: 'on Oct 24, 2020'},
923935
{datetime: '2020-10-24T14:46:00.000Z', format: 'relative', threshold: 'PT0S', expected: 'on Oct 24, 2020'},
924936
{datetime: '2020-10-24T14:46:00.000Z', format: 'datetime', expected: 'Sat, Oct 24, 2020'},
937+
{datetime: '2020-10-24T14:46:00.000Z', format: 'datetime', weekday: '', month: '', expected: '2020 (day: 24)'},
925938
{datetime: '2020-10-24T14:46:00.000Z', format: 'duration', expected: '2 years, 10 days'},
926939
{datetime: '2020-10-24T14:46:00.000Z', format: 'duration', precision: 'minute', expected: '2 years, 10 days'},
927940
{datetime: '2020-10-24T14:46:00.000Z', format: 'duration', precision: 'day', expected: '2 years, 10 days'},
@@ -937,6 +950,8 @@ suite('relative-time', function () {
937950
formatStyle,
938951
threshold,
939952
precision = '',
953+
weekday,
954+
month,
940955
lang = 'en',
941956
reference = referenceDate,
942957
} of tests) {
@@ -951,6 +966,8 @@ suite('relative-time', function () {
951966
if (format) time.setAttribute('format', format)
952967
if (threshold) time.setAttribute('threshold', threshold)
953968
if (precision) time.setAttribute('precision', precision)
969+
if (weekday != null) time.setAttribute('weekday', weekday)
970+
if (month != null) time.setAttribute('month', month)
954971
if (lang) time.setAttribute('lang', lang)
955972
if (formatStyle) time.formatStyle = formatStyle
956973
await Promise.resolve()

0 commit comments

Comments
 (0)