import React from 'react'
import { render } from '@testing-library/react'
import LiveBlogIndicator from './LiveBlogIndicator'

describe('LiveBlogIndicator component', () => {
  // times are set to absolute in the datetime attribute of the time element, but relative (e.g. 1 month ago) in the text body
  // therefore we have to set a specific time for 'now', otherwise snapshots will be out of date instantly
  beforeAll(() => {
    jest.useFakeTimers()
    const fakeSystemTime = new Date('2024-11-15T10:48:03.442Z')
    jest.setSystemTime(fakeSystemTime)
  })
  afterAll(() => {
    jest.useRealTimers()
  })

  it('shows a live label and the last updated time when the live blog is active', () => {
    const tenMinutesAgo = new Date(Date.now() - 1000 * 60 * 10)
    const { container } = render(
      <LiveBlogIndicator
        realtime={true}
        lastUpdatedDateTime={tenMinutesAgo.toISOString()}
      />
    )
    expect(container).toMatchSnapshot()
  })

  it('does not show a label but does show the last updated time when the live blog is no longer active', () => {
    const tenDaysAgo = new Date(Date.now() - 1000 * 60 * 60 * 24 * 10)
    const { container } = render(
      <LiveBlogIndicator
        realtime={false}
        lastUpdatedDateTime={tenDaysAgo.toISOString()}
      />
    )
    expect(container).toMatchSnapshot()
  })
})