typescript - Importul din Barrel pare să afecteze ordinea de încărcare
Am un component pe care încerc să îl testez unit, dar continui să primesc aceste erori, în funcție de declarațiile mele de import:
Error: Cannot resolve all parameters for 'MyComponent'(undefined, FormBuilder).
TypeError: Cannot read property 'toString' of undefined
Componenta mea ia 2 parametri, unul FormBuilder și unul un serviciu personalizat, care trebuie injectat:
import {MyService} from '../';
@Component({
...,
providers: [MyService]
})
class MyComponent {
constructor(service: MyService, fb: FormBuilder) { ... }
...
}
Și testul meu de unitate este configurat după cum urmează:
import {MyComponent} from './';
import {MyService} from '../';
describe('Component: MyComponent', () => {
let builder: TestComponentBuilder;
beforeEachProviders(() => [
MyService,
MyComponent
]);
beforeEach(inject([TestComponentBuilder], function (tcb: TestComponentBuilder) {
builder = tcb;
}));
it('should inject the component', inject([MyComponent],
(component: MyComponent) => {
expect(component).toBeTruthy();
})
);
}
Se pare că problema sunt importurile, deoarece încerc să folosesc bariluri:
|
|- my-component
| |- index.ts
| |- my.component.ts
| |- my.component.spec.ts
|
|- my-service
| |- index.ts
| |- my.service.ts
|
|- index.ts
În interiorul fișierelor mele index.ts, fac:
export * from '<filename>';
export * from '<directory>';
după caz.
Totuși, când schimb importurile în testul unitar ȘI în componentă pentru a face referire direct la fișierul serviciului, testul unitar funcționează.
import {MyService} from '../my-service/my.service';
Folosesc angular-cli în acest proiect și SystemJS este configurat cu fișierul de configurare generat de acesta:
...
const barrels: string[] = [
...,
// App specific barrels.
'app',
'app/my-service',
'app/my-component'
/** @cli-barrel */
];
const cliSystemConfigPackages: any = {};
barrels.forEach((barrelName: string) => {
cliSystemConfigPackages[barrelName] = { main: 'index' };
});
/** Type declaration for ambient System. */
declare var System: any;
// Apply the CLI SystemJS configuration.
System.config({
map: {
'@angular': 'vendor/@angular',
'rxjs': 'vendor/rxjs',
'main': 'main.js'
},
packages: cliSystemConfigPackages
});
...
Se pare că atunci când import din butoaie, definițiile componentelor și serviciilor nu sunt încărcate înainte de codul testului unitar. Aplicația în sine se va transpila și rula, oricum.
Îmi pare rău dacă aceasta este o întrebare prea generală, dar sunt încă destul de nou la barile și SystemJS și nu știu cum să restrâng mai mult domeniul:
Este aceasta o eroare cu SystemJS/Jasmine/TypeScript/Angular2 sau fac eu ceva greșit în configurația mea?
Răspuns #1
Ar trebui să văd conținutul butoaielor pe care le importați pentru a ști cu siguranță, dar pare că trebuie să schimbați ordinea exporturilor din butoiul dumneavoastră.
O problemă în depozitul angular2 există aici: https://github.com/angular/angular/issues/9334
Dacă un component (A) importă și folosește un serviciu/component (B) dintr-un barrel care conține exporturile ambelor A și B, și A apare înaintea lui B în barrel, valoarea importată a lui B este nedefinită.
Așadar, în cazul tău, dacă modifici fișierul tău root index.ts astfel, ar trebui să poți importa din containerele tale.
export * from my-service;
export * from my-component;
