problem when using javascript to get the actual viewport height

main>div {
  height: 100vh;
  height: calc(var('--vh', 1vh) * 100);
}

main>div {
  height: 100vh;
  height: calc(var('--vh', 1vh) * 100);
}

  window.addEventListener('resize', () => {
    const vh = window.innerHeight * 0.01;

    document.documentElement.style.setProperty('--vh', `${vh}px`);
})

  window.addEventListener('resize', () => {
    const vh = window.innerHeight * 0.01;

    document.documentElement.style.setProperty('--vh', `${vh}px`);
})