PostHog
Remix & Posthog provider causing '$' to be placed on the page.
PostHogProvider adding a dollar sign to pages.
After following the guide on the Posthog site to install the PostHogProvider into a remix application, we started seeing a dollar sign appear on some pages.
This is an image of where the dollar sign appears.
Posthog provider
export const PosthogProvider = ({ children }: { children: ReactNode }) => {
const [hydrated, setHydrated] = useState(false);
useEffect(() => {
posthog.init("phc_...", {
api_host: "/ph-relay",
ui_host: "https://us.posthog.com",
});
setHydrated(true);
}, []);
if (!hydrated) return <>{children}</>;
return <PostHogProvider client={posthog}>{children}</PostHogProvider>;
};
Remix's root.tsx
export function Layout({ children }: { children: React.ReactNode }) {
return (
<html lang="en">
<head>
<meta charSet="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<Meta />
<Links />
</head>
<body>
<PosthogProvider>
{children}
<ScrollRestoration />
<Scripts />
</PosthogProvider>
</body>
</html>
);
}
👋 i've just tried to recreate and i can't using a setup here
https://github.com/PostHog/posthog-js/pull/2577 and node v22.17.1
That all just means I'm doing something different to you all, wondering if someone can make a minimal example that reproduces it, or point out where my example is different to yours 🙏
It's being used in an iframe, would that have something to do with this?
It only shows in the prod app after building the app running it on the server
This is what I'm running
NODE_VERSION=22.9.0
react => 18.3.1
posthog-js => 1.292.0
@posthog/react => 1.4.0
@remix-run/node => 2.16.8
@ayushsoni1001 hey! Since you can reproduce it consistently, any chance you can share a Github repo where that's reproduced? That would definitely help us expedite a fix here :)
@Francismb I don't think an iframe would be relevant here - but in your case is the app in an iframe?
does anything stand out as different between your environment and https://github.com/PostHog/posthog-js/pull/2577?
🙏
forced to versions
react => 18.3.1
posthog-js => 1.292.0
@posthog/react => 1.4.0
@remix-run/node => 2.16.8
in my example app and made a production build and didn't get the $ in the page we're on a slightly different node version but I'd really hope that can't cause it 🙈
my assumption is there's some building/bundling/processing something going on that's interacting badly somewhere but still no idea where 😓