Merge branch 'master' into fix/optional-values

# Conflicts: # src/posthog-core.ts
PostHog · Sep 6, 2023 · 510dd45 · 510dd45
2 parents ab43482 + 35e5992
commit 510dd45
Show file tree

Hide file tree

Showing 30 changed files with 774 additions and 194 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,28 +1,44 @@
+/*eslint-env node */
+
+const rules = {
+    'prettier/prettier': 'error',
+    'prefer-spread': 'off',
+    '@typescript-eslint/no-empty-function': 'off',
+    '@typescript-eslint/no-this-alias': 'off',
+    '@typescript-eslint/no-explicit-any': 'off',
+    '@typescript-eslint/no-unused-vars': ['error'],
+    'no-prototype-builtins': 'off',
+    'no-empty': 'off',
+}
+
+const extend = [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:react/recommended',
+    'plugin:react-hooks/recommended',
+    'prettier',
+    'plugin:compat/recommended',
+]
+
 module.exports = {
     env: {
         browser: true,
         es6: true,
+        'jest/globals': true,
+    },
+    globals: {
+        given: 'readonly',
+        global: 'readonly',
+        Buffer: 'readonly',
     },
     parser: '@typescript-eslint/parser',
     parserOptions: {
         ecmaVersion: 2018,
         sourceType: 'module',
     },
-    plugins: ['prettier', '@typescript-eslint', 'eslint-plugin-react', 'eslint-plugin-react-hooks'],
-    extends: [
-        'plugin:@typescript-eslint/recommended',
-        'plugin:react/recommended',
-        'plugin:react-hooks/recommended',
-        'prettier',
-        'plugin:compat/recommended',
-    ],
-    rules: {
-        'prettier/prettier': 'error',
-        'prefer-spread': 'off',
-        '@typescript-eslint/no-empty-function': 'off',
-        '@typescript-eslint/no-this-alias': 'off',
-        '@typescript-eslint/no-explicit-any': 'off',
-    },
+    plugins: ['prettier', '@typescript-eslint', 'eslint-plugin-react', 'eslint-plugin-react-hooks', 'jest'],
+    extends: extend,
+    rules,
     settings: {
         react: {
             version: '17.0',
@@ -34,19 +50,9 @@ module.exports = {
             // the same set of config as in the root
             // but excluding the 'plugin:compat/recommended' rule
             // we don't mind using the latest features in our tests
-            extends: [
-                'plugin:@typescript-eslint/recommended',
-                'plugin:react/recommended',
-                'plugin:react-hooks/recommended',
-                'prettier',
-            ],
-            rules: {
-                'prettier/prettier': 'error',
-                'prefer-spread': 'off',
-                '@typescript-eslint/no-empty-function': 'off',
-                '@typescript-eslint/no-this-alias': 'off',
-                '@typescript-eslint/no-explicit-any': 'off',
-            },
+            extends: extend.filter((s) => s !== 'plugin:compat/recommended'),
+            rules,
         },
     ],
+    root: true,
 }
diff --git a/.github/workflows/cd.yml b/.github/workflows/cd.yml
@@ -37,10 +37,10 @@ jobs:
                   fetch-depth: 0
                   token: ${{ secrets.POSTHOG_BOT_GITHUB_TOKEN }}
 
-            - name: Set up Node 14
-              uses: actions/setup-node@v2
+            - name: Set up Node 18
+              uses: actions/setup-node@v3
               with:
-                  node-version: 14
+                  node-version: 18
                   registry-url: https://registry.npmjs.org
 
             - name: Install dependencies

diff --git a/.github/workflows/library-ci.yml b/.github/workflows/library-ci.yml
@@ -17,7 +17,7 @@ jobs:
             # Install Node.js
             - uses: actions/setup-node@v3
               with:
-                  node-version: 14
+                  node-version: 18
                   cache: 'yarn'
 
             # Install your dependencies
@@ -33,7 +33,8 @@ jobs:
 
             - uses: actions/setup-node@v3
               with:
-                  node-version: 16
+                  node-version: 18
+                  cache: 'yarn'
 
             - run: yarn install && yarn build
 
@@ -50,7 +51,7 @@ jobs:
             # Install Node.js
             - uses: actions/setup-node@v3
               with:
-                  node-version: 14
+                  node-version: 18
                   cache: 'yarn'
 
             # Install your dependencies
@@ -68,7 +69,7 @@ jobs:
             # Install Node.js
             - uses: actions/setup-node@v3
               with:
-                  node-version: 14
+                  node-version: 18
                   cache: 'yarn'
 
             # Install your dependencies

diff --git a/.github/workflows/react.yml b/.github/workflows/react.yml
@@ -9,7 +9,8 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v1
-      - uses: actions/setup-node@v1
+      - uses: actions/setup-node@v3
         with:
-          node-version: 14
+          node-version: 18
+          cache: 'yarn'
       - run: yarn && yarn build && cd react && yarn test
diff --git a/.github/workflows/ssr-es-check.yml b/.github/workflows/ssr-es-check.yml
@@ -9,9 +9,11 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v1
-      - uses: actions/setup-node@v1
+      - uses: actions/setup-node@v3
         with:
-          node-version: 14
+          node-version: 18
+          cache: 'yarn'
+
 
       - run: yarn install && yarn build
 

diff --git a/.github/workflows/testcafe.yml b/.github/workflows/testcafe.yml
@@ -8,6 +8,8 @@ env:
   BROWSERSTACK_DEBUG: 'true'
   BROWSERSTACK_NETWORK_LOGS: 'true'
   BROWSERSTACK_CONSOLE: 'info'
+  BROWSERSTACK_FORCE_PROXY: 'true'
+  BROWSERSTACK_USE_AUTOMATE: 'true'
 
 jobs:
   browsers:
@@ -32,16 +34,20 @@ jobs:
       - name: Check out posthog-js
         uses: actions/checkout@v2
 
-      - name: Set up Node 14
-        uses: actions/setup-node@v2
+      - name: Set up Node 18
+        uses: actions/setup-node@v3
         with:
-            node-version: 14
+            node-version: 18
+            cache: 'yarn'
 
       - name: Serve static files
         run: python -m http.server 8080 &
 
+      - name: Install node dependencies
+        run: yarn
+
       - name: Set up posthog-js
-        run: yarn && yarn build-rollup
+        run: yarn build-rollup
 
       - name: Run ${{ matrix.name }} test
-        run: npx testcafe "browserstack:${{ matrix.browserstack }}" testcafe/*.spec.js
+        run: node scripts/run-testcafe-with-retries.mjs --browser "browserstack:${{ matrix.browserstack }}" --attempts 3
diff --git a/.testcaferc.js b/.testcaferc.js
@@ -0,0 +1,3 @@
+module.exports = {
+    src: './testcafe',
+}
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,27 @@
+## 1.77.3 - 2023-09-05
+
+- feat: test a better list of bots and allow users to configure the bot… (#788)
+
+## 1.77.2 - 2023-08-25
+
+- fix(autocapture): element properties tracked up to 1k bytes (#783)
+
+## 1.77.1 - 2023-08-22
+
+- feat: Add pathname to prev page events (#776)
+- fix: Mitigate testcafe flakiness (#779)
+- feat: Filter out events from GPTBot (#772)
+
+## 1.77.0 - 2023-08-18
+
+- feat: Add previous page properties to page events (#773)
+- style: Tighten eslint rules (#775)
+- chore: add media examples to playground (#771)
+
+## 1.76.0 - 2023-08-10
+
+- Fixed up tests to cover all cases (#770)
+
 ## 1.75.4 - 2023-08-09
 
 - feat: remove old UUID code (#755)

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "posthog-js",
-    "version": "1.75.4",
+    "version": "1.77.3",
     "description": "Posthog-js allows you to automatically capture usage and send events to PostHog.",
     "repository": "https://github.com/PostHog/posthog-js",
     "author": "[email protected]",
@@ -46,14 +46,15 @@
         "@types/jest": "^29.5.1",
         "@types/react-dom": "^18.0.10",
         "@types/uuid": "^9.0.1",
-        "@typescript-eslint/eslint-plugin": "^5.30.7",
-        "@typescript-eslint/parser": "^5.30.7",
+        "@typescript-eslint/eslint-plugin": "^6.4.0",
+        "@typescript-eslint/parser": "^6.4.0",
         "babel-eslint": "10.1.0",
         "babel-jest": "^26.6.3",
         "cypress": "10.3.1",
         "eslint": "8.20.0",
         "eslint-config-prettier": "^8.5.0",
         "eslint-plugin-compat": "^4.1.4",
+        "eslint-plugin-jest": "^27.2.3",
         "eslint-plugin-prettier": "^4.2.1",
         "eslint-plugin-react": "^7.30.1",
         "eslint-plugin-react-hooks": "^4.6.0",
@@ -77,10 +78,11 @@
         "rrweb-snapshot": "2.0.0-alpha.8",
         "rrweb-v1": "npm:[email protected]",
         "sinon": "9.0.2",
-        "testcafe": "^1.19.0",
-        "testcafe-browser-provider-browserstack": "^1.14.0",
+        "testcafe": "1.19.0",
+        "testcafe-browser-provider-browserstack": "1.14.0",
         "tslib": "^2.4.0",
-        "typescript": "^4.7.4"
+        "typescript": "^4.7.4",
+        "yargs": "^17.7.2"
     },
     "lint-staged": {
         "*.{ts,tsx,js,json}": "prettier --write",

diff --git a/playground/nextjs/.eslintrc.json b/playground/nextjs/.eslintrc.json
diff --git a/playground/nextjs/pages/_app.tsx b/playground/nextjs/pages/_app.tsx
@@ -1,6 +1,6 @@
 import '@/styles/globals.css'
 
-import { useEffect } from 'react'
+import React, { useEffect } from 'react'
 import type { AppProps } from 'next/app'
 import { useRouter } from 'next/router'
 
@@ -13,6 +13,7 @@ if (typeof window !== 'undefined') {
         session_recording: {
             recordCrossOriginIframes: true,
         },
+        debug: true,
     })
     ;(window as any).posthog = posthog
 }

diff --git a/playground/nextjs/pages/index.tsx b/playground/nextjs/pages/index.tsx
@@ -1,7 +1,6 @@
 import Head from 'next/head'
 import { useFeatureFlagEnabled, usePostHog } from 'posthog-js/react'
-import { useEffect, useState } from 'react'
-import { Player, Controls } from '@lottiefiles/react-lottie-player'
+import React, { useEffect, useState } from 'react'
 import Link from 'next/link'
 
 export default function Home() {
@@ -54,6 +53,8 @@ export default function Home() {
                 <div className="buttons">
                     <Link href="/animations">Animations</Link>
                     <Link href="/iframe">Iframe</Link>
+                    <Link href="/media">Media</Link>
+                    <Link href="/long">Long</Link>
                 </div>
 
                 <p>Feature flag response: {JSON.stringify(result)}</p>

diff --git a/playground/nextjs/pages/long.tsx b/playground/nextjs/pages/long.tsx
@@ -0,0 +1,34 @@
+import Head from 'next/head'
+import Link from 'next/link'
+import React from 'react'
+
+export default function Home() {
+    return (
+        <>
+            <Head>
+                <title>PostHog</title>
+                <meta name="viewport" content="width=device-width, initial-scale=1" />
+            </Head>
+            <main>
+                <h1>A long page</h1>
+                <div className="buttons">
+                    <Link href="/">Home</Link>
+                </div>
+
+                {Array.from({ length: 100 }, (_, i) => (
+                    <p key={i}>
+                        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
+                        labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
+                        laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
+                        voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
+                        non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+                    </p>
+                ))}
+
+                <div className="buttons">
+                    <Link href="/">Home</Link>
+                </div>
+            </main>
+        </>
+    )
+}
diff --git a/playground/nextjs/pages/media.tsx b/playground/nextjs/pages/media.tsx
@@ -0,0 +1,29 @@
+import Head from 'next/head'
+
+export default function Home() {
+    return (
+        <>
+            <Head>
+                <title>PostHog</title>
+                <meta name="viewport" content="width=device-width, initial-scale=1" />
+            </Head>
+            <main>
+                <h1>Video</h1>
+                <p>Useful testing for Replay handling video elements</p>
+                <div style={{margin: 10}}>
+                    <h3>Video</h3>
+                    <video controls={true} style={{width: 500}}>
+                        <source src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4" />
+                    </video>
+                </div>
+
+                <div style={{margin: 10}}>
+                    <h3>Audio</h3>
+                    <audio controls={true}>
+                        <source src="https://github.com/rafaelreis-hotmart/Audio-Sample-files/raw/master/sample.mp3" type="audio/mp3" />
+                    </audio>
+                </div>
+            </main>
+        </>
+    )
+}
diff --git a/playground/nextjs/yarn.lock b/playground/nextjs/yarn.lock
@@ -1920,7 +1920,7 @@ scheduler@^0.23.0:
   dependencies:
     loose-envify "^1.1.0"
 
-semver@^6.3.0:
+semver@^6.3.0, semver@^6.3.1:
   version "6.3.1"
   resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.1.tgz#556d2ef8689146e46dcea4bfdd095f3434dffcb4"