Kendo-angular: Angular CLI with Kendo Combobox: Build fails with build-optimizer flag turned on

[prabh-62]

I'm submitting a...

• Bug report

Current behavior

• Create a new project with Angular CLI
• Import Angular Kendo Combobox library
• Enable the build-optimizer flag in Angular CLI to optimize the final output dist files
• Build script errors out with kendo Combobox Module

Expected behavior

• Build script should not produce any errors with Kendo Combobox Module

Minimal reproduction of the problem with instructions

> ng new kendo-drop --minimal
> npm install @progress/kendo-angular-{dropdowns,l10n}

In package.json, amend the build script

"build": "ng build --target production --aot true --build-optimizer true --stats-json true"

In app.module.ts, replace code with this snippet

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    DropDownsModule,
    FormsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

In app.component.ts, add this code (Copied from official docs)

@Component({
  selector: 'my-app',
  template: `
    <div class="example-config">
      <input id="ac" type="checkbox" [(ngModel)]="allowCustom">
      <label for="ac">Allow custom values</label>
    </div>
    <div class="example-wrapper">
    <p>Favorite sport:</p>
    <kendo-combobox [data]="listItems" [allowCustom]="allowCustom">
    </kendo-combobox>
    </div>
  `
})
class AppComponent {
    public allowCustom: boolean = true;
    public listItems: Array<string> = ["Baseball", "Basketball", "Cricket", "Field Hockey", "Football", "Table Tennis", "Tennis", "Volleyball"];
}

Now run the build script

> npm run build

ERROR in ./node_modules/rxjs/observable/BoundCallbackObservable.js
Module build failed: TypeError: Cannot read property 'type' of undefined

What is the motivation or use case for changing the behavior?

Build-optimizer reduces the size of final output files by a large margin and I would like to keep it turned on

Environment

Package versions:

npm ls --depth 0

├── @angular/[email protected]
├── @angular/[email protected]
├── @angular/[email protected]
├── @angular/[email protected]
├── @angular/[email protected]
├── @angular/[email protected]
├── @angular/[email protected]
├── @angular/[email protected]
├── @angular/[email protected]
├── @angular/[email protected]
├── @angular/[email protected]
├── @angular/[email protected]
├── @progress/[email protected]
├── @progress/[email protected]
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected]

Browser:

• Chrome (desktop) version 62.0.3192.0

System:

• TypeScript version: 2.4.2
• Node version: v8.4.0 (NPM v5.3.0)
• Angular CLI: v1.3.1
• Platform: Ubuntu 16.04.3 LTS

[tsvetomir]

The only thing that seems to help is downgrading Typescript to 2.4.0:

npm install --save-dev [email protected]

The problem seems to be caused by a code fragment bundled in rxjs. I'll try to extract a minimal reproduction sample out of and file with the Typescript project.

[tsvetomir]

Logged the issue as Microsoft/TypeScript#18011

[tsvetomir]

Should be fixed in Typescript v2.5.1

[prabh-62]

Thank you for investigating @tsvetomir!