ngOnInit is not respecting inheritance with AOT when base class is from an external librairy using barrel files #22825

I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report  
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

When

• I have a component base class (SimpleCoreComponent1) coming from an external npm library that implements ngOnInit
• AND that class has been exported via barrel files (index.ts)
• BUT that barrel file has been exported via implicit refererence to index.ts (export * from './components1'; instead of export * from './components1/index';)
• AND I have an angular app with component (ForumsComponent) that extends SimpleCoreComponent1
• BUT i didn't explicitly reimplement the ngOnInit in the ForumsComponent
• AND i run the app with AOT enabled (ng server --aot)

Then

• the ngOnInit of the base class is not invoked .

Expected behavior

Lifecycle hooks (ngOnInit, ngOnDestroy, etc) must be invoked even if the base class is defined in an external npm package using barrel files with index.ts not explicitly stated.

Minimal reproduction of the problem with instructions

STEPS TO REPRODUCE

Create the angular library

Note: Sample projet library source code available on github

1. Setup library projet using yeoman

npm install -g yo@2.0.0
npm install -g generator-ngx-library@5.4.0
mkdir demolibraryforaot
cd demolibraryforaot
yo ngx-library

2. Create this directory structure:

src
|- index.ts
|- Components1
   |- index.ts
   |- simple-core-component.ts
|- Components2
   |- index.ts
   |- simple-core-component.ts
   

3. Write the following code:

// src/index.ts
export * from './components1';        // BUG: This export WON'T have the right .metadata.json exported:
export * from './components2/index';  // This export will have the right .metadata.json exported:

// src/Components1/index.ts
export * from './simple-core-component';

// src/Components1/simple-core-component.ts
import { OnInit } from '@angular/core';

export class SimpleCoreComponent1 implements OnInit {
    ngOnInit(): void {
        console.log('SimpleCoreComponent1.ngOnInit');
    }
}

// src/Components2/index.ts
export * from './simple-core-component';

// src/Components2/simple-core-component.ts
import { OnInit } from '@angular/core';

export class SimpleCoreComponent2 implements OnInit {
    ngOnInit(): void {
        console.log('SimpleCoreComponent2.ngOnInit');
    }
}

4. Create a package

npm run start
# Ignore the code coverage error
cd dist
npm pack

Create the angular app

Note: Sample projet source code available on github

1. Create an angular app beside the angular library

ng new angular-inh-aot-bug

2. Install dependencies

cd angular-inh-aot-bug
npm install

3. Install the npm package in the angular app

# Using locally built package:
npm install --save ../demolibraryforaot/dist/demolibraryforaot-0.0.1.tgz

4. Create a component in the angular app

cd src/app
ng generate component ForumsComponent

5. Edit ForumsComponent to extends SimpleCoreComponent1

import { Component } from '@angular/core';
import { SimpleCoreComponent1 } from 'demolibraryforaot';

@Component({
  selector: 'app-forums',
  templateUrl: './forums.component.html',
  styleUrls: ['./forums.component.css']
})
export class ForumsComponentWithoutIndex extends SimpleCoreComponent1 {
}

6. Add the ForumsComponent to the AppComponent.html:

<app-forums></app-forums>

7. Start with AOT:

ng serve --aot 

8. Open browser and see the base class ngOnInit is not invoked (no logs in the console)
   Open http://localhost:4200 in chrome

Now extends SimpleCoreComponent2 instead of SimpleCoreComponent1

Look at the console log: you'll see the ngOnInit is now invoked. The reason seems to be that the .metadata.json of the library is OK when we have the /index in the export of the barrel file.

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

We have a lot of angular projects expected to start in the near future. We want to be able to extract some of the good recipes teams develops in a common librairy to help cross-project collaboration.

That bug is 'nasty', as it's easy to do this kind of error, and not obvious for people investigating that bug why their code is not invoked.

Environment

Angular version: 5.2.8

Browser:
- [x] Chrome (desktop) version 64.0.3282.186 
- [ ] Chrome (Android) version XX
- [ ] Chrome (iOS) version XX
- [ ] Firefox version XX
- [ ] Safari (desktop) version XX
- [ ] Safari (iOS) version XX
- [ ] IE version XX
- [ ] Edge version XX
 
For Tooling issues:
- Node version: 5.6.0
- Platform:  Windows

Others: