How can i add a custom video in broadcast in opentok

I wanted to add video while broadcasting. To do this i am refering this link :

https://github.com/opentok/opentok-web-samples/tree/main/Publish-Video

After OT.initPublisher i am publishing this publisher in to session session.publish

But video is not showing in livestreaming.

Can anybody help me with this?

We can Publish custom audio source and video source from Video Element, using the captureStream() / mozCaptureStream() methods

Like mentioned in the below code snip

  const contentVideoElement = document.createElement('VIDEO');
  let screenPublisher = null;
  contentVideoElement.autoplay = true;
  contentVideoElement.controls = true;
  contentVideoElement.classList.add('cameraContainer');
  const url = URL.createObjectURL(file); // choose video file from input file control
  contentVideoElement.src = url;
  try {
    await contentVideoElement.play();
  } catch (error) {
      console.log(error);
    return;
  }
  let mediaStream = null;
  if (contentVideoElement.captureStream) {
    mediaStream = contentVideoElement.captureStream();
  } else if (contentVideoElement.mozCaptureStream) {
    mediaStream = contentVideoElement.mozCaptureStream();
  } else {
    console.error('Stream capture is not supported');
    mediaStream = null;
    return;
  }
  const videoTracks = mediaStream.getVideoTracks();
  const audioTracks = mediaStream.getAudioTracks();
  if (videoTracks.length > 0 && audioTracks.length > 0) {
    const el = document.createElement('div');
    screenPublisher = window.OT.initPublisher(
      'content-video-element-id',
      {
        insertMode: 'append',
        videoSource: videoTracks[0],
        audioSource: audioTracks[0],
        fitMode: 'contain', // Using default
        width: '100%',
        height: '100%',
        showControls: false,
        name:`Guest (Video)`,
      },
      (error) => {
        if (error) {
          contentVideoElement.pause();
          console.log(error);
        } else {
          contentVideoElement.play();
          openToksession.publish(screenPublisher, (error) => {
            if (error) {
              console.log(error);
            } else {
             // write here code after success publish video stream
            }
          });
        }
      },
    );
    screenPublisher.on({
      streamDestroyed: ({ stream }) => {
        contentVideoElement.pause();
      },
    });

    contentVideoElement.addEventListener(
      'ended',
      () => {
        console.log('Shared video ended');
      },
      false,
    );
  }

For capture MediaStream in reactjs: click here