Not seeing any test events

[neilbradley]

Hi, Thank you for providing this package. I have a Next.JS project using Typescript, where I have added this code to /pages/api/fb-events.ts;

import { fbEventsHandler } from "@rivercode/facebook-conversion-api-nextjs/handlers";

export default fbEventsHandler;

I have then added the fbEvent into /pages/_app.tsx as follows, but i'm not seeing any test events come through to Facebook when I have deployed to Vercel. I also have the variable set: NEXT_PUBLIC_FB_DEBUG=true.

function MyApp({ Component, pageProps }: AppProps) {
  fbEvent({
    eventName: "ViewContent",
    products: [],
  });

  return (
    <>
     ...
    </>
  );
}

I wondered if you could tell me if I have missed something?

When I check the Realtime Logs in Vercel Functions, I also see this error;

2022-05-16T08:45:30.979Z    44fe16a8-977e-4409-9c58-d8a118c1e2ee    ERROR   Uncaught Exception  {"errorType":"ReferenceError","errorMessage":"navigator is not defined","stack":["ReferenceError: navigator is not defined","    at Timeout._onTimeout (/var/task/frontend/node_modules/@rivercode/facebook-conversion-api-nextjs/dist/conversion-api.js:43:24)","    at listOnTimeout (internal/timers.js:557:17)","    at processTimers (internal/timers.js:500:7)"]}
Unknown application error occurred

Thank you.

[ovdahlberg]

Hi @neilbradley!

You should probably wrap the fbEvent in an useEffect so it's rendered client side.

Something like this:

function MyApp({ Component, pageProps }: AppProps) {
  useEffect(() => {
    fbEvent({
      eventName: "ViewContent",
      products: [],
    });
  }, []);

  return (
    <>
     ...
    </>
  );
}

[neilbradley]

Thanks, @ovdahlberg.

That seems to have gotten rid of that error.

When I view my site, developer tools is showing this error for fb-events:

{error: "The request body is missing required parameters"} error: "The request body is missing required parameters"

When I also view the Serverless function logs in Vercel for the /api/fb-events, the POST requests have the following, which is probably due to the error above but I think all of the other parameters were optional? I had to add an empty array of products before because it errored if I didn't include products;

Function Status: 400 Edge Status: 400

I'm assuming this is a Vercel issue rather than

[ovdahlberg]

Hi @neilbradley!

I think the problem is related to the empty products array.

Does it work if you add some test product in the array?

In that case, I should make the products array optional.

[neilbradley]

Hi @ovdahlberg. I’ll give that a try. The website I’m using this on is not an e-commerce site, so we don’t need products to be tracked. We are using this for ViewContent and Lead mainly.

[neilbradley]

@ovdahlberg Adding the fake SKU in the products array seems to have fixed it for now and I can see ViewContent events appearing in FB.