@adatechnology/conversations-ui 0.9.0 → 0.10.0

package/src/participant/participantAudioPlayerDom.test.tsx

@@ -0,0 +1,154 @@
+import { act, useState } from 'react'
+
+import type { ParticipantAttachment } from '@adatechnology/conversation-contracts'
+import { afterEach, describe, expect, it } from 'bun:test'
+
+import { wait } from '../domHarness.test-helper'
+import { ATTACHMENT_URL_RETRY_DELAY_MS } from './useStableAttachmentUrl'
+import { ParticipantAudioAttachment } from './ParticipantAudioAttachment'
+import { DEFAULT_PARTICIPANT_AUDIO_LABELS } from './participantAudioLabels'
+import { buildAttachment, setupPlayerDom } from './participantAudioPlayerDomKit.test-helper'
+import { DEFAULT_PARTICIPANT_CONVERSATIONS_LABELS } from './participantLabels'
+
+const kit = setupPlayerDom()
+const { mountAttachments, audioOf, toggleOf, find, tap } = kit
+
+const realSetTimeout = globalThis.setTimeout
+const SETTLE_MS = 20
+let heldRetries: Array<() => void> = []
+
+/** Holds the retry timers (1 s) instead of sleeping: the test fires them on demand, with no wall-clock margin. */
+function holdRetryTimers(): void {
+  heldRetries = []
+  const shim = ((handler: TimerHandler, delay?: number, ...args: unknown[]) => {
+    if (delay !== ATTACHMENT_URL_RETRY_DELAY_MS) return realSetTimeout(handler, delay, ...args)
+    heldRetries.push(() => (handler as () => void)())
+    return 0
+  }) as unknown as typeof setTimeout
+  globalThis.setTimeout = shim
+}
+
+async function fireHeldRetries(): Promise<void> {
+  const pending = heldRetries
+  heldRetries = []
+  for (const retry of pending) retry()
+  await wait(SETTLE_MS)
+}
+
+afterEach(() => {
+  globalThis.setTimeout = realSetTimeout
+})
+
+describe('source: resolved at mount by id, never downloaded before the tap', () => {
+  it('assigns the resolved src with preload="none" and resolves once', async () => {
+    await mountAttachments([buildAttachment('a')])
+    expect(audioOf().getAttribute('src')).toBe('https://files.test/a-1.webm')
+    expect(audioOf().getAttribute('preload')).toBe('none')
+    expect(audioOf().hasAttribute('controls')).toBe(false)
+    expect(kit.resolverCalls).toEqual(['a'])
+    expect(kit.media.playCalls).toHaveLength(0)
+  })
+
+  it('a list update with a new attachment object and a new URL does not resolve again nor change the src', async () => {
+    let setAttachment: (attachment: ParticipantAttachment) => void = () => undefined
+    function Harness() {
+      const [attachment, update] = useState(buildAttachment('a'))
+      setAttachment = update
+      return <ParticipantAudioAttachment attachment={attachment} resolveAttachmentUrl={(item) => kit.resolveAttachmentUrl(item)} labels={DEFAULT_PARTICIPANT_CONVERSATIONS_LABELS} />
+    }
+    kit.container = kit.harness.mount(<Harness />).container
+    await wait(0)
+    tap(toggleOf())
+    kit.media.stateOf(audioOf()).currentTime = 20
+    act(() => setAttachment(buildAttachment('a', 65_000)))
+    await wait(0)
+    expect(kit.resolverCalls).toEqual(['a'])
+    expect(audioOf().getAttribute('src')).toBe('https://files.test/a-1.webm')
+    expect(kit.media.stateOf(audioOf()).currentTime).toBe(20)
+    expect(kit.media.stateOf(audioOf()).paused).toBe(false)
+  })
+
+  it('shows the unavailable state when the URL cannot be resolved after the second attempt', async () => {
+    holdRetryTimers()
+    await mountAttachments([buildAttachment('a')], async () => {
+      throw new Error('nope')
+    })
+    await fireHeldRetries()
+    expect(kit.container.textContent).toContain(DEFAULT_PARTICIPANT_AUDIO_LABELS.audioUnavailable)
+    expect(audioOf().hasAttribute('src')).toBe(false)
+  })
+
+  it('a transient failure of the first resolution gets one new attempt before giving up', async () => {
+    {
+      holdRetryTimers()
+      let attempts = 0
+      await mountAttachments([buildAttachment('a')], async () => {
+        attempts += 1
+        if (attempts === 1) throw new Error('offline for a moment')
+        return 'https://files.test/a-retry.webm'
+      })
+      expect(audioOf().hasAttribute('src')).toBe(false)
+      expect(kit.container.querySelector('.cv-p-audio__error')).toBeNull()
+      await fireHeldRetries()
+      expect(attempts).toBe(2)
+      expect(audioOf().getAttribute('src')).toBe('https://files.test/a-retry.webm')
+      expect(kit.container.querySelector('.cv-p-audio__error')).toBeNull()
+    }
+  })
+
+  it('says it with static text: no alert role (N failing players would be N assertive announcements) and a disabled toggle', async () => {
+    holdRetryTimers()
+    await mountAttachments([buildAttachment('a'), buildAttachment('b')], async () => {
+      throw new Error('nope')
+    })
+    await fireHeldRetries()
+    const messages = kit.container.querySelectorAll('.cv-p-audio__error')
+    expect(messages).toHaveLength(2)
+    for (const message of Array.from(messages)) expect(message.hasAttribute('role')).toBe(false)
+    expect(kit.container.querySelector('[role="alert"]')).toBeNull()
+    expect(toggleOf().disabled).toBe(true)
+  })
+
+  it('puts the file name after the player', async () => {
+    await mountAttachments([buildAttachment('a')])
+    const wrapper = find('.cv-p-attachment--audio')
+    expect(wrapper.firstElementChild?.className).toBe('cv-p-audio')
+    expect(wrapper.lastElementChild?.className).toBe('cv-p-attachment__name')
+    expect(kit.container.querySelector('.cv-p-attachment__audio')).toBeNull()
+  })
+})
+
+describe('play and pause', () => {
+  it('calls play() synchronously in the tap (a play after an await loses the iOS gesture)', async () => {
+    await mountAttachments([buildAttachment('a')])
+    tap(toggleOf())
+    expect(kit.media.playCalls).toHaveLength(1)
+    expect(kit.media.playCalls[0] === audioOf()).toBe(true)
+    expect(toggleOf().getAttribute('aria-label')).toBe('Pause audio')
+    tap(toggleOf())
+    expect(toggleOf().getAttribute('aria-label')).toBe('Play audio')
+  })
+
+  it('stays on "Play audio" when the browser refuses play()', async () => {
+    await mountAttachments([buildAttachment('a')])
+    kit.media.playOutcome = 'reject'
+    tap(toggleOf())
+    await wait(0)
+    expect(toggleOf().getAttribute('aria-label')).toBe('Play audio')
+  })
+
+  it('playing one audio pauses the other', async () => {
+    await mountAttachments([buildAttachment('a'), buildAttachment('b')])
+    tap(toggleOf(0))
+    tap(toggleOf(1))
+    expect(kit.media.pauseCalls).toHaveLength(1)
+    expect(kit.media.pauseCalls[0] === audioOf(0)).toBe(true)
+    expect(toggleOf(0).getAttribute('aria-label')).toBe('Play audio')
+    expect(toggleOf(1).getAttribute('aria-label')).toBe('Pause audio')
+  })
+
+  it('the toggle is at least the touch size and a plain button', async () => {
+    await mountAttachments([buildAttachment('a')])
+    expect(toggleOf().getAttribute('type')).toBe('button')
+  })
+})

