Trying to stop chrome pull to refresh with stop propagation and some additional top offset checks 🚀

Author: chicio

_includes/critical.css

@@ -16,5 +16,5 @@
 </script>
 <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS_SVG"></script>
 <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.3/cookieconsent.min.js"></script>
-<script type="text/javascript" src="/assets/js/index.blog.min.js?rev=a155500f2a958119ba19c2b4b967fb7f"></script>
+<script type="text/javascript" src="/assets/js/index.blog.min.js?rev=7b4115386954f6607bbeaca108e560d7"></script>
 {%include service-worker.html %}

_includes/dependencies-js-blog.html

@@ -1 +1 @@
-"/assets/js/index.blog.min.js?rev=a155500f2a958119ba19c2b4b967fb7f",
+"/assets/js/index.blog.min.js?rev=7b4115386954f6607bbeaca108e560d7",

_includes/service-worker-js-blog-urls.js

@@ -28,7 +28,10 @@ const pullToRefresh = (): void => {
     pullToRefreshLoaderElement.style.opacity = `${pullToRefreshLoaderOpacity}`
   }
 
-  const isDraggingForPullToRefresh = (yMovement: number): boolean => window.scrollY <= 0 && yMovement <= 0
+  const isDraggingForPullToRefresh = (yMovement: number): boolean => {
+    const scrollY = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop
+    return scrollY === 0 && yMovement <= 0
+  }
 
   const closePullToRefresh = (): void => {
     addCssClass(pullToRefreshElement, 'end-pull')
@@ -80,6 +83,7 @@ const pullToRefresh = (): void => {
 
     if (isDraggingForPullToRefresh(yMovement) && !pullToRefreshStatusRepository.refreshStarted) {
       event.preventDefault()
+      event.stopPropagation()
       showPullToRefresh()
 
       if (isPullToRefreshDragCompleted(yAbsoluteMovement)) {

_js/blog/pull-to-refresh.js

@@ -28,7 +28,10 @@ const pullToRefresh = () => {
     pullToRefreshLoaderElement.style.opacity = `${pullToRefreshLoaderOpacity}`
   }
 
-  const isDraggingForPullToRefresh = (yMovement) => window.scrollY <= 0 && yMovement <= 0
+  const isDraggingForPullToRefresh = (yMovement) => {
+    const scrollY = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop
+    return scrollY === 0 && yMovement <= 0
+  }
 
   const closePullToRefresh = () => {
     addCssClass(pullToRefreshElement, 'end-pull')
@@ -80,6 +83,7 @@ const pullToRefresh = () => {
 
     if (isDraggingForPullToRefresh(yMovement) && !pullToRefreshStatusRepository.refreshStarted) {
       event.preventDefault()
+      event.stopPropagation()
       showPullToRefresh()
 
       if (isPullToRefreshDragCompleted(yAbsoluteMovement)) {