Skip to content

AutocompleteElement clearing the input gives an error #375

@Jeroen-chu

Description

@Jeroen-chu

Duplicates

  • I have searched the existing issues

Latest version

  • I have tested the latest version

Current behavior 😯

I have a AutocompleteElement like this.

const languages = [
{ id: 'en', label: 'English' },
{ id: 'de', label: 'Germany' },
etc....
]

After i select an element a cross icon appears. When i click on it my code instantly crashes:

Uncaught TypeError: Cannot read properties of undefined (reading 'substring')
at getNodeParentName (chunk-3TPKUQWQ.js?v=eceb7dac:16:40)
at isNameInFieldArray (chunk-3TPKUQWQ.js?v=eceb7dac:17:53)
at useController (chunk-3TPKUQWQ.js?v=eceb7dac:233:24)
at react-hook-form-mui.js?v=59f51c9c:359:740
at renderWithHooks (chunk-FM2ATDNT.js?v=eceb7dac:11596:26)
at updateForwardRef (chunk-FM2ATDNT.js?v=eceb7dac:14373:28)
at beginWork (chunk-FM2ATDNT.js?v=eceb7dac:15994:22)
at HTMLUnknownElement.callCallback2 (chunk-FM2ATDNT.js?v=eceb7dac:3680:22)
at HTMLUnknownElement.trace (@bugsnag_js.js?v=8589efd8:2319:36)
at Object.invokeGuardedCallbackDev (chunk-FM2ATDNT.js?v=eceb7dac:3705:24)
getNodeParentName @ chunk-3TPKUQWQ.js?v=eceb7dac:16
isNameInFieldArray @ chunk-3TPKUQWQ.js?v=eceb7dac:17
useController @ chunk-3TPKUQWQ.js?v=eceb7dac:233
(anonymous) @ react-hook-form-mui.js?v=59f51c9c:359
renderWithHooks @ chunk-FM2ATDNT.js?v=eceb7dac:11596
updateForwardRef @ chunk-FM2ATDNT.js?v=eceb7dac:14373
beginWork @ chunk-FM2ATDNT.js?v=eceb7dac:15994
callCallback2 @ chunk-FM2ATDNT.js?v=eceb7dac:3680
trace @ @bugsnag_js.js?v=8589efd8:2319
invokeGuardedCallbackDev @ chunk-FM2ATDNT.js?v=eceb7dac:3705
invokeGuardedCallback @ chunk-FM2ATDNT.js?v=eceb7dac:3739
beginWork$1 @ chunk-FM2ATDNT.js?v=eceb7dac:19818
performUnitOfWork @ chunk-FM2ATDNT.js?v=eceb7dac:19251
workLoopSync @ chunk-FM2ATDNT.js?v=eceb7dac:19190
renderRootSync @ chunk-FM2ATDNT.js?v=eceb7dac:19169
performSyncWorkOnRoot @ chunk-FM2ATDNT.js?v=eceb7dac:18927
flushSyncCallbacks @ chunk-FM2ATDNT.js?v=eceb7dac:9166
(anonymous) @ chunk-FM2ATDNT.js?v=eceb7dac:18677Understand this error
ErrorPage.jsx:17 TypeError: Cannot read properties of undefined (reading 'substring')
at getNodeParentName (chunk-3TPKUQWQ.js?v=eceb7dac:16:40)
at isNameInFieldArray (chunk-3TPKUQWQ.js?v=eceb7dac:17:53)
at useController (chunk-3TPKUQWQ.js?v=eceb7dac:233:24)
at react-hook-form-mui.js?v=59f51c9c:359:740
at renderWithHooks (chunk-FM2ATDNT.js?v=eceb7dac:11596:26)
at updateForwardRef (chunk-FM2ATDNT.js?v=eceb7dac:14373:28)
at beginWork (chunk-FM2ATDNT.js?v=eceb7dac:15994:22)
at beginWork$1 (chunk-FM2ATDNT.js?v=eceb7dac:19806:22)
at performUnitOfWork (chunk-FM2ATDNT.js?v=eceb7dac:19251:20)
at workLoopSync (chunk-FM2ATDNT.js?v=eceb7dac:19190:13)
console. @ @bugsnag_js.js?v=8589efd8:2184
ErrorPage @ ErrorPage.jsx:17
renderWithHooks @ chunk-FM2ATDNT.js?v=eceb7dac:11596
mountIndeterminateComponent @ chunk-FM2ATDNT.js?v=eceb7dac:14974
beginWork @ chunk-FM2ATDNT.js?v=eceb7dac:15962
beginWork$1 @ chunk-FM2ATDNT.js?v=eceb7dac:19806
performUnitOfWork @ chunk-FM2ATDNT.js?v=eceb7dac:19251
workLoopSync @ chunk-FM2ATDNT.js?v=eceb7dac:19190
renderRootSync @ chunk-FM2ATDNT.js?v=eceb7dac:19169
performSyncWorkOnRoot @ chunk-FM2ATDNT.js?v=eceb7dac:18927
flushSyncCallbacks @ chunk-FM2ATDNT.js?v=eceb7dac:9166
(anonymous) @ chunk-FM2ATDNT.js?v=eceb7dac:18677Understand this error
ErrorPage.jsx:17 TypeError: Cannot read properties of undefined (reading 'substring')
at getNodeParentName (chunk-3TPKUQWQ.js?v=eceb7dac:16:40)
at isNameInFieldArray (chunk-3TPKUQWQ.js?v=eceb7dac:17:53)
at useController (chunk-3TPKUQWQ.js?v=eceb7dac:233:24)
at react-hook-form-mui.js?v=59f51c9c:359:740
at renderWithHooks (chunk-FM2ATDNT.js?v=eceb7dac:11596:26)
at updateForwardRef (chunk-FM2ATDNT.js?v=eceb7dac:14373:28)
at beginWork (chunk-FM2ATDNT.js?v=eceb7dac:15994:22)
at beginWork$1 (chunk-FM2ATDNT.js?v=eceb7dac:19806:22)
at performUnitOfWork (chunk-FM2ATDNT.js?v=eceb7dac:19251:20)
at workLoopSync (chunk-FM2ATDNT.js?v=eceb7dac:19190:13)
console. @ @bugsnag_js.js?v=8589efd8:2184
ErrorPage @ ErrorPage.jsx:17
renderWithHooks @ chunk-FM2ATDNT.js?v=eceb7dac:11596
mountIndeterminateComponent @ chunk-FM2ATDNT.js?v=eceb7dac:15024
beginWork @ chunk-FM2ATDNT.js?v=eceb7dac:15962
beginWork$1 @ chunk-FM2ATDNT.js?v=eceb7dac:19806
performUnitOfWork @ chunk-FM2ATDNT.js?v=eceb7dac:19251
workLoopSync @ chunk-FM2ATDNT.js?v=eceb7dac:19190
renderRootSync @ chunk-FM2ATDNT.js?v=eceb7dac:19169
performSyncWorkOnRoot @ chunk-FM2ATDNT.js?v=eceb7dac:18927
flushSyncCallbacks @ chunk-FM2ATDNT.js?v=eceb7dac:9166
(anonymous) @ chunk-FM2ATDNT.js?v=eceb7dac:18677Understand this error
chunk-3TPKUQWQ.js?v=eceb7dac:16 Uncaught TypeError: Cannot read properties of undefined (reading 'substring')
at getNodeParentName (chunk-3TPKUQWQ.js?v=eceb7dac:16:40)
at isNameInFieldArray (chunk-3TPKUQWQ.js?v=eceb7dac:17:53)
at useController (chunk-3TPKUQWQ.js?v=eceb7dac:233:24)
at react-hook-form-mui.js?v=59f51c9c:359:740
at renderWithHooks (chunk-FM2ATDNT.js?v=eceb7dac:11596:26)
at updateForwardRef (chunk-FM2ATDNT.js?v=eceb7dac:14373:28)
at beginWork (chunk-FM2ATDNT.js?v=eceb7dac:15994:22)
at HTMLUnknownElement.callCallback2 (chunk-FM2ATDNT.js?v=eceb7dac:3680:22)
at HTMLUnknownElement.trace (@bugsnag_js.js?v=8589efd8:2319:36)
at Object.invokeGuardedCallbackDev (chunk-FM2ATDNT.js?v=eceb7dac:3705:24)
getNodeParentName @ chunk-3TPKUQWQ.js?v=eceb7dac:16
isNameInFieldArray @ chunk-3TPKUQWQ.js?v=eceb7dac:17
useController @ chunk-3TPKUQWQ.js?v=eceb7dac:233
(anonymous) @ react-hook-form-mui.js?v=59f51c9c:359
renderWithHooks @ chunk-FM2ATDNT.js?v=eceb7dac:11596
updateForwardRef @ chunk-FM2ATDNT.js?v=eceb7dac:14373
beginWork @ chunk-FM2ATDNT.js?v=eceb7dac:15994
callCallback2 @ chunk-FM2ATDNT.js?v=eceb7dac:3680
trace @ @bugsnag_js.js?v=8589efd8:2319
invokeGuardedCallbackDev @ chunk-FM2ATDNT.js?v=eceb7dac:3705
invokeGuardedCallback @ chunk-FM2ATDNT.js?v=eceb7dac:3739
beginWork$1 @ chunk-FM2ATDNT.js?v=eceb7dac:19818
performUnitOfWork @ chunk-FM2ATDNT.js?v=eceb7dac:19251
workLoopSync @ chunk-FM2ATDNT.js?v=eceb7dac:19190
renderRootSync @ chunk-FM2ATDNT.js?v=eceb7dac:19169
recoverFromConcurrentError @ chunk-FM2ATDNT.js?v=eceb7dac:18786
performSyncWorkOnRoot @ chunk-FM2ATDNT.js?v=eceb7dac:18932
flushSyncCallbacks @ chunk-FM2ATDNT.js?v=eceb7dac:9166
(anonymous) @ chunk-FM2ATDNT.js?v=eceb7dac:18677Understand this error
ErrorPage.jsx:17 TypeError: Cannot read properties of undefined (reading 'substring')
at getNodeParentName (chunk-3TPKUQWQ.js?v=eceb7dac:16:40)
at isNameInFieldArray (chunk-3TPKUQWQ.js?v=eceb7dac:17:53)
at useController (chunk-3TPKUQWQ.js?v=eceb7dac:233:24)
at react-hook-form-mui.js?v=59f51c9c:359:740
at renderWithHooks (chunk-FM2ATDNT.js?v=eceb7dac:11596:26)
at updateForwardRef (chunk-FM2ATDNT.js?v=eceb7dac:14373:28)
at beginWork (chunk-FM2ATDNT.js?v=eceb7dac:15994:22)
at beginWork$1 (chunk-FM2ATDNT.js?v=eceb7dac:19806:22)
at performUnitOfWork (chunk-FM2ATDNT.js?v=eceb7dac:19251:20)
at workLoopSync (chunk-FM2ATDNT.js?v=eceb7dac:19190:13)
console. @ @bugsnag_js.js?v=8589efd8:2184
ErrorPage @ ErrorPage.jsx:17
renderWithHooks @ chunk-FM2ATDNT.js?v=eceb7dac:11596
mountIndeterminateComponent @ chunk-FM2ATDNT.js?v=eceb7dac:14974
beginWork @ chunk-FM2ATDNT.js?v=eceb7dac:15962
beginWork$1 @ chunk-FM2ATDNT.js?v=eceb7dac:19806
performUnitOfWork @ chunk-FM2ATDNT.js?v=eceb7dac:19251
workLoopSync @ chunk-FM2ATDNT.js?v=eceb7dac:19190
renderRootSync @ chunk-FM2ATDNT.js?v=eceb7dac:19169
recoverFromConcurrentError @ chunk-FM2ATDNT.js?v=eceb7dac:18786
performSyncWorkOnRoot @ chunk-FM2ATDNT.js?v=eceb7dac:18932
flushSyncCallbacks @ chunk-FM2ATDNT.js?v=eceb7dac:9166
(anonymous) @ chunk-FM2ATDNT.js?v=eceb7dac:18677Understand this error
ErrorPage.jsx:17 TypeError: Cannot read properties of undefined (reading 'substring')
at getNodeParentName (chunk-3TPKUQWQ.js?v=eceb7dac:16:40)
at isNameInFieldArray (chunk-3TPKUQWQ.js?v=eceb7dac:17:53)
at useController (chunk-3TPKUQWQ.js?v=eceb7dac:233:24)
at react-hook-form-mui.js?v=59f51c9c:359:740
at renderWithHooks (chunk-FM2ATDNT.js?v=eceb7dac:11596:26)
at updateForwardRef (chunk-FM2ATDNT.js?v=eceb7dac:14373:28)
at beginWork (chunk-FM2ATDNT.js?v=eceb7dac:15994:22)
at beginWork$1 (chunk-FM2ATDNT.js?v=eceb7dac:19806:22)
at performUnitOfWork (chunk-FM2ATDNT.js?v=eceb7dac:19251:20)
at workLoopSync (chunk-FM2ATDNT.js?v=eceb7dac:19190:13)

Expected behavior 🤔

I expect the code not to crash and clear the value of my input.

Steps to reproduce 🕹

Steps:

  1. Create a form with a AutocompleteElement in it
  2. Select a value
  3. Try to clear the value

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions