Absinthe/Socket : JS Error - Uncaught TypeError: Cannot instantiate an arrow function

Hermanverschooten

I have been using absinthe for a while now, and a couple of months ago we switched from webpack to parcel for our JS bundling. All worked fine for some time, until recently I was notified by one of our clients that the site was no longer working, the wheel kept spinning. I investigated and found a JS error on calling AbsintheSocket.create was logged. The odd thing was that at first, the page still worked in dev, but after an upgrade of some npm stuff, it gave the same error. Initially my guess was something in parcel was causing this and as I had learned that phoenix 1.6 will prefer esbuild. I branched and tried that only to find that the same error still occurs.
Wanting to make sure it is not something else in my code that triggers this error, I cloned the phx_esbuild_demo repo that @josevalim was kind enough to provide. I added the @absinthe/socket npm package, imported it in js/app.js, and it triggers the same error.
I pushed the repo to github (GitHub - Hermanverschooten/phx_esbuild_demo: Test for absinthe socket · GitHub, branch test_absinthe).
Has anyone else run into this error and found a solution? The only reference I find googling has to do with shadow-cljs, but I do not see any solution there.

12 comments

/phoenix #javascript #absinthe

0 2478 12

2024-10-18 16:53:55 UTC

Showing Posts 1 to 10

Show Best Posts
Show All (oldest first)
Show All (newest first)

Hermanverschooten

In the mean time I found that replacing

import * as AbsintheSocket from '@absinthe/socket';

with

const AbsintheSocket = require '@absinthe/socket';

seems to work with esbuild but sadly not with parcel v2.0.0-rc.0.

Post #1

maartenvanvliet

The phx_esbuild_repo you link to is empty.

Post #2

Hermanverschooten

Oops, code is there now.

Post #3

mogelbrod

Having the same problem using parcel@2.0.0-rc.0:

Uncaught (in promise) TypeError: Cannot instantiate an arrow function
    at Object._newArrowCheck [as default] (newArrowCheck.js:7)
    at create1 (create.js:82) -

The shadow-cljs thread I believe @Hermanverschooten referred to: https://clojurians-log.clojureverse.org/shadow-cljs/2018-08-10
Related github issue: Runtime Error - Cannot instantiate an arrow function · Issue #365 · thheller/shadow-cljs · GitHub

Post #4

Hermanverschooten

This problem is keeping me from upgrading to Phoenix 1.6. With require instead of import it works for esbuild with phx 1.5, but no longer with 1.6. I tried contacting the original creator of absinthe_socket through slack, but to no avail. And my JS knowledge is not good enough to rewrite.

Post #5

Hermanverschooten

Just for information, the require form now works with phoenix as of 1.6.2

Post #6

neurodynamic

I had the require fix working for a while with esbuild, but for unrelated reasons I recently started using esbuild’s inject feature and that has brought the Uncaught TypeError: Cannot instantiate an arrow function issue with @absinthe/socket back. When I use the inject option, I see the error, and when I take it out, everything’s fine.

Assuming it was an issue with using arrow function syntax, I even rewrote the @absinthe/socket library and published a version without arrow syntax under @absinthe-noarrows/socket but that doesn’t seem to fix the problem either. I’m completely at a loss. It seems like I either need to find a way to replace process.cwd() without using inject (which is needed for path-browserify), or I can’t use @absinthe/socket.

Anyone have any idea: