Spotlight Overlay needs `process` to be set, doesn't work with Rails + importmaps out of the box

Question

Spotlight Overlay needs `process` to be set, doesn't work with Rails + importmaps out of the box

Closed this issue 10 months ago · 12 comments

Environment

Rails 7.0 with importmaps (yeah yeah, I know, I just needed a quick example though).
@spotlightjs/overlay@0.0.16

Steps to Reproduce

So, take a clean empty new Rails app
Add @spotlightjs/overlay via importmap, so it looks like this:

 # Pin npm packages by running ./bin/importmap

pin "application", preload: true
pin "@hotwired/turbo-rails", to: "turbo.min.js", preload: true
pin "@hotwired/stimulus", to: "stimulus.min.js", preload: true
pin "@hotwired/stimulus-loading", to: "stimulus-loading.js", preload: true
pin_all_from "app/javascript/controllers", under: "controllers"
pin "@spotlightjs/overlay", to: "https://ga.jspm.io/npm:@spotlightjs/overlay@0.0.16/dist/sentry-spotlight.js"

Add the init code to application.js:

// Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails
import "@hotwired/turbo-rails"
import "controllers"

import * as Spotlight from '@spotlightjs/overlay';
Spotlight.init();

Load the page

Expected Result

I want the Spotlight overlay!

Actual Result

Uncaught ReferenceError: process is not defined
    <anonymous> sentry-spotlight.js:2150

Specific check that fails: process.env.NODE_ENV. I don't see that particular check in packages/overlay, diggin in to see what / how it's imported.

I was just testing sentry-ruby's Spotlight PR. I'll make that one work first, then see if I can fix this in a cheap way, too.

Answer 1 · 2023-11-27T22:39:05.000Z

Gonna dig real quick maybe easy fix

Answer 2 · 2023-11-27T22:41:40.000Z

I'm looking too — should be straightforward, just trying to figure out what checks for process.env.NODE_ENV or process.* really, and making it more defensive.

Answer 3 · 2023-11-27T22:43:51.000Z

Looks like this might be in React/Vite :(

process.env.NODE_ENV === "production"

Might be related to vitejs/vite#1973

Answer 4 · 2023-11-27T22:44:53.000Z

avkonst/hookstate#118 (comment)

Answer 5 · 2023-11-27T23:02:25.000Z

Related: rails/importmap-rails#162

So basically, not necessarily a bug. This seems to be extremely common, and it's a direct consequence of how Rails 7 does things (thanks DHH =/), quite literally without a bundler.

For folks using Rails, they might need to inject window.process = { env: { NODE_ENV: "whatever" } } for now.

UPD: hehe, nope, just adding the polyfil in Rails application.js doesn't fix it.