Merge branch 'main' into preact-surveys-components

.github/pull_request_template.md

@@ -5,3 +5,4 @@
 ## Checklist
 - [ ] Tests for new code (see [advice on the tests we use](https://github.com/PostHog/posthog-js#tiers-of-testing))
 - [ ] Accounted for the impact of any changes across different browsers
+- [ ] Accounted for backwards compatibility of any changes (no breaking changes in posthog-js!)

.github/workflows/cd.yml

@@ -69,12 +69,30 @@ jobs:
                   NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
             - name: Create GitHub release
-              uses: actions/create-release@v1
               env:
-                  GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-              with:
-                  tag_name: v${{ env.COMMITTED_VERSION }}
-                  release_name: ${{ env.COMMITTED_VERSION }}
+                GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+              run: |
+                # read from the first until the second header in the changelog file
+                # this assumes the formatting of the file
+                # and that this workflow is always running for the most recent entry in the file 
+                LAST_CHANGELOG_ENTRY=$(awk -v defText="see CHANGELOG.md" '/^## /{if (flag) exit; flag=1} flag && /^##$/{exit} flag; END{if (!flag) print defText}' CHANGELOG.md)
+                # the action we used to use was archived, and made it really difficult to create a release with a body
+                # because the LAST_CHANGELOG_ENTRY contains bash special characters so passing it between steps
+                # was a pain.
+                # we can use the github cli to create a release with a body
+                # all as part of one step
+                gh api \
+                  --method POST \
+                  -H "Accept: application/vnd.github+json" \
+                  -H "X-GitHub-Api-Version: 2022-11-28" \
+                  /repos/posthog/posthog-js/releases \
+                  -f tag_name="v${{ env.COMMITTED_VERSION }}" \
+                -f target_commitish='main' \
+                -f name="${{ env.COMMITTED_VERSION }}" \
+                -f body="$LAST_CHANGELOG_ENTRY" \
+                -F draft=false \
+                -F prerelease=false \
+                -F generate_release_notes=false 
 
     create-pull-request:
         name: Create main repo PR with new posthog-js version

.github/workflows/library-ci.yml

@@ -69,7 +69,7 @@ jobs:
                 node-version: '18'
                 cache: 'pnpm'
             - run: pnpm install
-            - run: pnpm jest functional_tests/
+            - run: pnpm run test:functional
 
     lint:
         name: Lint

CHANGELOG.md

@@ -1,3 +1,45 @@
+## 1.105.7 - 2024-02-11
+
+- fix: allow custom events when idle (#1013)
+- chore: no need to account for performance raw (#1012)
+- chore: add test case for ahrefs bot (#1011)
+- chore: really really write changelog to release (#1008)
+
+## 1.105.6 - 2024-02-08
+
+- feat: save posthog config at start of session recording (#1005)
+- chore: test stopping and starting (#1009)
+
+## 1.105.5 - 2024-02-08
+
+- feat: account for persistence for canvas recording (#1006)
+- chore: improve template to account for backwards compatibility (#1007)
+
+## 1.105.4 - 2024-02-07
+
+- feat: Add dynamic routing of ingestion endpoints (#986)
+- Update CHANGELOG.md (#1004)
+
+## 1.105.3 - 2024-02-07
+
+identical to 1.105.1 - bug in CI scripts
+
+## 1.105.2 - 2024-02-07
+
+identical to 1.105.1 - bug in CI scripts
+
+## 1.105.1 - 2024-02-07
+
+- fix: autocapture allowlist should consider the tree (#1000)
+- chore: move posthog test instance helper (#999)
+- chore: nit pick log message (#997)
+- chore: copy most recent changelog entry when creating a release (#995)
+
+## 1.105.0 - 2024-02-06
+
+- fix: Add warning and conversion for number distinct_id (#993)
+- fix: Remove `baseUrl` from TypeScript compiler options (#996)
+
 ## 1.104.4 - 2024-02-02
 
 - fix: very defensive body redaction (#988)

cypress/e2e/session-recording.cy.ts

@@ -3,6 +3,39 @@
 import { _isNull } from '../../src/utils/type-utils'
 import { start } from '../support/setup'
 
+function ensureRecordingIsStopped() {
+    cy.get('[data-cy-input]')
+        .type('hello posthog!')
+        .wait(250)
+        .then(() => {
+            cy.phCaptures({ full: true }).then((captures) => {
+                // should be no captured data
+                expect(captures.map((c) => c.event)).to.deep.equal([])
+            })
+        })
+}
+
+function ensureActivitySendsSnapshots() {
+    cy.get('[data-cy-input]')
+        .type('hello posthog!')
+        .wait('@session-recording')
+        .then(() => {
+            cy.phCaptures({ full: true }).then((captures) => {
+                expect(captures.map((c) => c.event)).to.deep.equal(['$snapshot'])
+                expect(captures[0]['properties']['$snapshot_data']).to.have.length.above(14).and.below(39)
+                // a meta and then a full snapshot
+                expect(captures[0]['properties']['$snapshot_data'][0].type).to.equal(4) // meta
+                expect(captures[0]['properties']['$snapshot_data'][1].type).to.equal(2) // full_snapshot
+                expect(captures[0]['properties']['$snapshot_data'][2].type).to.equal(5) // custom event with options
+                expect(captures[0]['properties']['$snapshot_data'][3].type).to.equal(5) // custom event with posthog config
+                // Making a set from the rest should all be 3 - incremental snapshots
+                expect(new Set(captures[0]['properties']['$snapshot_data'].slice(4).map((s) => s.type))).to.deep.equal(
+                    new Set([3])
+                )
+            })
+        })
+}
+
 describe('Session recording', () => {
     describe('array.full.js', () => {
         it('captures session events', () => {
@@ -27,13 +60,14 @@ describe('Session recording', () => {
                         // should be a pageview and a $snapshot
                         expect(captures.map((c) => c.event)).to.deep.equal(['$pageview', '$snapshot'])
 
-                        expect(captures[1]['properties']['$snapshot_data']).to.have.length.above(33).and.below(38)
+                        expect(captures[1]['properties']['$snapshot_data']).to.have.length.above(33).and.below(39)
                         // a meta and then a full snapshot
                         expect(captures[1]['properties']['$snapshot_data'][0].type).to.equal(4) // meta
                         expect(captures[1]['properties']['$snapshot_data'][1].type).to.equal(2) // full_snapshot
                         expect(captures[1]['properties']['$snapshot_data'][2].type).to.equal(5) // custom event with options
+                        expect(captures[1]['properties']['$snapshot_data'][3].type).to.equal(5) // custom event with posthog config
                         // Making a set from the rest should all be 3 - incremental snapshots
-                        const incrementalSnapshots = captures[1]['properties']['$snapshot_data'].slice(3)
+                        const incrementalSnapshots = captures[1]['properties']['$snapshot_data'].slice(4)
                         expect(new Set(incrementalSnapshots.map((s) => s.type))).to.deep.equal(new Set([3]))
                     })
                 })
@@ -57,26 +91,39 @@ describe('Session recording', () => {
         })
 
         it('captures session events', () => {
+            cy.phCaptures({ full: true }).then((captures) => {
+                // should be a pageview at the beginning
+                expect(captures.map((c) => c.event)).to.deep.equal(['$pageview'])
+            })
+            cy.resetPhCaptures()
+
+            let startingSessionId: string | null = null
+            cy.posthog().then((ph) => {
+                startingSessionId = ph.get_session_id()
+            })
+
             cy.get('[data-cy-input]').type('hello world! ')
             cy.wait(500)
-            cy.get('[data-cy-input]')
-                .type('hello posthog!')
-                .wait('@session-recording')
-                .then(() => {
-                    cy.phCaptures({ full: true }).then((captures) => {
-                        // should be a pageview and a $snapshot
-                        expect(captures.map((c) => c.event)).to.deep.equal(['$pageview', '$snapshot'])
-                        expect(captures[1]['properties']['$snapshot_data']).to.have.length.above(33).and.below(38)
-                        // a meta and then a full snapshot
-                        expect(captures[1]['properties']['$snapshot_data'][0].type).to.equal(4) // meta
-                        expect(captures[1]['properties']['$snapshot_data'][1].type).to.equal(2) // full_snapshot
-                        expect(captures[1]['properties']['$snapshot_data'][2].type).to.equal(5) // custom event with options
-                        // Making a set from the rest should all be 3 - incremental snapshots
-                        expect(
-                            new Set(captures[1]['properties']['$snapshot_data'].slice(3).map((s) => s.type))
-                        ).to.deep.equal(new Set([3]))
-                    })
-                })
+            ensureActivitySendsSnapshots()
+            cy.posthog().then((ph) => {
+                ph.stopSessionRecording()
+            })
+            cy.resetPhCaptures()
+            ensureRecordingIsStopped()
+
+            // restarting recording
+            cy.posthog().then((ph) => {
+                ph.startSessionRecording()
+            })
+            ensureActivitySendsSnapshots()
+
+            // the session id is not rotated by stopping and starting the recording
+            cy.posthog().then((ph) => {
+                const secondSessionId = ph.get_session_id()
+                expect(startingSessionId).not.to.be.null
+                expect(secondSessionId).not.to.be.null
+                expect(secondSessionId).to.equal(startingSessionId)
+            })
         })
 
         it('captures snapshots when the mouse moves', () => {
@@ -195,9 +242,9 @@ describe('Session recording', () => {
                     expect(captures[1]['properties']['$snapshot_data'][0].type).to.equal(4) // meta
                     expect(captures[1]['properties']['$snapshot_data'][1].type).to.equal(2) // full_snapshot
                     expect(captures[1]['properties']['$snapshot_data'][2].type).to.equal(5) // custom event with options
-
+                    expect(captures[1]['properties']['$snapshot_data'][3].type).to.equal(5) // custom event with posthog config
                     const xPositions = []
-                    for (let i = 3; i < captures[1]['properties']['$snapshot_data'].length; i++) {
+                    for (let i = 4; i < captures[1]['properties']['$snapshot_data'].length; i++) {
                         expect(captures[1]['properties']['$snapshot_data'][i].type).to.equal(3)
                         expect(captures[1]['properties']['$snapshot_data'][i].data.source).to.equal(
                             6,

functional_tests/feature-flags.test.ts

@@ -1,5 +1,5 @@
 import { v4 } from 'uuid'
-import { createPosthogInstance } from './posthog-instance'
+import { createPosthogInstance } from '../src/__tests__/helpers/posthog-instance'
 import { waitFor } from '@testing-library/dom'
 import { getRequests, resetRequests } from './mock-server'
 

functional_tests/identify.test.ts

@@ -2,8 +2,9 @@ import 'regenerator-runtime/runtime'
 import { waitFor } from '@testing-library/dom'
 import { v4 } from 'uuid'
 import { getRequests } from './mock-server'
-import { createPosthogInstance } from './posthog-instance'
-
+import { createPosthogInstance } from '../src/__tests__/helpers/posthog-instance'
+import { logger } from '../src/utils/logger'
+jest.mock('../src/utils/logger')
 test('identify sends a identify event', async () => {
     const token = v4()
     const posthog = await createPosthogInstance(token)
@@ -24,6 +25,7 @@ test('identify sends a identify event', async () => {
             })
         )
     )
+    expect(jest.mocked(logger).error).toBeCalledTimes(0)
 })
 
 test('identify sends an engage request if identify called twice with the same distinct id and with $set/$set_once', async () => {

package.json

@@ -1,6 +1,6 @@
 {
     "name": "posthog-js",
-    "version": "1.104.4",
+    "version": "1.105.7",
     "description": "Posthog-js allows you to automatically capture usage and send events to PostHog.",
     "repository": "https://github.com/PostHog/posthog-js",
     "author": "[email protected]",
@@ -13,10 +13,11 @@
         "lint": "eslint src",
         "prettier": "prettier --write src/ functional_tests/",
         "prepublishOnly": "pnpm lint && pnpm test && pnpm build && pnpm test:react",
-        "test": "pnpm test:unit && pnpm test:custom-eslint-rules",
+        "test": "pnpm test:unit && pnpm test:custom-eslint-rules && pnpm test:functional",
         "test:unit": "jest src",
         "test:custom-eslint-rules": "jest eslint-rules",
         "test:react": "cd react; pnpm test",
+        "test:functional": "jest functional_tests",
         "test-watch": "jest --watch src",
         "cypress": "cypress open",
         "prepare": "husky install"

playground/nextjs/package.json

@@ -16,7 +16,7 @@
         "eslint": "8.34.0",
         "eslint-config-next": "13.1.6",
         "next": "13.5.6",
-        "posthog-js": "^1.88.1",
+        "posthog-js": "^1.103.1",
         "react": "18.2.0",
         "react-dom": "18.2.0",
         "typescript": "4.9.5"

playground/nextjs/pages/canvas.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 import Head from 'next/head'
 import { useEffect, useRef } from 'react'
 
-export default function Home() {
+export default function Canvas() {
     const ref = useRef<HTMLCanvasElement>(null)
 
     useEffect(() => {