package/src/participant/participantAudioPlayerDomKit.test-helper.tsx

@@ -0,0 +1,84 @@
+import { act } from 'react'
+
+import type { ParticipantAttachment } from '@adatechnology/conversation-contracts'
+import { afterAll, afterEach, beforeAll, beforeEach } from 'bun:test'
+
+import { setupDom, wait, type DomHarness } from '../domHarness.test-helper'
+import { ParticipantAudioAttachment } from './ParticipantAudioAttachment'
+import { DEFAULT_PARTICIPANT_CONVERSATIONS_LABELS } from './participantLabels'
+import { installFakeMedia, type FakeMediaControls } from './participantMediaFakes.test-helper'
+
+export type PlayerDomKit = {
+  harness: DomHarness
+  media: FakeMediaControls
+  container: HTMLElement
+  resolverCalls: string[]
+  urlSequence: string[]
+  resolveAttachmentUrl: (attachment: ParticipantAttachment) => Promise<string>
+  mountAttachments: (attachments: ParticipantAttachment[], resolver?: PlayerDomKit['resolveAttachmentUrl']) => Promise<void>
+  audioOf: (index?: number) => HTMLAudioElement
+  toggleOf: (index?: number) => HTMLButtonElement
+  find: <TElement extends Element>(selector: string) => TElement
+  tap: (element: Element) => void
+}
+
+export function buildAttachment(id: string, durationMs?: number): ParticipantAttachment {
+  return { id, kind: 'audio', filename: `${id}.webm`, mimeType: 'audio/webm', sizeBytes: 2048, ...(durationMs === undefined ? {} : { durationMs }) } as ParticipantAttachment
+}
+
+export function setupPlayerDom(): PlayerDomKit {
+  const kit: PlayerDomKit = {
+    resolveAttachmentUrl: async (attachment) => {
+      kit.resolverCalls.push(attachment.id)
+      const url = kit.urlSequence[kit.resolverCalls.filter((id) => id === attachment.id).length - 1]
+      if (!url) throw new Error('unavailable')
+      return attachment.id === 'b' ? 'https://files.test/b-1.webm' : url
+    },
+    mountAttachments: async (attachments, resolver = kit.resolveAttachmentUrl) => {
+      kit.container = kit.harness.mount(
+        <>
+          {attachments.map((attachment) => (
+            <ParticipantAudioAttachment key={attachment.id} attachment={attachment} resolveAttachmentUrl={resolver} labels={DEFAULT_PARTICIPANT_CONVERSATIONS_LABELS} />
+          ))}
+        </>,
+      ).container
+      await wait(0)
+    },
+    audioOf: (index = 0) => {
+      const audio = kit.container.querySelectorAll<HTMLAudioElement>('audio')[index]
+      if (!audio) throw new Error('missing audio')
+      return audio
+    },
+    toggleOf: (index = 0) => {
+      const toggle = kit.container.querySelectorAll<HTMLButtonElement>('.cv-p-audio__toggle')[index]
+      if (!toggle) throw new Error('missing toggle')
+      return toggle
+    },
+    find: <TElement extends Element>(selector: string): TElement => {
+      const element = kit.container.querySelector<TElement>(selector)
+      if (!element) throw new Error(`missing ${selector}`)
+      return element
+    },
+    tap: (element) => {
+      act(() => {
+        element.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+      })
+    },
+  } as PlayerDomKit
+
+  beforeAll(async () => {
+    kit.harness = await setupDom()
+  })
+
+  afterAll(() => kit.harness.teardown())
+
+  beforeEach(() => {
+    kit.media = installFakeMedia()
+    kit.resolverCalls = []
+    kit.urlSequence = ['https://files.test/a-1.webm', 'https://files.test/a-2.webm', 'https://files.test/a-3.webm']
+  })
+
+  afterEach(() => kit.media.restore())
+
+  return kit
+}

