12
Views
1
Comments
Uncaught TypeError: Cannot set properties of null (setting 'innerText') in timer code

Hello everyone, 

I am getting the error "Cannot set properties of null" in my JS timer code. 

This only happens on tablet view. It seems that the element is not available in the DOM when the script runs. 

Please find the attached screenshot of my JavaScript code for reference.

Does anyone know why this happens on tablets and how to fix it? Any suggestions or help would be great. 

Thank you!

2025-01-23 09-22-22
ABHIJITH G
Champion

Hi @Mohammad Iqbal Yusuf Sheikh ,

Seems this issue occurs because the widget is not yet available in the DOM on tablet view when the timer runs; to fix this, we first check whether the element exists before updating it, preventing the “Cannot set properties of null” error. 

function displayTimer() {

    const timerElement = document.getElementById($parameters.WidgetElementId);

    if (!timerElement) return; // Tablet-safe: element not yet rendered


    if (remainingTime > 0) {

        remainingTime--;

        const minutes = Math.floor(remainingTime / 60);

        const seconds = remainingTime % 60;

        timerElement.innerText = `${minutes}:${seconds.toString().padStart(2, '0')}`;

    }


    if (remainingTime === 59) {

        clearInterval(TimerInterval);

        timerElement.style.backgroundColor = '#6359ce';

    }


    if (remainingTime <= 600 && setColor === 0) {

        timerElement.style.backgroundColor = 'red';

        setColor = 1;

    }

}

TimerInterval = setInterval(displayTimer, 1000); 

You can try this to avoid the error message, but I still suggest you add some logic to delay the execution until the element exists.

Hope this helps
Abhijith G

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.