Mi prueba de unidad no pasa debido a este error: "Error: no se pueden leer las propiedades de undefined (leyendo 'nativeElement')". Creo que el problema es una burla incorrecta de ViewChildren, pero no sé cómo hacerlo bien. ¿Puede alguien por favor ayudar a arreglarlo?
t
@ViewChildren('locationInput') inputs: QueryList<ElementRef>; addCity(): void { this.items = this.locationForm.get('items') as FormArray; if (this.regionSelected && this.checkIfAllCitysAreSelected()) { this.items.push(this.createItem()); this.quantityOfLocations++; this.cdr.detectChanges(); const tempInput = this.inputs.toArray()[this.quantityOfLocations - 1].nativeElement; this.tempAutocomplete = new google.maps.places.Autocomplete(tempInput, this.localityOptions); this.tempAutocomplete.setBounds(this.regionBounds); this.tempAutocomplete.setOptions(this.localityOptions); this.autocomplete.push(this.tempAutocomplete); this.addEventToAutocomplete(this.quantityOfLocations - 1); }}
especificaciones
it('method addCity should add new item and add autocomplete', async(() => { let array: FormGroup[] = []; array.push(mockedForm); let formArray = new FormArray(array); component.locationForm = new FormGroup({ items: formArray }); const spy = spyOn(component, 'addEventToAutocomplete'); spyOn(component, 'checkIfAllCitysAreSelected').and.returnValue(true); component.regionSelected = true; fixture.detectChanges(); component.inputs[1] = new ElementRef({ nativeElement: { value: 'fake' } }); component.addCity(); expect(component.quantityOfLocations).toBe(1); expect((component.locationForm.controls['items'] as FormArray).length).toBe(2); expect(component.tempAutocomplete).toBeTruthy(); expect(spy).toHaveBeenCalled(); }));¡Gracias por la ayuda!
El problema ocurre con los cambios en el elemento ViewChildren. Se puede resolver fácilmente en lugar de:
@ViewChildren('locationInput') inputs: QueryList<ElementRef>;a:
@ViewChildren('locationInput', {static: true}) inputs: QueryList<ElementRef>;debería resolver tu problema.