videoclip is not displayed, but the audio is played

[22decembre]

I am sure I am doing something wrong there. I hope that you'd tell me/help me to solve that.

I am building a webpage where there are mp4 videoclips in mute loop mode, and when I click on them, I would then have your plugin acting, with controls and sounds.

The first part is working ! It's rather fun actually that it does.

The second part, with plugin acting, not so much. The plugin makes the whole screen dark, tries to frame something (grey rectangle) and I have sound. But no image displaying.

I got this message from the browser :

Uncaught (in promise) DOMException: The fetching process for the media resource was aborted by the user agent at the user's request.

(Obviously I did not request that fetching the media was aborted)

other issues :

Will-change memory consumption is too high. Budget limit is the document surface area multiplied by 3 (113378 px). Occurrences of will-change over the budget will be ignored.  
Error in parsing value for ‘width’.  Declaration dropped.

Last error is weird as I copied the dimensions directly from the file's properties.

Here is the html code specifically on that videoclip

<a class="gallery-item" href="/zoo/2024-09-02-12-36-26-921.mp4" data-pswp-width="1920"
        data-pswp-height="1080" title="2024-09-02-12-36-26-921.mp4" itemscope data-pswp-type="video" target="_blank">
            <figure >
                <video class="lazyload" width="1920" height="1080" autoplay="autoplay" loop="loop" preload="auto" muted >
                    <source src="/zoo/2024-09-02-12-36-26-921.mp4" type="video/mp4"></source>
                </video>
          <img class="lazyload" width="1920" height="1080" data-src="/a.jpg" alt="" />
          </figure>
        </a>
        
        <a class="gallery-item" href="/zoo/2024-09-02-12-37-13-314_hu6689980708219410152.jpg" data-pswp-src="/zoo/2024-09-02-12-37-13-314_hu6689980708219410152.jpg" data-pswp-width="1600" data-pswp-height="900" title="" itemscope itemtype="https://schema.org/ImageObject" style="aspect-ratio: 600 / 338">
          <figure style="background-color: #1a191a; aspect-ratio: 600 / 338">
            <img class="lazyload" width="600" height="338" data-src="/zoo/2024-09-02-12-37-13-314_hu6055288658923060589.jpg" alt="" />
          </figure>
        </a>

Thank you in advance.

[22decembre]

New symptom.

This time loading in chrome : autoplay is blocked. I believe this is the issue.

Chrome autoplay policy

But actually, I am interacting with the video (clicking on it), so the autoloading should work. But No.

Suggestion ?