Introduction

After creating a Date object, one of the most common tasks is displaying the date and time in a readable format. JavaScript provides several built-in methods that allow developers to format dates according to different requirements.

Date formatting is useful when displaying dates to users, generating reports, logging events, creating timestamps, or sending formatted dates to APIs.

For automation engineers, date formatting is frequently used when generating execution reports, creating screenshot names, validating displayed dates, logging API requests, and producing human-readable timestamps.

What is Date Formatting?

Date formatting is the process of converting a Date object into a readable string.

JavaScript provides multiple methods to display dates in different formats, such as:

Full date and time
Date only
Time only
Local date
Local time
ISO format
UTC format

Why Use Date Formatting?

Date formatting helps you:

Display dates in a user-friendly format
Format dates for reports
Create readable logs
Send standardized dates to APIs
Display dates according to the user’s locale
Improve application readability

Example 1: Display a Date Object

const today = new Date();

console.log(today);

Sample Output

Mon Jun 22 2026 16:45:18 GMT+0530 (India Standard Time)

Example 2: Format Using `toDateString()`

const today = new Date();

console.log(today.toDateString());

Sample Output

Mon Jun 22 2026

This method displays only the date.

Example 3: Format Using `toTimeString()`

const today = new Date();

console.log(today.toTimeString());

Sample Output

16:45:18 GMT+0530 (India Standard Time)

This method displays only the time.

Example 4: Format Using `toLocaleDateString()`

const today = new Date();

console.log(today.toLocaleDateString());

Sample Output

22/6/2026

The exact format depends on the user’s locale and browser settings.

Example 5: Format Using `toLocaleTimeString()`

const today = new Date();

console.log(today.toLocaleTimeString());

Sample Output

4:45:18 PM

Example 6: Format Using `toLocaleString()`

const today = new Date();

console.log(today.toLocaleString());

Sample Output

22/6/2026, 4:45:18 PM

This method displays both the date and time.

Example 7: Format Using `toISOString()`

const today = new Date();

console.log(today.toISOString());

Sample Output

2026-06-22T11:15:18.456Z

This format is commonly used in APIs and databases.

Example 8: Format Using `toUTCString()`

const today = new Date();

console.log(today.toUTCString());

Sample Output

Mon, 22 Jun 2026 11:15:18 GMT

Common Date Formatting Methods

Method	Description
`toDateString()`	Displays only the date
`toTimeString()`	Displays only the time
`toLocaleDateString()`	Displays the local date
`toLocaleTimeString()`	Displays the local time
`toLocaleString()`	Displays the local date and time
`toISOString()`	Displays the ISO 8601 format
`toUTCString()`	Displays the UTC date and time
`toJSON()`	Returns the date in JSON format (ISO string)

Real-World Example

Display a user-friendly date.

const today = new Date();

console.log("Today's Date:", today.toDateString());

Sample Output

Today's Date: Mon Jun 22 2026

Another example:

Display a formatted local date and time.

const today = new Date();

console.log(today.toLocaleString());

Sample Output

22/6/2026, 4:45:18 PM

Automation Testing Example

Date formatting is widely used in automation testing.

Playwright Example

Generate a formatted screenshot name.

const fileName = "Screenshot_" + Date.now() + ".png";

console.log(fileName);

Sample Output

Screenshot_1782119718456.png

Selenium Example

Display the execution date.

const executionDate = new Date();

console.log(executionDate.toDateString());

Sample Output

Mon Jun 22 2026

Cypress Example

Log the current execution time.

const executionTime = new Date();

console.log(executionTime.toLocaleTimeString());

Sample Output

4:45:18 PM

API Testing Example

Send an ISO timestamp.

const timestamp = new Date().toISOString();

console.log(timestamp);

Sample Output

2026-06-22T11:15:18.456Z

Data-Driven Testing Example

Create a report filename.

const report = "Report_" + new Date().toDateString();

console.log(report);

Sample Output

Report_Mon Jun 22 2026

Common Mistakes

Using `toISOString()` for Local Display

toISOString() always returns the date and time in UTC, not the local time zone.

Use toLocaleString() when displaying dates to users.

Assuming All Users See the Same Format

Methods like toLocaleDateString() and toLocaleTimeString() depend on the user’s locale and browser settings.

Confusing Local Time with UTC

console.log(new Date().toLocaleString());

console.log(new Date().toUTCString());

These methods produce different outputs because one uses the local time zone and the other uses UTC.

Best Practices

Use toLocaleDateString() for displaying dates to users.
Use toLocaleTimeString() for displaying times.
Use toLocaleString() for combined date and time.
Use toISOString() for APIs, databases, and logs.
Use toUTCString() when working with UTC-based systems.
Consider user locale when displaying formatted dates.
Avoid hardcoding date formats whenever possible.

Conclusion

JavaScript provides several built-in methods for formatting dates and times. These methods allow developers to display dates in user-friendly, locale-specific, or standardized formats depending on the application’s requirements.

For automation engineers, proper date formatting is essential for generating reports, logging execution details, validating application data, naming files, and interacting with APIs.

Mastering date formatting ensures that your applications display and process dates accurately and consistently.

Frequently Asked Questions (FAQs)