Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dropdown - Error is thrown when selecting value in dropdown #15791

Open
sara-amani opened this issue Jun 5, 2024 · 0 comments
Open

Dropdown - Error is thrown when selecting value in dropdown #15791

sara-amani opened this issue Jun 5, 2024 · 0 comments
Labels
Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible

Comments

@sara-amani
Copy link

sara-amani commented Jun 5, 2024

Describe the bug

Sometimes when selecting a value in the dropdown I get this error in the console

TypeError: Cannot read properties of undefined (reading 'producerNode')
at assertConsumerNode (core.mjs:2578:5)
at producerRemoveLiveConsumerAtIndex (core.mjs:2570:9)
at consumerAfterComputation (core.mjs:2471:13)
at Object.producerRecomputeValue (core.mjs:2654:13)
at producerUpdateValueVersion (core.mjs:2408:10)
at Dropdown.computed [as label] (core.mjs:2598:9)
at get inputClass (primeng-dropdown.mjs:626:28)
at _class2_span_2_Template (primeng-dropdown.mjs:73:84)
at executeTemplate (core.mjs:11966:13)
at refreshView (core.mjs:13461:13)

The options for the dropdown is always defined and hardcoded even before the onInit life cycle. The strange this is that it is only when selecting certain values in the dropdown that this error happens and it has happened in multiple dropdowns with different types of options. The thing that seems to prevent the bug from happening is to add *ngIf="options.length" but it shouldn't be needed since they are never undefined.

Environment

I use angular with the primeNG library and the issue happens in all browsers.

Reproducer

No response

Angular version

16.2.5

PrimeNG version

16.9.1

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.16.1

Browser(s)

ALL

Steps to reproduce the behavior

  1. Initialize the dropdown like this, it doesn't matter if you use ngModel or formcontrol, the issue happens either way
const formats = [
  { name: 'string', displayName: 'String' },
  { name: 'date', displayName: 'Date' },
  { name: 'number', displayName: 'Number' },
  { name: 'percent', displayName: 'Percent' },
  { name: 'currency', displayName: 'Currency' },
  { name: 'decimal', displayName: 'Decimal' },
  { name: 'time', displayName: 'Time' },
  { name: 'seconds', displayName: 'Duration' },
]
<p-dropdown
  formControlName="format"
  [options]="formats"
  optionLabel="displayName"
  optionValue="name"
></p-dropdown>
  1. Select values from the dropdown until the error is thrown in the console.

Expected behavior

I expect the error not to be thrown and crash the entire page and instead the value to be selected in the dropdown.

@sara-amani sara-amani added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Jun 5, 2024
@sara-amani sara-amani changed the title Component: Dropdown Component: Dropdown - Error is thrown when selecting value in dropdown Jun 5, 2024
@sara-amani sara-amani changed the title Component: Dropdown - Error is thrown when selecting value in dropdown Dropdown - Error is thrown when selecting value in dropdown Jun 5, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible
Projects
None yet
Development

No branches or pull requests

1 participant