package/src/participant/participantAudioPlayerState.ts

@@ -0,0 +1,35 @@
+import type { MutableRefObject } from 'react'
+
+import type { AudioPlaybackHandle } from './participantAudioCoordinator'
+import { PLAYBACK_RATES } from './participantAudioFormat'
+
+export type PlayerState = {
+  readonly isPlaying: boolean
+  readonly position: number
+  readonly mediaDuration: number | undefined
+  readonly maxSeen: number
+  readonly rateIndex: number
+  readonly hasFailed: boolean
+}
+
+export const INITIAL_PLAYER_STATE: PlayerState = {
+  isPlaying: false,
+  position: 0,
+  mediaDuration: undefined,
+  maxSeen: 0,
+  rateIndex: 0,
+  hasFailed: false,
+}
+
+export type PlayerContext = {
+  readonly audioRef: MutableRefObject<HTMLAudioElement | null>
+  readonly handleRef: MutableRefObject<AudioPlaybackHandle>
+  readonly state: PlayerState
+  readonly update: (patch: Partial<PlayerState>) => void
+}
+
+export function applyPlaybackRate(audio: HTMLAudioElement, rateIndex: number): void {
+  const rate = PLAYBACK_RATES[rateIndex] ?? 1
+  audio.defaultPlaybackRate = rate
+  audio.playbackRate = rate
+}

package/src/participant/participantAudioRecorderDom.test.tsx

