What is the TypeScript definition for the onPlayCapture event in React?

The right interface for onPlayCapture is SyntheticEvent

Please continue reading below to see how to use it or read my guide on using React's events with TypeScript.

SyntheticEvent is the generic definition for events in React. All other event definitions extend this one.

In this case, there isn't a more specific definition available.


interface BaseSyntheticEvent<E = object, C = any, T = any> {
    nativeEvent: E;
    currentTarget: C;
    target: T;
    bubbles: boolean;
    cancelable: boolean;
    defaultPrevented: boolean;
    eventPhase: number;
    isTrusted: boolean;
    preventDefault(): void;
    isDefaultPrevented(): boolean;
    stopPropagation(): void;
    isPropagationStopped(): boolean;
    persist(): void;
    timeStamp: number;
    type: string;

interface SyntheticEvent<T = Element, E = Event> extends BaseSyntheticEvent<E, EventTarget & T, EventTarget> {}

Full example

import React, { SyntheticEvent } from 'react';

const App = () => {
  const handleEvent = (e: SyntheticEvent<HTMLDivElement>) => {
    // Do something

  return <div src="/img.png" onPlayCapture={handleEvent}>{/** Some code */}</div>;

export default App;

Attributes that use SyntheticEvent: