Why window.innerWidth is wrong?

Question

I'm trying to make a canvas JavaScript game, so i added this in code

window.addEventListener("resize", () => {
  console.log("resi2ze");
  canvasElement.width = window.innerWidth;
  canvasElement.height = window.innerHeight;
});

But when I resize browser window, canvas height is bigger than body height (for example, body height is 465px, and canvas height is 462px). How can I prevent it, so canvas height would be same as window height?

Answer 1

Seems like the scrollbar itself is an issue, because it adds few pixels. I always add overflow: hidden to body so scrollbar doesn't show up.