@@ -0,0 +1,127 @@
+import { act } from 'react'
+
+import { describe, expect, it } from 'bun:test'
+
+import { setupRecorderDom } from './participantRecorderDomKit.test-helper'
+
+const kit = setupRecorderDom()
+const { mountProbe, start, advance, recordFor, deferStream } = kit
+
+describe('the happy path', () => {
+  it('goes idle -> requesting -> recording -> review with a coherent File', async () => {
+    mountProbe()
+    expect(kit.api.status).toBe('idle')
+    deferStream()
+    await start()
+    expect(kit.api.status).toBe('requesting')
+    await act(async () => kit.resolveStream?.(kit.stream))
+    expect(kit.api.status).toBe('recording')
+    await advance(1500)
+    act(() => kit.api.stop())
+    expect(kit.api.status).toBe('review')
+    expect(kit.api.recorded?.file.type).toBe('audio/ogg')
+    expect(kit.api.recorded?.file.name).toMatch(/^audio-\d{8}-\d{6}\.ogg$/)
+    expect(kit.api.recorded?.file.size).toBe(4096)
+    expect(kit.api.recorded?.objectUrl).toBe('blob:fake-recording')
+    expect(kit.stream.track.stopCount).toBeGreaterThan(0)
+  })
+
+  it('falls back to m4a with the matching mime type', async () => {
+    kit.supportedTypes = ['audio/mp4']
+    mountProbe()
+    await recordFor(1000)
+    act(() => kit.api.stop())
+    expect(kit.api.recorded?.file.name).toMatch(/\.m4a$/)
+    expect(kit.api.recorded?.file.type).toBe('audio/mp4')
+  })
+
+  it('reports capture from requesting until it leaves review, and revokes the URL on every exit', async () => {
+    mountProbe()
+    await recordFor(1000)
+    act(() => kit.api.stop())
+    expect(kit.captureEvents).toEqual([true])
+    let file: File | undefined
+    act(() => {
+      file = kit.api.confirm()
+    })
+    expect(file?.size).toBe(4096)
+    expect(kit.api.status).toBe('idle')
+    expect(kit.revoked).toEqual(['blob:fake-recording'])
+    expect(kit.captureEvents).toEqual([true, false])
+  })
+
+  it('discard from review revokes the URL and returns to idle', async () => {
+    mountProbe()
+    await recordFor(1000)
+    act(() => kit.api.stop())
+    act(() => kit.api.discard())
+    expect(kit.api.status).toBe('idle')
+    expect(kit.revoked).toEqual(['blob:fake-recording'])
+  })
+
+  it('discard while recording stops the track and records nothing', async () => {
+    mountProbe()
+    await recordFor(1000)
+    act(() => kit.api.discard())
+    expect(kit.api.status).toBe('idle')
+    expect(kit.stream.track.stopCount).toBeGreaterThan(0)
+    expect(kit.api.recorded).toBeUndefined()
+  })
+})
+
+describe('failures', () => {
+  it('permission denied -> denied, and the next tap asks again', async () => {
+    kit.getUserMediaImpl = () => Promise.reject(Object.assign(new Error('x'), { name: 'NotAllowedError' }))
+    mountProbe()
+    await start()
+    expect(kit.api.status).toBe('denied')
+    kit.getUserMediaImpl = async () => kit.stream
+    await start()
+    expect(kit.api.status).toBe('recording')
+  })
+
+  it('no microphone device -> unsupported', async () => {
+    kit.getUserMediaImpl = () => Promise.reject(Object.assign(new Error('x'), { name: 'NotFoundError' }))
+    mountProbe()
+    await start()
+    expect(kit.api.status).toBe('unsupported')
+  })
+
+  it('no MediaRecorder at all -> unsupported without asking for the microphone', async () => {
+    delete (globalThis as Record<string, unknown>).MediaRecorder
+    let asked = false
+    kit.getUserMediaImpl = async () => {
+      asked = true
+      return kit.stream
+    }
+    mountProbe()
+    await start()
+    expect(kit.api.status).toBe('unsupported')
+    expect(asked).toBe(false)
+  })
+
+  it('a recording with no bytes -> empty, tracks released', async () => {
+    kit.chunkBytes = 0
+    mountProbe()
+    await recordFor(1000)
+    act(() => kit.api.stop())
+    expect(kit.api.status).toBe('empty')
+    expect(kit.stream.track.stopCount).toBeGreaterThan(0)
+    expect(kit.revoked).toEqual([])
+  })
+
+  it('stopping before the minimum duration -> empty', async () => {
+    mountProbe()
+    await recordFor(100)
+    act(() => kit.api.stop())
+    expect(kit.api.status).toBe('empty')
+  })
+
+  it('above the byte ceiling -> tooLarge, nothing kept', async () => {
+    mountProbe({ maxSizeBytes: 1000 })
+    await recordFor(1000)
+    act(() => kit.api.stop())
+    expect(kit.api.status).toBe('tooLarge')
+    expect(kit.api.recorded).toBeUndefined()
+  })
+})

