import React from "react";
import { injectIntl } from 'react-intl';
import '@testing-library/jest-dom';
import {
  render,
  /* eslint-disable import/named */
  screen,
  fireEvent,
  /* eslint-enable import/named */
} from '../../../../../utils/test-utils';
import { waitFor } from "@testing-library/react";
import { LineVideo } from "../index";

const initializeComponent = () => {
  const Component = injectIntl(LineVideo);
  return render( <Component
    className=""
    id="test"
    isFullMode
  // supportedExtensions,
    actions={{}}
    Line
    index={0}
    updateMessageState={() => {}}
    content={{
      isError: true,
      videoSrc: "https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/1f141236-6796-479c-9c77-59dc850d.mp4",
      previewImageUrl: "https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/video_screenshot_assets__1653927664911.png/1040",
      videoName: "Decision Split - Filters UI Integration.mp4",
      messageTitle: "",
      altText: "",
      type: "video",
      actionLabel: "",
      actionUrl: "",
      videoHeight: 900,
      videoWidth: 1440,
      videoDuration: "00.36.04",
      selectedAction: "Hide",
      messageType: "videoSrc",
    }}
    activeKey={"video"}
    Templates={[]}
    getAllTemplates={() => {}}
    uploadedAssetList={() => {}}
    updateUploadedAssetList={() => {}}
    deleteUploadedImgList={() => {}}
    capUploaderCustomVideoRequest={() => {}}
  />);
};

describe('renders a message', () => {
  it("Test if LineVideo component renders", async () => {
    initializeComponent();
    const lineVideo = await screen.findByTestId('line-video');
    Object.defineProperty(lineVideo, 'duration', {
      writable: true,
      value: 10,
    });
    fireEvent.loadedMetadata(lineVideo);
  });
});

