question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[TextField] `dispatcher.useId` is not a function in React 18

See original GitHub issue

Duplicates

  • I have searched the existing issues

Latest version

  • I have tested the latest version

Current behavior 😯

When rendering the <TextField /> component in a React 18 project (e.g. in BlitzJS), following error is shown:

TypeError
dispatcher.useId is not a function

useId
[https://yeev72.csb.app/node_modules/react/cjs/react.development.js:1697:21]()
useId@https://yeev72.csb.app/node_modules/
[mui/utils/esm/useId.js:22:21]()
TextField@https://yeev72.csb.app/node_modules/
[mui/material/TextField/TextField.js:92:50]()
...

Expected behavior 🤔

The Textfield component renders without errors

Steps to reproduce 🕹

Example in this codesandbox

Context 🔦

No response

Your environment 🌎

`npx @mui/envinfo`

  System:
    OS: macOS 12.2.1
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
    Memory: 19.84 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.13.1 - ~/.nvm/versions/node/v16.13.1/bin/node
    Yarn: 1.22.17 - ~/.nvm/versions/node/v16.13.1/bin/yarn
    npm: 8.1.2 - ~/.nvm/versions/node/v16.13.1/bin/npm
  Managers:
    Homebrew: 3.3.11 - /usr/local/bin/brew
    Maven: 3.5.4 - /usr/local/bin/mvn
    RubyGems: 3.0.3.1 - /usr/bin/gem
  Utilities:
    Make: 3.81 - /usr/bin/make
    GCC: 4.2.1 - /usr/bin/gcc
    Git: 2.30.1 - /usr/bin/git
    Clang: 12.0.5 - /usr/bin/clang
  Servers:
    Apache: 2.4.51 - /usr/sbin/apachectl
  Virtualization:
    Docker: 20.10.12 - /usr/local/bin/docker
    Parallels: 16.0.1 - /usr/local/bin/prlctl
    VirtualBox: 5.2.22 - /usr/local/bin/vboxmanage
  IDEs:
    IntelliJ: 2021.2.3
    Nano: 2.0.6 - /usr/bin/nano
    Sublime Text: Build 3211
    Vim: 8.2 - /usr/bin/vim
    Xcode: /undefined - /usr/bin/xcodebuild
  Languages:
    Bash: 3.2.57 - /bin/bash
    Go: 1.12.5 - /usr/local/bin/go
    Java: javac 16 - /Users/david/.sdkman/candidates/java/current/bin/javac
    Perl: 5.30.3 - /usr/bin/perl
    Python: 2.7.15 - /usr/local/bin/python
    Python3: 3.8.2 - /usr/bin/python3
    Ruby: 2.6.8 - /usr/bin/ruby
  Databases:
    SQLite: 3.36.0 - /usr/bin/sqlite3
  Browsers:
    Chrome: 98.0.4758.102
    Edge: 98.0.1108.56
    Firefox: 97.0.1
    Safari: 15.3

Tested in Chrome and Firefox

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:6
  • Comments:14 (3 by maintainers)

github_iconTop GitHub Comments

7reactions
cindyloocommented, Jun 16, 2022

still an issue with react 18. is there an update?

5reactions
CalebJamesStevenscommented, Aug 23, 2022

Issue is still peristant when testing mui5 components with enzyme in react18.2 and react-dom 18.2

Read more comments on GitHub >

github_iconTop Results From Across the Web

Uncaught TypeError: dispatcher.useSyncExternalStore is not ...
This happens because react-redux is not supported yet with React 18 (React and React Native). Downgrade react-redux to the previous version ...
Read more >
typeerror: react.useid is not a function - You.com - You.com
The argument a React function component receives is its props, which is an object with named properties for each of the properties.
Read more >
Hooks API Reference - React
The setState function is used to update the state. It accepts a new state value and enqueues a re-render of the component. setState(newState);....
Read more >
Exploring React 18's three new APIs - LogRocket Blog
With the release of React 18 on the horizon, familiarize yourself with ... not the selector functions, to decide whether to retrieve the ......
Read more >
React Hooks & Context (Without Redux) | by Amir Waisman
This TodosDispatch context is used in order to provide any child components under it, an access to the reducer's dispatch function. We provide...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found