Recoilize: TypeError: Cannot read property 'hasOwnProperty' of null

I get this error immediately after install. Install went fine following the install instructions on the readme here. This was the top error on the traceback on the response of the first run.

TypeError: Cannot read property 'hasOwnProperty' of null
createAtomsSelectorArray
S:/Projects/2077 key manager/2077keys/node_modules/recoilize/formatFiberNodes.js:37
  34 | while (currentNode) {
  35 |   // if the memoizedState has a deps key, and that deps key is an array
  36 |   // then the first value of that array will be an atom or selector
> 37 |   if (
     | ^  38 |     currentNode.hasOwnProperty('memoizedState') &&
  39 |     typeof currentNode.memoizedState === 'object' &&
  40 |     !Array.isArray(currentNode.memoizedState) &&

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Reactions: 6
  • Comments: 18 (5 by maintainers)

Most upvoted comments

Hi All,

Thank you for using recoilize! We’re looking into this now.

Best,

Edward

Hi. There’s another team that’s working on Recoilize now. I’ll get in touch with them about updating the npm package. Thanks for your patience.

On Mar 31, 2021, at 2:41 AM, Logan Lee @.***> wrote:

well still same here 😦

— You are receiving this because you commented. Reply to this email directly, view it on GitHub, or unsubscribe.

I disabled StrictMode but still get the same error (Uncaught TypeError: Cannot read property 'hasOwnProperty' of null)

import React from 'react'
import ReactDOM from 'react-dom'
import { RecoilRoot } from 'recoil'
import RecoilizeDebugger from 'recoilize'
import App from './App'
import * as serviceWorker from './serviceWorker'
import './index.css'
import './mobile.css'

ReactDOM.render(
        <RecoilRoot>
            <RecoilizeDebugger />
            <App />
        </RecoilRoot>,
    document.getElementById('root')
)   

Hi All,

Thank you again for using recoilize! I believe we solved the problem. However, I just wanted to double-check: are you guys following the instructions on lines 52-82 on the readme?

Integrate RecoilizeDebugger as a React component within the recoil root:

```js
import RecoilizeDebugger from 'recoilize';
import RecoilRoot from 'recoil';

ReactDOM.render(
  <RecoilRoot>
    <RecoilizeDebugger />
    <App />
  </RecoilRoot>,
  document.getElementById('root'),
);

Please note, Recoilize assumes that the HTML element used to inject your React application has an ID of ‘root’. If it does not the HTML element must be passed in as an attribute called ‘root’ to the RecoilizeDebugger component

Example:

import RecoilizeDebugger from 'recoilize';
import RecoilRoot from 'recoil';

//If your app injects on an element with ID of 'app'
const app = document.getElementById('app');

ReactDOM.render(
  <RecoilRoot>
    <RecoilizeDebugger root={app} />
    <App />
  </RecoilRoot>,
  app,
);

Open your application on the Chrome Browser and start debugging with Recoilize!

(Only supported with React applications using Recoil as state management)

It looks like there was a fix for this made a couple months ago on this commit: https://github.com/open-source-labs/Recoilize/commit/cefe7c9e396ce977d88b6eac8fa7b6d790aeef94#diff-9212d43f3a268d925dd24500154c46a022cde4871afd2dc0ff09a23ce971176a

But that fix has never been built/packaged and released to a new release version on npm. The master branch of this repo is ahead of the newest version available on npm.

Is anyone still actively maintaining/publishing this project?

it works fine with my app with <React.StrictMode>, however if I use useState anywhere else in the app I get the same error.

Thank you. We’re working on getting Recoilize to work with React.StrictMode.

We’ll keep you updated on progress, and please let us know what other improvements we can make.

On Feb 14, 2021, at 6:44 PM, Max Barry notifications@github.com wrote:

Same here. Recoilize appears in Chrome devtools, but my app immediately crashes with Uncaught TypeError: Cannot read property ‘hasOwnProperty’ of null… index.js:1 The above error occurred in the <RecoilizeDebugger>

├─ react@17.0.1 ├─ recoil@0.1.2 └─ recoilize@1.0.0 Tried in App.js and index.js, same problem either way:

import React from ‘react’ import ReactDOM from ‘react-dom’ import { RecoilRoot } from ‘recoil’ import RecoilizeDebugger from ‘recoilize’ import App from ‘./App’ import * as serviceWorker from ‘./serviceWorker’ import ‘./index.css’ import ‘./mobile.css’

ReactDOM.render( <React.StrictMode> <RecoilRoot> <RecoilizeDebugger /> <App /> </RecoilRoot> </React.StrictMode>, document.getElementById(‘root’) ) — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or unsubscribe.