From 406ed6e0086234c3de19d89fce1027e596f238d2 Mon Sep 17 00:00:00 2001
From: Robbie <robbie.coomber@gmail.com>
Date: Wed, 21 Aug 2024 14:35:49 +0100
Subject: [PATCH] fix: Use posthog.version in heatmap logic (#24484)

Co-authored-by: github-actions <41898282+github-actions[bot]@users.noreply.github.com>
---
 frontend/src/lib/utils/semver.test.ts         | 12 +++++++++++-
 frontend/src/lib/utils/semver.ts              |  7 +++++++
 frontend/src/toolbar/elements/heatmapLogic.ts | 14 ++++++--------
 3 files changed, 24 insertions(+), 9 deletions(-)

diff --git a/frontend/src/lib/utils/semver.test.ts b/frontend/src/lib/utils/semver.test.ts
index 31bcc58cdf5c9..67ee07860fc7f 100644
--- a/frontend/src/lib/utils/semver.test.ts
+++ b/frontend/src/lib/utils/semver.test.ts
@@ -1,4 +1,4 @@
-import { highestVersion, lowestVersion, parseVersion, versionToString } from './semver'
+import { createVersionChecker, highestVersion, lowestVersion, parseVersion, versionToString } from './semver'
 
 describe('semver', () => {
     describe('parseVersion', () => {
@@ -52,4 +52,14 @@ describe('semver', () => {
             expect(versionToString({ major: 1 })).toEqual('1')
         })
     })
+    describe('createVersionChecker', () => {
+        it('should create a version checker that checks that a version is above or equal to a specified version', () => {
+            const isSupportedVersion = createVersionChecker('4.5.6')
+            expect(isSupportedVersion('1.2.3')).toEqual(false)
+            expect(isSupportedVersion('4.5.6')).toEqual(true)
+            expect(isSupportedVersion('4.5.7')).toEqual(true)
+            expect(isSupportedVersion('7.8.9')).toEqual(true)
+            expect(isSupportedVersion('4.5.6-alpha')).toEqual(false)
+        })
+    })
 })
diff --git a/frontend/src/lib/utils/semver.ts b/frontend/src/lib/utils/semver.ts
index 5a8f4606d7247..79cf377c51584 100644
--- a/frontend/src/lib/utils/semver.ts
+++ b/frontend/src/lib/utils/semver.ts
@@ -106,3 +106,10 @@ export function versionToString(version: SemanticVersion): string {
     }
     return versionPart
 }
+
+export function createVersionChecker(requiredVersion: string | SemanticVersion) {
+    return (version: string | SemanticVersion): boolean => {
+        const diff = diffVersions(version, requiredVersion)
+        return !diff || diff.diff > 0
+    }
+}
diff --git a/frontend/src/toolbar/elements/heatmapLogic.ts b/frontend/src/toolbar/elements/heatmapLogic.ts
index e97b1bf998532..f297110587e1a 100644
--- a/frontend/src/toolbar/elements/heatmapLogic.ts
+++ b/frontend/src/toolbar/elements/heatmapLogic.ts
@@ -16,6 +16,7 @@ import {
 } from 'lib/components/heatmaps/types'
 import { calculateViewportRange, DEFAULT_HEATMAP_FILTERS } from 'lib/components/heatmaps/utils'
 import { dateFilterToText } from 'lib/utils'
+import { createVersionChecker } from 'lib/utils/semver'
 import { PostHog } from 'posthog-js'
 import { collectAllElementsDeep, querySelectorAllDeep } from 'query-selector-shadow-dom'
 
@@ -28,7 +29,7 @@ import { FilterType, PropertyFilterType, PropertyOperator } from '~/types'
 
 import type { heatmapLogicType } from './heatmapLogicType'
 
-export const SCROLL_DEPTH_JS_VERSION = [1, 99]
+export const doesVersionSupportScrollDepth = createVersionChecker('1.99')
 
 const emptyElementsStatsPages: PaginatedResponse<ElementsEventType> = {
     next: undefined,
@@ -438,18 +439,15 @@ export const heatmapLogic = kea<heatmapLogicType>([
             (s) => [s.posthog],
             (posthog: PostHog): 'version' | 'disabled' | null => {
                 const posthogVersion =
-                    posthog?._calculate_event_properties('test', {}, new Date())?.['$lib_version'] ?? '0.0.0'
-                const majorMinorVersion = posthogVersion.split('.')
-                const majorVersion = parseInt(majorMinorVersion[0], 10)
-                const minorVersion = parseInt(majorMinorVersion[1], 10)
+                    posthog?.version ??
+                    posthog?._calculate_event_properties('test', {}, new Date())?.['$lib_version'] ??
+                    '0.0.0'
 
                 if (!(posthog as any)?.scrollManager?.scrollY) {
                     return 'version'
                 }
 
-                const isSupported =
-                    majorVersion > SCROLL_DEPTH_JS_VERSION[0] ||
-                    (majorVersion === SCROLL_DEPTH_JS_VERSION[0] && minorVersion >= SCROLL_DEPTH_JS_VERSION[1])
+                const isSupported = doesVersionSupportScrollDepth(posthogVersion)
                 const isDisabled = posthog?.config.disable_scroll_properties
 
                 return !isSupported ? 'version' : isDisabled ? 'disabled' : null