404 whilst accessing the NPX Built in Overlay

[daniel-johns-99]

As per https://spotlightjs.com/sidecar/npx/ running the sidecar:
If you start the sidecar independently, you can visit the overlay at http://localhost:8969/ and use a built in overlay to view your application.

However, when navigating to http://localhost:8969/ I am getting a 404 with no content.

I am running a react-native app so can not launch spotlight through the web frontend and am on windows so the bundled MacOS electron app is not available.

[Shubhdeep12]

Hi @daniel-johns-99 looks like you are running sidecar from CLI, right?
are you running it manually?
if yes, what's the output when you ran that?
is it something like

$ npx @spotlightjs/spotlight
🔎 [Spotlight] Sidecar listening on 8969
🔎 [Spotlight] You can open: http://localhost:8969 to see the Spotlight overlay directly

[daniel-johns-99]

Hi @Shubhdeep12

I see this:

C:\>npx @spotlightjs/spotlight
🔎 [Spotlight] Sidecar listening on 8969

I dont see anything about the overlay. Is there a way to run it with verboe/debug options to provide you some more info?

[Shubhdeep12]

Hi @daniel-johns-99 looks like you are running the sidecar in C drive
To access the Spotlight overlay on http://localhost:8969 you need to run the sidecar from the root directory of the project where the spotlight is installed.
run command - npx @spotlightjs/spotlight in root of your project folder.

we will update the docs as well.

[daniel-johns-99]

Hi @Shubhdeep12 Still same problem, however you mentioned I need to run from where "spotlight" is installed.

From the instructions in the release notes of Sentry/React-native it did not mention I would have to install spotlight: https://github.com/getsentry/sentry-react-native/releases/tag/5.18.0
Just add the integration to add the integration to your Sentry.init, and run the overlay.

So I have not installed it, I assumed it came bundled with Sentry?

[Shubhdeep12]

Hi @daniel-johns-99
No, Spotlight is not bundled with Sentry.

Its standalone and it is comprised of Overlay and Sidecar.

• Sidecar - which receives the events from sentry when enableSpotlight is true in Sentry.init
• Overlay - UI where we have to display the captured events
  there are diff ways to access the overlay :
  1. By installing Spotlight and initiating it after sentry - https://spotlightjs.com/setup/ (Useful for the applications with Frontend)
  2. By installing Spotlight and running sidecar in root level as I mentioned above - which will run the overlay on localhost port 8969 (useful for backend-only apps).
  3. For Mac users, to use the Spotlight Desktop app only which will handle both overlay and sidecar - https://github.com/getsentry/sentry-react-native/releases/tag/5.18.0 which is mentioned in the release notes you shared