Inrupt/solid-client-authn-browser 1.11.0 -> process is not defined

Build a Solid App Solid App Development FAQs
1

I just upgraded @inrupt/solid-client-authn-browser from 1.6.1 to 1.11.0 and am getting the following error, after being redirected back to the app after login:

_stream_readable.js:561 Uncaught ReferenceError: process is not defined
    at maybeReadMore (_stream_readable.js:561)
    at addChunk (_stream_readable.js:306)
    at readableAddChunk (_stream_readable.js:280)
    at Readable.push (_stream_readable.js:241)
    at XMLHttpRequest.request.onload (Requester-browser.js:45)

When I revert the upgrade everything is fine again.

I am using Webpack 5.50.0

The Inrupt “Getting Started” mentions to install the buffer polyfill, which I did, but it did not help. Anything else I might be missing?

1 Like
2

Just recently, I had to configure a Webpack project which required some node.js polyfills. I am speculating that the process object in the error message refers to a node.js reference. Try to install the node-polyfill-webpack-plugin polyfill and instantiate the plugin in the plugins array of your Webpack configuration. Have a look at my config if needed. I hope that solves your problem.

1 Like
3

@zwifi Hmm, maybe the “Getting started” needs updating, as AFAIK since 1.9.0 no polyfills should be needed anymore, except for events, but since 1.10.0 even that should no longer need to be manually installed.

What _stream_readable.js is and why it references process I don’t know either, but hopefully @zwifi will be able to find that out too.

1 Like
4

Hi @aveltens, thanks for reaching out. I’m currently looking into this, and could not reproduce using the demo app provided in solid-client-authn-js/packages/browser/examples/single/bundle at main · inrupt/solid-client-authn-js · G (and updated for the occasion in Updated dependencies and client profile by NSeydoux · Pull Request #1617 · inrupt/solid-client-authn-js · GitHub</title ^^).

Would you mind opening a bug ticket in Sign in to GitHub · GitHub, so that we can discuss the issue there ? In particular, that may get me additional information about your setup. As it stands, I’m not sure where the issue comes from, because the library doesn’t use XMLHttpRequest at all, so this looks like it comes from your app, which means some side-effect to the upgrade broke your setup.

It’s a good thing that you mention the polyfills, because as @Vincent mentioned they should no longer be required, which means our doc needs updating too :). I just ran the demo app depending on the latest @inrupt/solid-client-authn-browser, with Webpack 5.50.0, and things looked like they worked without any additional polyfills. If you were using an older version of the library with Webpack 5, you must have been manually providing a whole bunch of polyfills (besides buffer), some of which related to streams actually, that are no longer required, so maybe removing these from your configuration may help ?

1 Like
5

Hi @aveltens,

Could you please confirm if this is still an issue on your end? Otherwise we will assume this has been resolved on our end.

Thanks,
Nick.-

1 Like
6

Hi, sorry for the late response and thanks for all your replies. I cannot retry currently, will continue my work on it in ~2 weeks.

3 Likes
7

So I continued to work on the upgrade

as @zwifi said @inrupt/solid-client-authn-browser does not need any polyfills, but I am using a bunch of other solid/rdf libraries like rdflib and rdf-dereference that I think need e.g. the buffer polyfill, which was implicitly installed by @inrupt/solid-client-authn-browser and got removed with the upgrade, so I have to install it explicitly.

After doing this I am still getting the ReferenceError: process is not defined error, which seams to occur when processing a quad stream retrieved with rdf-dereference. Maybe other polyfills those libs relied on got removed with the @inrupt/solid-client-authn-browser

The project where I am facing this problem is at GitHub - codecentric/web-clip: A Chrome extension to extract structured data from any web page and store it to a Solid Pod.

8

I got rid of the error by installing process and polyfilling via ProvidePlugin:

new ProvidePlugin({
      process: 'process',
    }),

yet I got some problems left with rdf-dereferene, see Document needed polyfills for webpack 5 · Issue #32 · rubensworks/rdf-dereference.js · GitHub

9

Another issue I am facing with the upgrade:

10

Thanks a lot @fuubi I finally tried the node-polyfill-webpack-plugin after unsuccessfully trying to find out the exact polyfills in need and it seems to resolve all my issues.

2 Likes