Не могу реализовать функцию, которая определяет, когда элемент виден в окне браузера

Нашел данную функцию в одном примере. У меня она не работает, не могу понять причины. Может кто-нибудь знает, в чем проблема? Буду признателен.

 function isElementInViewport(el) {
  const rect = el.getBoundingClientRect();
  return (
    rect.top >= 0 &&
    rect.left >= 0 &&
    rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && 
    rect.right <= (window.innerWidth || document.documentElement.clientWidth)
  );
}

function autoAnimation(){
        const buttom = document.querySelector(".pipe");
        if(isElementInViewport(buttom)){
            alert("get!");
        }
    }

Сам элемент ".pipe"

<div class="conection__block">
            <div class="pipe" type="button" onclick="startAnimation(this)" id="fitingOne">
                <div class="pipe__pointer"></div>
                <h3 class="pipe__title">приварка стальных фитингов: </h3>
                <p class="pipe__text">отводы; тройники; переходы; заглушки;</p>
            </div>
        </div>