Некорректная ширина, получаемая через element.offsetWidth / scrollWidth

Написал небольшой скрипт для горизонтальной прокрутки таблицы, который еще добавляет определенней класс, когда таблица полностью прокручена, но для того, чтобы он корректно работал, нужна фактическая ширина таблицы с учетом скролла (на ней стоит css свойство overflow-x: hidden;). Но браузер, по какой-то причине, передает размеры отличные от фактических. Причем, если долго перезагружать таблицу, то иногда передаются и корректные данные. Если через инспектор выбрать элемент, то ширина всегда корректная и неизменная. В чем может быть причина?

//Горизонтальная прокрутка таблицы
document.addEventListener('DOMContentLoaded', horizontalTableScrolling);
function horizontalTableScrolling (){
    const width = document.querySelector('.wires-table__shadow');
    const scrollWidth = document.querySelector('.table__main').scrollWidth;
    const buttons = document.querySelector('.wires-table__button-wrapper');
    addClasses()
    buttons.addEventListener('click', (e) => {
        if(e.target.attributes[1].value === 'right'){
            width.scrollLeft += 40
            addClasses()
        }else if(e.target.attributes[1].value === 'left'){
            width.scrollLeft -= 40
            addClasses()
        }
    })
    function addClasses() {
        console.log(scrollWidth, width.offsetWidth, width.scrollLeft);
        if(width.scrollLeft === 0){
            width.classList.add('wires-table__shadow_left');
            width.classList.remove('wires-table__shadow_center');
        }else if(scrollWidth - width.offsetWidth === width.scrollLeft){
            width.classList.remove('wires-table__shadow_center');
            width.classList.add('wires-table__shadow_right');
        }else{
            width.classList.add('wires-table__shadow_center');
            width.classList.remove('wires-table__shadow_right', 'wires-table__shadow_left');
        }
    }
    function scrollHorizontally(e) {
        e = window.event || e;
        let delta = Math.max(-1, Math.min(1, e.wheelDelta || -e.detail));
        document.querySelector('.wires-table__shadow').scrollLeft -= delta * 40;
        e.preventDefault();
        addClasses()
    }
    if (document.querySelector('.wires-table__shadow').addEventListener) {
        // IE9, Chrome, Safari, Opera
        document.querySelector('.wires-table__shadow').addEventListener('mousewheel', scrollHorizontally, false);
        // Firefox
        document.querySelector('.wires-table__shadow').addEventListener('DOMMouseScroll', scrollHorizontally, false);
    } else {
        // IE 6/7/8
        document.querySelector('.wires-table__shadow').attachEvent('onmousewheel', scrollHorizontally);
    }
};