ReferenceError: process is not defined

[felpel]

Update: seems to be related to #326

Package Version: 1.2.0

Browser
- name/version: Chrome 71, Firefox 64

Describe the bug
After updating autorest.typescript in our Angular application (v7.2.0) to its current latest version, I had to bump ms-rest-js to 1.2.0. After dealing with compilation errors, I'm getting the following runtime error (Chrome's stacktrace):

core.js:15714 ERROR Error: Uncaught (in promise): ReferenceError: process is not defined
ReferenceError: process is not defined
    at getPlatformSpecificData (msRestUserAgentPolicy.js:11)
    at Module.getDefaultUserAgentValue (userAgentPolicy.js:25)
    at SearchServiceContext [as constructor] (searchServiceContext.ts:30)
    at new SearchService (searchService.ts:20)
    at SearchServiceFactory.push../src/app/core/http/factories/search-service.factory.ts.SearchServiceFactory.create (search-service.factory.ts:36)
    at SearchServiceProxy.<anonymous> (search-service.proxy.ts:204)
    at step (tslib.es6.js:97)
    at Object.next (tslib.es6.js:78)
    at tslib.es6.js:71
    at new ZoneAwarePromise (zone.js:910)
    at resolvePromise (zone.js:831)
    at zone.js:741
    at Object.<anonymous> (zone.js:757)
    at Object.<anonymous> (deferred.js:67)
    at _Deferred._promise.(anonymous function) [as fail] (http://localhost:4200/vendor.js:186114:25)
    at _Deferred.<anonymous> (deferred.js:62)
    at Array.forEach (<anonymous>)
    at _Deferred._promise.then (deferred.js:60)
    at resolvePromise (zone.js:792)
    at zone.js:892

To Reproduce
Not sure exactly how it can be exactly reproduced since the code is autogenerated based on my API, but at least have the following dependencies for Autorest's generation.

A previous call made to one of the generated API method is triggering this error.

Expected behavior
I should be able to use the tool without trying to set a polyfill for process as it would be suggested here or define it on the window as suggested here

Screenshots
N/A

Additional context

node : 8.11.3
ng : 7.2.0

[kpajdzik]

Does it happen in the latest version? 1.5.x or newer?

[felpel]

I could verify with the Autorest people, but I think they recommend to use the versions defined in the compatibility in their README for the desired version. For their latest versions, they are referencing @azure/ms-rest: ^1.2, so I could try to update to those versions and see if the bug happens or not since the caret would allow anything below 2.0.

[kpajdzik]

@felpel, as we own autorest.typescript as well, I'll verify and update the @azure/ms-rest-js version there as well. If you could try updating it manually and see if it reproduces in the meantime, I'd appreciate it.

[felpel]

Even at 1.6.0, I'm still getting errors. The error message is identical, but the stack trace is different.

ERROR Error: Uncaught (in promise): ReferenceError: process is not defined
ReferenceError: process is not defined
    at loadEnvironmentProxyValue (proxyPolicy.js:8)
    at getDefaultProxySettings (proxyPolicy.js:27)
    at createDefaultRequestPolicyFactories (serviceClient.js:302)
    at SearchService.ServiceClient (serviceClient.js:50)
    at SearchServiceContext [as constructor] (searchServiceContext.ts:34)
    at new SearchService (searchService.ts:20)
    at SearchServiceFactory.push../src/app/core/http/factories/search-service.factory.ts.SearchServiceFactory.create (search-service.factory.ts:36)
    at SearchServiceProxy.<anonymous> (search-service.proxy.ts:202)
    at step (tslib.es6.js:97)
    at Object.next (tslib.es6.js:78)
    at loadEnvironmentProxyValue (proxyPolicy.js:8)
    at getDefaultProxySettings (proxyPolicy.js:27)
    at createDefaultRequestPolicyFactories (serviceClient.js:302)
    at SearchService.ServiceClient (serviceClient.js:50)
    at SearchServiceContext [as constructor] (searchServiceContext.ts:34)
    at new SearchService (searchService.ts:20)
    at SearchServiceFactory.push../src/app/core/http/factories/search-service.factory.ts.SearchServiceFactory.create (search-service.factory.ts:36)
    at SearchServiceProxy.<anonymous> (search-service.proxy.ts:202)
    at step (tslib.es6.js:97)
    at Object.next (tslib.es6.js:78)
    at resolvePromise (zone.js:831)
    at zone.js:741
    at Object.<anonymous> (zone.js:757)
    at Object.<anonymous> (deferred.js:67)
    at _Deferred._promise.(anonymous function) [as fail] (http://localhost:4200/vendor.js:187886:25)
    at _Deferred.<anonymous> (deferred.js:62)
    at Array.forEach (<anonymous>)
    at _Deferred._promise.then (deferred.js:60)
    at resolvePromise (zone.js:792)
    at zone.js:892

If I install the process package and add it in our polyfills, the error is gone (was not the case at 1.2.0):

import * as process from "process";

(window as any).process = process;

However, even if it might be an acceptable workaround, the Angular team removed the shims for Node's global types in v6.0 because those types are not meant to be used in the browser.

[kpajdzik]

Is the Angular app run in a browser or Node.js? Can you share a sample project for that?

[felpel]

The application is run in a browser. I don't want to leak important details about any of our API in production, but I could try to generate a dummy service, use its generated Swagger definitions with Autorest and finally check if the error occurs without the polyfill.

Let me check if I can create a sample project for you.

[felpel]

@kpajdzik I've generated a new Angular application at its latest version with the minimal stuff at felpel/reproc on the master branch. Run in order:

• npm install -g @angular/cli@latest;
• npm install;
• ng serve

You should see the reference error in the console. I've also made a separate process branch with the following patches and the sample is now working.

[kpajdzik]

@felpel Thanks so much for the project! I followed the described steps and I get Compiled successfully message.

Should this fail before? Nothing really happens afterwards.

[felpel]

@kpajdzik forgot to mention to open your browser at http://localhost:4200, you should see the error right away in the browser's console

[kpajdzik]

I can see that the project uses Node.js bundle. This bundle assumes it is run out of the browser so modules like process are available. The browser bundle is loaded usually like this in the browser. In the sample project, all I can see is package.json file (which is fine) and then simple import * as msRest from "@azure/ms-rest-js"; which I'm not surprised, loads Node.js specific code.

I don't know Angular too well, is there any way to force it to load the browser bundle (i.e. msRest.browser.js)?

[JaredPotter]

Is there any progress on this issue? I'm currently experiencing this issue with my Angular project.

[kpajdzik]

Is there any progress on this issue? I'm currently experiencing this issue with my Angular project.

How do you import ms-rest-js into your Angular project?

[eruslan44]

Is there any progress on this issue? I'm currently experiencing this issue with my Angular project.

Hi! Tell me, please, did you manage to solve this problem?

[r3dDoX]

I had the same problem using stencil.js and autorest. After searching for a while I found out that since stencil uses rollup to bundle, it doesn't provide node globals per default. Tools like webpack and browserify seem to provide globals such as "process" during bundling by default.
For rollup there is the "rollup-plugin-node-polyfills" plugin, which does exactly this and fixes the problem for me.