title: window.pageYOffset not giving expected value in javascript
body: <p>I have a page with 4 sections - section 1,2,3,4. On clicking each section I will scroll to the next section. On clicking the last section which is section 4 I will scroll back to the top i.e. section 1. All these functionalities are working fine. The challenge I am having here is when I am writing the scroll positions before and after click to the console log, I am getting the same start and end scroll positions for window.pageYOffset. I am unable to figure out why I am getting so. Any guidance will be highly appreciated.</p>
  <p>Below is the link of the jsfiddle for your reference
  <a href="https://jsfiddle.net/seshadri27/5np0v9rt/8/" rel="nofollow noreferrer">https://jsfiddle.net/seshadri27/5np0v9rt/8/</a></p>
  <pre><code>    const sectionList = document.querySelectorAll('.section');
  
      const sectionHeight = Number.parseFloat(getComputedStyle(sectionList[0]).height);
  
      sectionList.forEach(function(section){
  
          section.addEventListener('click',function(e){
  
          console.log(`data count:${section.dataset.count}`);
  
          console.log(`Start scroll position X/Y: ${window.pageXOffset}/${window.pageYOffset}`)
  
          if (section.dataset.count == 4){
  
              scrollTo({top:0,
                        left:0,
                        behavior:'smooth'})
          }
  
          else{
              scrollTo({top:sectionHeight * section.dataset.count,
                        left:0,
                        behavior:'smooth'})
          }
  
          console.log(`End scroll position X/Y: ${window.pageXOffset}/${window.pageYOffset}`)
  
          })
      }
      )
  </code></pre>