How to Avoid Test Failures in CI Due to Timezone Mismatch React + Vitest

It’s common to encounter timezone mismatch issues where tests pass locally but fail in CI. This happens because CI environments often default to UTC, while your local setup might use a different timezone. To avoid this, you can explicitly set the timezone for your tests. This ensures consistent behaviour in tests while still allowing your utility to work as intended—using the user's local timezone when running in the actual application

Here’s a quick fix: explicitly set the timezone in your test setup file (setup.ts). This ensures consistent test behavior across environments while allowing the application to use the user's local timezone in production.

How to Fix It

In your setup.ts file, add the following line to set the timezone explicitly:

process.env.TZ = 'Asia/Kolkata';

For example, a complete setup.ts for Vitest might look like this:

import '@testing-library/jest-dom'; 
import { server } from './mocks/server';  
// Explicitly setting to Indian TimeZone
process.env.TZ = 'Asia/Kolkata';

Alternatively, you can also add this to the test file as well. For example formatTimestamp.test.ts

import { formatTimestamp } from '../../src/utils/format-timestamp';

process.env.TZ = 'Asia/Kolkata';

describe('formatTimestamp', () => {
  it('should format timestamp correctly', () => {
    const timestamp = 1718140371;
    const formattedDate = formatTimestamp(timestamp);

    expect(formattedDate).toBe('June 12, 2024 at 02:42 AM');
  });
});

Why This Works

• process.env.TZ: This sets the timezone for Node.js, ensuring all date and time functions in your tests use the specified timezone.

• Consistency Across Environments: By configuring this in setup.ts, you guarantee the same timezone in local and CI environments.

This simple tweak eliminates timezone-related test failures, ensuring smooth CI runs while preserving local timezone behavior in your app.

Don't Worry it won't affect the app's actual behaviour in production.

We can also set the timezone in CI explicitly but chose this solution:

• Setting the timezone in setup.ts avoids modifying CI configuration files, keeping things simple and portable across different environments.

• Defining the timezone in setup.ts, you ensure your tests run the same way both locally and in CI, preventing discrepancies due to timezone differences.