Skip to content

Account-level People page role filter throws JS error and fails to filter — UsersPane.jsx missing null-check on search_term #2656

Description

@pcrtexas

Describe the bug

On the Account > People page, selecting a role from the "Filter by role" dropdown throws an uncaught JavaScript error and the filter does not apply. This occurs with default, unmodified Canvas roles — no custom roles involved.

Console Error

Uncaught TypeError: Cannot read properties of undefined (reading 'length')
at Object.onUpdateFilters (UsersPane.jsx:129:49)
at Object.onChange (UsersToolbar.jsx:48:11)
at handleSelectOption (index.js:1572:22)
at onRequestSelectOption (index.js:278:89)
at index.js:242:93
at Object.eB (react-dom.production.min.js:54:317)
at eH (react-dom.production.min.js:54:471)
at react-dom.production.min.js:55:35
at re (react-dom.production.min.js:55:136)
at rt (react-dom.production.min.js:106:380)

Root Cause (identified via breakpoint debugging)
Set a breakpoint at UsersPane.jsx:129 and inspected the call. When the change originates from the role dropdown, the searchFilter argument passed into onUpdateFilters contains only the changed key:

searchFilter:
role_filter_id: "3"

It does not include a search_term key. However, onUpdateFilters appears to unconditionally access searchFilter.search_term.length at line 129 (the failing local variable is named termLength, and its value showed as undefined in the paused scope). Since search_term is absent from the object (not just empty), accessing .length on it throws.

This suggests the handler assumes every call to onUpdateFilters will include a search_term field — which holds true when the change originates from the search box, but not when it originates from the role dropdown, which only passes the field that changed. The likely fix is a null/undefined check before accessing .length, e.g. searchFilter.search_term?.length or falling back to this.state.search_term when search_term is absent from the incoming filter object.

Environment

Browser: Chrome (desktop)
Roles tested: default Canvas roles only, no custom roles
Reproduced in incognito with no extensions active, ruling out client-side interference
Account-level People page specifically (have not tested course-level People page)

Impact
Account admins cannot filter the People list by role at all — every role selection throws this error, blocking a core admin workflow.

Screenshots or screen recordings

No response

Steps to reproduce

Steps to Reproduce

Log in as an account admin.
Navigate to Account > People.
Without typing anything in the search box, click the role filter dropdown and select any role.
Observe: the dropdown selection appears to do nothing, and the console shows an uncaught error.

Expected Behavior
The user list filters to show only users with the selected role.

Actual Behavior
An uncaught TypeError is thrown and the list does not filter.

What browsers are you seeing the problem on (if applicable)?

Chrome

Backtrace

Uncaught TypeError: Cannot read properties of undefined (reading 'length')
    at Object.onUpdateFilters (UsersPane.jsx:129:49)
    at Object.onChange (UsersToolbar.jsx:48:11)
    at handleSelectOption (index.js:1572:22)
    at onRequestSelectOption (index.js:278:89)
    at index.js:242:93
    at Object.eB (react-dom.production.min.js:54:317)
    at eH (react-dom.production.min.js:54:471)
    at react-dom.production.min.js:55:35
    at re (react-dom.production.min.js:55:136)
    at rt (react-dom.production.min.js:106:380)

Relevant log output

Browser console (Chrome, DevTools):

Uncaught TypeError: Cannot read properties of undefined (reading 'length')
    at Object.onUpdateFilters (UsersPane.jsx:129:49)
    at Object.onChange (UsersToolbar.jsx:48:11)
    at handleSelectOption (index.js:1572:22)
    at onRequestSelectOption (index.js:278:89)
    at index.js:242:93
    at Object.eB (react-dom.production.min.js:54:317)
    at eH (react-dom.production.min.js:54:471)
    at react-dom.production.min.js:55:35
    at re (react-dom.production.min.js:55:136)
    at rt (react-dom.production.min.js:106:380)

No other console warnings or errors present before or after this error.
No failed network requests observed in the Network tab at the time of the error — 
the error appears to fire client-side, before any API request to fetch filtered 
results is dispatched.

Debugger inspection (breakpoint at UsersPane.jsx:129):
When the change originates from the role filter dropdown, the `searchFilter` 
argument passed to onUpdateFilters contains only:
  { role_filter_id: "3" }
No `search_term` key is present on the object. The local variable `termLength` 
evaluates to `undefined` at the point of failure, consistent with the handler 
attempting to read `searchFilter.search_term.length` without checking that 
`search_term` exists on the incoming object.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions