innerHeight неправильно высчитывает высоту блока

Использую JQuery Хочу зафиксировать фильтр, когда доскролю до конца блока. При первой перезагрузке бывает показывает верную высоту, но при второй уже неверную.

В чем может быть проблема?

сам код

let sidebar = $("#sidebar");// сам блок
let filter = $("#filter"); // фильтр внутри блока
let sidebarH = sidebar.innerHeight();

$(document).on('scroll', function() {

    let scrollTop = $(this).scrollTop();

    if( scrollTop >= sidebarH) {
        $(".filter").css('position', 'absolute');
    } else {
        $(".filter").css('position', 'fixed');
    }
    console.log(sidebarH);
});

Если открыть страницу в браузере, то код работает верно. Но если работать на локальном сервере (browsersync) в Gulp, то код не работает как должен