Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix toAbsoluteLocaleDate and add more tests #32387

Merged
merged 2 commits into from
Oct 30, 2024
Merged

Fix toAbsoluteLocaleDate and add more tests #32387

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3fad332
fix
wxiaoguang Oct 30, 2024
184c2a3
fix
wxiaoguang Oct 30, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 10 additions & 5 deletions web_src/js/webcomponents/absolute-date.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,14 @@ test('toAbsoluteLocaleDate', () => {
day: 'numeric',
})).toEqual('15. März 2024');

expect(toAbsoluteLocaleDate('12345-03-15 01:02:03', '', {
year: 'numeric',
month: 'short',
day: 'numeric',
})).toEqual('Mar 15, 12345');
// these cases shouldn't happen
expect(toAbsoluteLocaleDate('2024-03-15 01:02:03', '', {})).toEqual('Invalid Date');
expect(toAbsoluteLocaleDate('10000-01-01', '', {})).toEqual('Invalid Date');

// test different timezone
const oldTZ = process.env.TZ;
process.env.TZ = 'America/New_York';
expect(new Date('2024-03-15').toLocaleString()).toEqual('3/14/2024, 8:00:00 PM');
expect(toAbsoluteLocaleDate('2024-03-15')).toEqual('3/15/2024, 12:00:00 AM');
process.env.TZ = oldTZ;
});
19 changes: 10 additions & 9 deletions web_src/js/webcomponents/absolute-date.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,12 @@
export function toAbsoluteLocaleDate(date: string, lang: string, opts: Intl.DateTimeFormatOptions) {
return new Date(date).toLocaleString(lang || [], opts);
export function toAbsoluteLocaleDate(date: string, lang?: string, opts?: Intl.DateTimeFormatOptions) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The removals of the ? on second and third argument is incorrect. I will fix it in #32308.

Copy link
Member

@silverwind silverwind Oct 30, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Edit: nevermind, I see the PR corrected it actually. #32308 is updated.

// only use the date part, it is guaranteed to be in ISO format (YYYY-MM-DDTHH:mm:ss.sssZ) or (YYYY-MM-DD)
// if there is an "Invalid Date" error, there must be something wrong in code and should be fixed.
// TODO: there is a root problem in backend code: the date "YYYY-MM-DD" is passed to backend without timezone (eg: deadline),
// then backend parses it in server's timezone and stores the parsed timestamp into database.
// If the user's timezone is different from the server's, the date might be displayed in the wrong day.
const dateSep = date.indexOf('T');
date = dateSep === -1 ? date : date.substring(0, dateSep);
return new Date(`${date}T00:00:00`).toLocaleString(lang || [], opts);
}

window.customElements.define('absolute-date', class extends HTMLElement {
Expand All @@ -15,14 +22,8 @@ window.customElements.define('absolute-date', class extends HTMLElement {
const lang = this.closest('[lang]')?.getAttribute('lang') ||
this.ownerDocument.documentElement.getAttribute('lang') || '';

// only use the date part, it is guaranteed to be in ISO format (YYYY-MM-DDTHH:mm:ss.sssZ)
let date = this.getAttribute('date');
let dateSep = date.indexOf('T');
dateSep = dateSep === -1 ? date.indexOf(' ') : dateSep;
date = dateSep === -1 ? date : date.substring(0, dateSep);

if (!this.shadowRoot) this.attachShadow({mode: 'open'});
this.shadowRoot.textContent = toAbsoluteLocaleDate(date, lang, opt);
this.shadowRoot.textContent = toAbsoluteLocaleDate(this.getAttribute('date'), lang, opt);
};

attributeChangedCallback(_name, oldValue, newValue) {
Expand Down