Angular compiler seemingly false negative warning : optional chaining refused on array item

[Nenrikido]

Which @angular/* package(s) are the source of the bug?

compiler

Is this a regression?

No

Description

Hi !
I'm getting a warning telling me i can safely replace ?. with . on an array item, but if this array item isn't there (or the array is empty), then i need the safe call

Here's a code sample :

<mat-select [(ngModel)]="fleets" (selectionChange)="updateFleets()" multiple>
  <mat-select-trigger>
    {{ fleets[0]?.label || '' }}
    @if (fleets.length > 1) {
      <span class="example-additional-selection">
  (+{{ fleets.length - 1 }} {{ fleets.length === 2 ? 'autre' : 'autres' }})
</span>
    }
  </mat-select-trigger>
  @for (fleet of fleetList; track fleet) {
    <mat-option [value]="fleet">{{ fleet.label }}</mat-option>
  }
</mat-select>

Here, fleets is of type Fleet[] so fleets[0] can be either Fleet or undefined but i get the warning (shown below) anyway.

For now i've worked around the warning by doing that :

@if (fleets.length > 0) {
  {{ fleets[0].label }}
}

But i feel like this should be adressed anyway.

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

▲ [WARNING] NG8107: The left side of this optional chain operation does not include 'null' or 'undefined' in its type, therefore the '?.' operator can be replaced with the '.' operator. [plugin angular-compiler]

    src/pages/dashboard/dashboard.component.html:35:26:
      35 │             {{ fleets[0]?.label || '' }}
         ╵                           ~~~~~

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 17.3.5
Node: 18.14.2
Package Manager: npm 9.5.0
OS: win32 x64

Angular: 17.3.5
... animations, cdk, cli, common, compiler, compiler-cli, core
... forms, material, platform-browser, platform-browser-dynamic
... router, service-worker

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1703.5
@angular-devkit/build-angular   17.3.5
@angular-devkit/core            17.3.5
@angular-devkit/schematics      17.3.5
@schematics/angular             17.3.5
rxjs                            7.8.1
typescript                      5.2.2
zone.js                         0.14.4

Anything else?

No response

[JeanMeche]

This is likely due to noUncheckedIndexedAccess being false in your config.

TS playground demo

[JoostK]

Duplicate of #46918. This indeed depends on the noUncheckedIndexedAccess TypeScript option, which is typically false, but introduces inaccurate types where the potential for undefined is missing from the type. Angular's diagnostic is entirely based on the type system, so if that is inaccurate then the diagnostic will be inaccurate.

[Nenrikido]

This is likely due to noUncheckedIndexedAccess being false in your config.

TS playground demo

Oh, thanks for that, i didn't know about this option

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}