PostHog JS SDK not compatible with Segment analytics-next package

[kalaynn]

Bug description

Please describe.
The PostHog JS SDK supports integrating with Segment by passing the Segment analytics object into the posthog.init() call, as detailed in this documentation: https://posthog.com/docs/libraries/segment. This works as expected when the Segment analytics object is created from the Segment snippet, but not when it is created from the analytics-next package (https://github.com/segmentio/analytics-next/tree/master/packages/browser#readme).

When trying to do so, I receive the following error:

Uncaught (in promise) TypeError: s2.segment.user().id is not a function

This appears to be because, with the analytics object from the analytics-next package, the user() function is async and returns a promise instead of the object that PostHog expects.

How to reproduce

1. Set up Segment and Posthog per the documentation here: https://posthog.com/docs/libraries/segment
2. Initialize the Segment analytics object using the analytics-next package instead of the Segment snippet
3. Attempt a page load

Environment

• PostHog Cloud US, project ID: 48533
• PostHog Cloud EU, project ID: [please provide from https://eu.posthog.com/settings/project-details#variables]
• PostHog Hobby self-hosted with docker compose, version/commit: [please provide]
• PostHog self-hosted with Kubernetes (deprecated, see "Sunsetting Kubernetes support"), version/commit: [please provide]

Additional context

Thank you for your bug report – we love squashing them!

[benjackwhite]

Created this PR to import the package and try and have proper type checking - but even their types don't show it as being a promise 🙈 #1119

Could you please share your analytics-next version as well as a snippet of how you are initialising posthog-js with it so we can have a better chance of debugging.

[kamui]

Here's how we're initializing analytics-next (1.66.0) and posthog (1.118.1):

import posthog from "posthog-js"
import { AnalyticsBrowser } from "@segment/analytics-next"

const analytics = AnalyticsBrowser.load({ writeKey: process.env.WRITE_KEY})
analytics.ready(function () {
 posthog.init(process.env.POSTHOG_API_KEY, {
   api_host: process.env.POSTHOG_API_HOST,
import posthog from "posthog-js"
import { AnalyticsBrowser } from "@segment/analytics-next"

const analytics = AnalyticsBrowser.load({ writeKey: process.env.WRITE_KEY})
analytics.ready(function () {
posthog.init(process.env.POSTHOG_API_KEY, {
  api_host: process.env.POSTHOG_API_HOST,
  segment: analytics,
  capture_pageview: false,
  loaded: function () {
    analytics.page()
  }
})
})
   capture_pageview: false,
   loaded: function () {
     analytics.page()
   }
 })
})

[benjackwhite]

Took a while but managed to reproduce and fix. The Segment types and docs are off which was annoying but oh well