dotlottie not loading everytime

[brian-open]

Hi,

We are using dotlottie through on the following site.

https://www.leprechaunmuseum.ie/story/

We have 8 animations in place on the page. 4 animations are in the top area and 4 animations are revealed in modal windows. In the first scene if you click the tree you will see the dotlottie animations.

The issue that we are having is that the dotlottie animations are not running every time you visit the page. It is frustratingly very inconsistent.

Strangely enough the dotlottie files that are in the modal windows load every time but the animations in the main scenes are loading inconsistently.

The dotlottie files are in my webpack build (example below).

Is there something that I am doing wrong that is stopping the animations from loading every time?

import '@dotlottie/player-component';

document.addEventListener("DOMContentLoaded", () => {

const playerSilo4 = document.getElementById('lottieStoneBelow');
playerSilo4.load('/wp-content/themes/NLM-theme/src/js/dotlottie/stone-below-v2.lottie');

const playerScene1 = document.getElementById('lottieRag');
playerScene1.load('/wp-content/themes/NLM-theme/src/js/dotlottie/new-rag-tree-v2.lottie');

const playerSilo1 = document.getElementById('lottiePotGold');
playerSilo1.load('/wp-content/themes/NLM-theme/src/js/dotlottie/new-pot-v2.lottie');

const playerScene2 = document.getElementById('lottieFairyFort');
playerScene2.load('/wp-content/themes/NLM-theme/src/js/dotlottie/new-fariy-fort-v2.lottie');

const playerSilo2 = document.getElementById('lottieFairyFortBelow');
playerSilo2.load('/wp-content/themes/NLM-theme/src/js/dotlottie/fairy-fort-below-no-gradient.lottie');

const playerScene3 = document.getElementById('lottieWellAbove');
playerScene3.load('/wp-content/themes/NLM-theme/src/js/dotlottie/new-well-above-v2.lottie');

const playerSilo3 = document.getElementById('lottieWellBelow');
playerSilo3.load('/wp-content/themes/NLM-theme/src/js/dotlottie/new-well-below-v2.lottie');

const playerScene4 = document.getElementById('lottieStoneAbove');
playerScene4.load('/wp-content/themes/NLM-theme/src/js/dotlottie/new-stone-above-v2.lottie');

});

[theashraf]

Hi @brian-open

Could you please tell me which version of the player-component you're using ?

[Divyanshu9822]

hi @theashraf

i'm facing the same issue in my web app made with svelte . Animations sometimes stays in stop state after the page is loaded and it doesn't starts until the page is manually refreshed again and i'm using the latest version. This is happening with my every lottie animation