[Bug] Angular InstantSearch component does not work with Angular CLI v6

[prabh-62]

I'm submitting a...

• Bug report

Current behavior

Algolia InstantSearch Angular component does not work with Angular CLI v6

Expected behavior

Algolia InstantSearch Angular component should work with Angular CLI v6

Minimal reproduction of the problem with instructions

> ng version
	- Angular CLI: 6.0.0-beta.4
> ng new instantsearch-test
	- (Now setup Algolia InstantSearch component as described here: https://community.algolia.com/angular-instantsearch/getting-started.html)

> yarn start

Open Chrome browser and enable devtools. We receive an error "process is not defined" in Console

Apparently, there was a breaking change in Angular CLI - Read this Comment

Reference: angular/angular-cli#9827

Environment

Package versions:

npm ls --depth 0
+-- @angular/animations@6.0.0-beta.6
+-- @angular/cli@6.0.0-beta.4
+-- @angular/common@6.0.0-beta.6
+-- @angular/compiler@6.0.0-beta.6
+-- @angular/compiler-cli@6.0.0-beta.6
+-- @angular/core@6.0.0-beta.6
+-- @angular/forms@6.0.0-beta.6
+-- @angular/http@6.0.0-beta.6
+-- @angular/language-service@6.0.0-beta.6
+-- @angular/platform-browser@6.0.0-beta.6
+-- @angular/platform-browser-dynamic@6.0.0-beta.6
+-- @angular/router@6.0.0-beta.6
+-- @types/jasmine@2.8.6
+-- @types/jasminewd2@2.0.3
+-- @types/node@8.9.4
+-- angular-instantsearch@1.0.1
+-- codelyzer@4.1.0
+-- core-js@2.5.3
+-- html-webpack-plugin@2.30.1 extraneous
+-- jasmine-core@3.1.0
+-- jasmine-spec-reporter@4.2.1
+-- karma@2.0.0
+-- karma-chrome-launcher@2.2.0
+-- karma-coverage-istanbul-reporter@1.4.1
+-- karma-jasmine@1.1.1
+-- karma-jasmine-html-reporter@0.2.2
+-- protractor@5.3.0
+-- rxjs@5.5.6
+-- ts-node@5.0.0
+-- tslint@5.9.1
+-- typescript@2.6.2
`-- zone.js@0.8.20

Browser:

• Chrome (desktop) version 64.0.3282.186

System:

• TypeScript version: 2.6.2 (strict mode ON)
• Node version: 8.9.4
• Platform: Windows 10 Pro 1709

[iam4x]

Hi @prabh-62

Thank you for your feedback, I'm not sure what to do here since the CLI v6 is still in beta and will change.

I'll wait for a RC before making changes to support the CLI v6. In the meantime I would recommend to stay with the v1.x

[iam4x]

And thank you to pointing me directly to the comment, this is the root cause about process not defined by the CLI anymore.

[mwawrusch]

!!process && .... should probably do the trick to fix this.

[Haroenv]

Yes, but the use of process here is in a downstream dependency. It would probably be best to add the serialising of process.env in your angular settings for now to make sure no error happens

[markudevelop]

This bug still exists and it's a problem

[Haroenv]

See algolia/algoliasearch-client-javascript#692 and algolia/algoliasearch-client-javascript#691. Could you try that out or give a reproducible project please?

[Haroenv]

My PR to the API client was insufficient due to some complications with our build process, but the workaround you can use in your app is adding this to polyfills.ts:

(window as any).process = {
  env: { DEBUG: undefined },
};

[markudevelop]

@Haroenv awesome this works that's good enough for me thanks!

[iam4x]

Angular InstantSearch v2.0.0 is released, you can now use Angular v6.0.0 with the polyfill.ts workaround from @Haroenv

This is documented on the Getting started and Migration guide