package/src/participant/participantAudioRecorderInterruptionDom.test.tsx

@@ -0,0 +1,135 @@
+import { act } from 'react'
+
+import { describe, expect, it } from 'bun:test'
+
+import { setupRecorderDom } from './participantRecorderDomKit.test-helper'
+
+const kit = setupRecorderDom()
+const { mountProbe, start, advance, recordFor, deferStream, hidePage } = kit
+
+describe('the duration ceiling', () => {
+  it('stops by itself at the ceiling and lands in review', async () => {
+    mountProbe({ maxDurationMs: 2000 })
+    await recordFor(1000)
+    expect(kit.api.status).toBe('recording')
+    await advance(1100)
+    expect(kit.api.status).toBe('review')
+  })
+
+  it('shows the elapsed time while recording', async () => {
+    mountProbe()
+    await recordFor(3000)
+    expect(kit.api.elapsedMs).toBeGreaterThanOrEqual(2750)
+  })
+})
+
+describe('cancellation token of getUserMedia (contract 2.1)', () => {
+  it('unmount while requesting: a late stream gets every track stopped at once', async () => {
+    deferStream()
+    const tree = mountProbe()
+    await start()
+    tree.unmount()
+    await act(async () => kit.resolveStream?.(kit.stream))
+    expect(kit.stream.track.stopCount).toBe(1)
+  })
+
+  it('page hidden while requesting: back to idle and the late kit.stream is stopped', async () => {
+    deferStream()
+    mountProbe()
+    await start()
+    hidePage()
+    expect(kit.api.status).toBe('idle')
+    await act(async () => kit.resolveStream?.(kit.stream))
+    expect(kit.stream.track.stopCount).toBe(1)
+    expect(kit.api.status).toBe('idle')
+  })
+
+  it('pagehide while requesting also cancels', async () => {
+    deferStream()
+    mountProbe()
+    await start()
+    act(() => {
+      window.dispatchEvent(new Event('pagehide'))
+    })
+    await act(async () => kit.resolveStream?.(kit.stream))
+    expect(kit.stream.track.stopCount).toBe(1)
+    expect(kit.api.status).toBe('idle')
+  })
+})
+
+describe('interruptions (contract 2.1)', () => {
+  it('track.onended while recording stops and goes to review', async () => {
+    mountProbe()
+    await recordFor(1000)
+    act(() => kit.stream.track.onended?.())
+    expect(kit.api.status).toBe('review')
+  })
+
+  it('a mute shorter than 3 s does not interrupt', async () => {
+    mountProbe()
+    await recordFor(1000)
+    act(() => kit.stream.track.onmute?.())
+    await advance(2900)
+    act(() => kit.stream.track.onunmute?.())
+    await advance(5000)
+    expect(kit.api.status).toBe('recording')
+  })
+
+  it('a mute that persists past 3 s interrupts', async () => {
+    mountProbe()
+    await recordFor(1000)
+    act(() => kit.stream.track.onmute?.())
+    await advance(2900)
+    expect(kit.api.status).toBe('recording')
+    await advance(200)
+    expect(kit.api.status).toBe('review')
+  })
+
+  it('page hidden while recording stops and goes to review', async () => {
+    mountProbe()
+    await recordFor(1000)
+    hidePage()
+    expect(kit.api.status).toBe('review')
+  })
+
+  it('pagehide while recording stops and goes to review', async () => {
+    mountProbe()
+    await recordFor(1000)
+    act(() => {
+      window.dispatchEvent(new Event('pagehide'))
+    })
+    expect(kit.api.status).toBe('review')
+  })
+
+  it('page hidden in review pauses the player and KEEPS the recording', async () => {
+    mountProbe()
+    await recordFor(1000)
+    act(() => kit.api.stop())
+    let paused = 0
+    ;(kit.api.audioRef as { current: unknown }).current = { pause: () => (paused += 1) }
+    hidePage()
+    expect(paused).toBe(1)
+    expect(kit.api.status).toBe('review')
+    expect(kit.api.recorded?.file.size).toBe(4096)
+    expect(kit.revoked).toEqual([])
+  })
+})
+
+describe('unmount discards everything', () => {
+  it('while recording: tracks stopped, capture reported off', async () => {
+    const tree = mountProbe()
+    await recordFor(1000)
+    tree.unmount()
+    expect(kit.stream.track.stopCount).toBeGreaterThan(0)
+    expect(kit.captureEvents.at(-1)).toBe(false)
+  })
+
+  it('in review: the object URL is revoked', async () => {
+    const tree = mountProbe()
+    await recordFor(1000)
+    act(() => kit.api.stop())
+    tree.unmount()
+    expect(kit.revoked).toEqual(['blob:fake-recording'])
+    expect(kit.captureEvents.at(-1)).toBe(false)
+  })
+})

