Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

bug(aria/combobox): ComboboxPopup throws NG0950 when destroyed before its first change detection

Cerrado Apto para principiantes
  • ¿Algo no está bien?
#33,972 0 comentarios 0 reacciones 0 asignados Ver en GitHub

Los mantenedores suelen responder en 1 día

@lazerg ya está trabajando en esto.

Desde el 20/10/2026.

  • #33974 de @lazerg — abierto

Evaluación

Dificultad
2/5
Tiempo estimado
1-3 horas
Aptitud para principiantes
78/100
Tipo de issue
Error
Claridad
Bien especificado
Estado de actividad
Activo
Stack tecnológico
angular, typescript
Área
accessibility, frontend

Línea de trabajo

Empieza en src/aria/combobox/combobox-popup.ts, especialmente en ngOnDestroy, y revisa el registro del ciclo de vida y el comportamiento de teardown del componente. Reproduce el problema con la prueba proporcionada, que crea un fixture y lo destruye sin ejecutar la detección de cambios. El objetivo se cumple cuando el teardown deja de leer un input obligatorio sin establecer y la prueba pasa.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

area: aria/combobox gemini-triaged
Is this a regression?
  • Yes, this behavior used to work in the previous version
The previous version in which this bug was not present was

No response

Description

ComboboxPopup.ngOnDestroy calls this.combobox()._unregisterPopup(). The combobox input is input.required(). If the view that holds the popup is destroyed before its first update pass, the input was never set, and reading it throws NG0950: Input "combobox" is required but no value is available yet. Angular reports this as "Error during cleanup of component", and in tests it fails the test ("1 fixture threw errors during cleanup").

This happens in any unit test that creates a component containing a combobox and does not run change detection before teardown, for example a plain "should create" test, or a test that only checks providers.

Reproduction
import { Component } from '@angular/core';
import { TestBed } from '@angular/core/testing';
import { Combobox, ComboboxPopup, ComboboxWidget } from '@angular/aria/combobox';
import { Listbox, Option } from '@angular/aria/listbox';

@Component({
  imports: [Combobox, ComboboxPopup, ComboboxWidget, Listbox, Option],
  template: `
    <div ngCombobox #combobox="ngCombobox" tabindex="0">Pick one</div>
    <ng-template ngComboboxPopup [combobox]="combobox">
      <div ngListbox ngComboboxWidget #listbox="ngListbox" focusMode="activedescendant"
        [activeDescendant]="listbox.activeDescendant()">
        <div ngOption value="alpha" label="alpha">alpha</div>
      </div>
    </ng-template>
  `,
})
class Repro {}

it('destroys cleanly before the first change detection', () => {
  const fixture = TestBed.createComponent(Repro);
  expect(() => fixture.destroy()).not.toThrow();   // throws NG0950
});
Expected Behavior

Destroying the popup without a first change detection does nothing (there is nothing to unregister).

Actual Behavior

NG0950: Input "combobox" is required but no value is available yet, from ComboboxPopup.ngOnDestroy (src/aria/combobox/combobox-popup.ts, line 67 on main).

A possible fix: register in ngOnInit and keep the registered combobox in a field, then unregister that field (if set) in ngOnDestroy, instead of reading the input again.

Workaround: wrap the ng-template ngComboboxPopup in @if (combobox) { … }, so the popup is only created in an update pass.

Environment
  • Angular: 22.2.1
  • CDK/Material: @angular/cdk 22.2.3, @angular/aria 22.2.3 (also in 22.3.0-next.2 and main)
  • Browser(s): any (seen in Vitest with happy-dom)
  • Operating System (e.g. Windows, macOS, Ubuntu): macOS
Lenguaje dominante
TypeScript
Estrellas
25k
Forks
6.8k
Merge medio
1 d 7 h
PR fusionados (30 d)
69

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de angular/components

Todos los issues de angular/components

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.