Cannot inspect component's form props using React Dev Tools

[nmkedziora]

Hi Guys, I've tried on my own to debug or to find similar issue but failed many times.

I want to use mobex-react-form, so went through docs and tutorial, then created sample form and finally the exact copy of form-quickstart published on codesandbox . The form works perfectly fine, but I encountered an error when trying to inspect component in React Developer Tools. Error: this.validator is undefined (Firefox) / Cannot read property 'error' of undefined (Chrome) - Form.js:195

Here you can find my form deployed and here the source code.

So what I did, step by step:

1. Opened React Developer Tools
2. Found form component:
3. After clicking on the component I saw it's Props visible in panel on the right.
4. When I clicked on form Props to open it and see the content, an error occurred and opening was impossible.

Please find PrintScreens below: Firefox

Chrome

I've tried on different browsers (OS Ubuntu 17.04). Firefox Quantum 57.0b3 (64-bit) Google Chrome Version 60.0.3112.113 (Official Build) (64-bit)

Both web browsers with React Developer Tools installed - version 2.5.2 Also, I use create-react-app without ejecting, so there is default webpack build (maybe that causes the error (?)).

I checked https://foxhound87.github.io/mobx-react-form-demo/demo.html as well, but the error doesn't occur here.

I would be grateful for your assistance. Natalia

[foxhound87]

Hi @nmkedziora,

I think it's a mobx issue, I found these issues which are labeled wontfix:

https://github.com/mobxjs/mobx/issues/752 https://github.com/mobxjs/mobx/issues/610 https://github.com/mobxjs/mobx/issues/410