Using react-player API causing Failed to execute 'postMessage' on 'DOMWindow' error in the console?

I have installed react-player as recommended by a user here it solved my initial problem but now I have this error in the console on chrome Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('<URL>') does not match the recipient window's origin ('<URL>'). I don't know what to do about it? My code is as follows(only snippets of my full code):

import React, { useRef, useState, useEffect } from 'react';
import ReactPlayer from 'react-player/youtube'

function Webapps() {

const autoplayChange = () => {
        console.log('playing!')
    }
return(
<div className='iframeContainer'><ReactPlayer url={Projects.videoAddress} muted={true} controls={false} onPlay={autoplayChange} onPause={autoplayChange} onEnded={autoplayChange}/></div>
)

}

This error means that you are using a URL that does not match your website's origin / address.

This is called cross origin resource sharing and it is a warning in case a website does not permit you to display their content on a different website. Fortunately, youtube does allow you to use their videos. On my end, it looks like the warning is due to their ad-embedded content. The content should otherwise work.

A CodeSandbox example here.