package/src/participant/participantAudioRecorderSpecDom.test.tsx

@@ -0,0 +1,110 @@
+import { act } from 'react'
+
+import { afterAll, afterEach, beforeAll, beforeEach, describe, expect, it, jest } from 'bun:test'
+
+import { setupDom, type DomHarness } from '../domHarness.test-helper'
+import { SpecMediaRecorder, SpecStream } from './participantSpecRecorderFake.test-helper'
+import { useParticipantAudioRecorder } from './useParticipantAudioRecorder'
+
+let harness: DomHarness
+let api: ReturnType<typeof useParticipantAudioRecorder>
+let stream: SpecStream
+
+let probeMaxDurationMs: number | undefined
+
+function Probe() {
+  api = useParticipantAudioRecorder(
+    probeMaxDurationMs === undefined ? {} : { options: { maxDurationMs: probeMaxDurationMs } },
+  )
+  return null
+}
+
+async function flush(): Promise<void> {
+  await act(async () => {
+    await Promise.resolve()
+    await Promise.resolve()
+  })
+}
+
+async function startAndRecord(): Promise<void> {
+  harness.mount(<Probe />)
+  await act(async () => {
+    void api.start()
+  })
+  await act(async () => {
+    jest.advanceTimersByTime(1000)
+  })
+}
+
+function hidePage(): void {
+  Object.defineProperty(document, 'visibilityState', { configurable: true, get: () => 'hidden' })
+  act(() => {
+    document.dispatchEvent(new Event('visibilitychange'))
+  })
+  Object.defineProperty(document, 'visibilityState', { configurable: true, get: () => 'visible' })
+}
+
+beforeAll(async () => {
+  harness = await setupDom()
+})
+
+afterAll(() => harness.teardown())
+
+beforeEach(() => {
+  probeMaxDurationMs = undefined
+  jest.useFakeTimers()
+  SpecMediaRecorder.instances = []
+  stream = new SpecStream()
+  ;(globalThis as Record<string, unknown>).MediaRecorder = SpecMediaRecorder
+  ;(navigator as unknown as Record<string, unknown>).mediaDevices = { getUserMedia: async () => stream }
+  URL.createObjectURL = () => 'blob:fake-recording'
+  URL.revokeObjectURL = () => {}
+})
+
+afterEach(() => {
+  jest.useRealTimers()
+  delete (globalThis as Record<string, unknown>).MediaRecorder
+})
+
+describe('a recorder that follows the MediaRecorder specification (stop is asynchronous)', () => {
+  it('stopping twice still ends in review with the audio', async () => {
+    await startAndRecord()
+    act(() => {
+      api.stop()
+      api.stop()
+    })
+    await flush()
+    expect(api.status).toBe('review')
+    expect(api.recorded?.file.size).toBe(4096)
+    expect(SpecMediaRecorder.instances[0]?.stopCalls).toBe(1)
+  })
+
+  it('track.onended after the recorder stopped by itself still ends in review', async () => {
+    await startAndRecord()
+    SpecMediaRecorder.instances[0]?.autoStop()
+    act(() => stream.track.onended?.())
+    await flush()
+    expect(api.status).toBe('review')
+    expect(api.recorded?.file.size).toBe(4096)
+  })
+
+  it('the page becoming hidden right after Stop still ends in review', async () => {
+    await startAndRecord()
+    act(() => api.stop())
+    hidePage()
+    await flush()
+    expect(api.status).toBe('review')
+    expect(api.recorded?.file.size).toBe(4096)
+  })
+
+  it('the duration ceiling coinciding with Stop still ends in review', async () => {
+    probeMaxDurationMs = 3000
+    await startAndRecord()
+    act(() => api.stop())
+    await act(async () => {
+      jest.advanceTimersByTime(4000)
+    })
+    await flush()
+    expect(api.status).toBe('review')
+  })
+})