Skip to content

[BUG] Autocomplete Component TypeError: Cannot read properties of undefined (reading 'map') #1210

@whoisflips

Description

@whoisflips

Development Issue

Yes

Phone Version

3.15.1-beta.2

Issue Description

Issue Description

Problem

The Autocomplete component in the Material-UI library crashes with a TypeError when attempting to render grouped options that are undefined.

Error Message

Cannot read properties of undefined (reading 'map')

Root Cause

In the compiled bundle (index-ebf41f23.js), the Autocomplete component tries to call .map() on the groupedOptions variable without first verifying it's defined. This occurs in the listbox rendering logic.

Problematic pattern (minified):

children:oe.map((Ye,Ta)=>...)  // oe may be undefined

Impact

  • Phone app becomes unresponsive or crashes when using dropdowns/autocomplete fields
  • Affects features like Marketplace listings, contact search, or any component with filtered options
  • Occurs specifically when groupedOptions resolves to undefined during render

Expected Behavior

Component should gracefully render an empty listbox instead of throwing an error.

Actual Behavior

TypeError prevents rendering, breaking user interaction with affected features.


Issue Reproduction


Steps to Reproduce

  1. Launch FiveM and load a server with NPWD v3.15.1-beta.2 installed.

  2. Open the phone by pressing the configured toggle key (default: M).

  3. Navigate to the Marketplace app.

  4. Attempt to create a new listing or search for existing listings using any filter/search field.

  5. Wait for the dropdown/autocomplete component to render with grouped options or filtered results.

  6. Observe the console error when groupedOptions fails to initialize or resolves to undefined during the render cycle.

  7. The phone UI becomes unresponsive or crashes, preventing further interaction with autocomplete-dependent features.


Alternative scenarios that may trigger the issue:

  • Using the Contacts app and searching for contacts with autocomplete enabled
  • Filtering options in any dropdown that uses Material-UI Autocomplete component
  • Rapid toggling of filters that causes groupedOptions to briefly become undefined

Evidence

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'map') (@npwd/dist/html/assets/index-ebf41f23.js:341) Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'map') (@npwd/dist/html/assets/index-ebf41f23.js:341)

Metadata

Metadata

Assignees

No one assigned

    Labels

    New IssueNew Issue to the repo.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions