mui.com documentation imploded "Cannot read properties of undefined (reading 'type')"

[AlbinoGeek]

Probably reported to the wrong place, for that I apologize.

Duplicates

• [X] I have searched the existing issues

Latest version

• [X] I have tested the latest version

Current behavior 😯

https://mui.com/components/text-fields/#main-content implodes.

Expected behavior 🤔

It was working half an hour ago.

Steps to reproduce 🕹

Steps:

1. Go to https://mui.com/components/text-fields/#main-content
2. Wait until hydration begins.
3. Observe error

Context 🔦

No response

Your environment 🌎

`Browser`

`Google Chrome Version 96.0.4664.45 (Official Build) (64-bit)`

`OS`

`Fedora 34 (Thirty Four) with kernel 5.14.18-200.fc34.x86_64 #1 SMP Fri Nov 12 16:48:10 UTC 2021`

[AlbinoGeek]

This appears to have now been fixed. I wonder what happened?

[rhettl]

I am still getting this error, but on anything involving DataGrid, ex: https://mui.com/components/data-grid/columns/

MacOS 11.6 Chrome 97.0.4692.71

[AlbinoGeek]

Reopened as the issue has come back, and I'm not the only person with it.

[mnajdova]

@DanailH could you check? I cannot repro on Windows.

[AlbinoGeek]

Repro on Fedora 35 Workstation with Gnome 41 (default DE) up-to-date

Same as above, happens much more often on the data table pages then other pages of the documentation.

On Mon., Jan. 24, 2022, 12:32 a.m. Marija Najdova, @.***> wrote:

@DanailH https://github.com/DanailH could you check? I cannot repro on Windows.

— Reply to this email directly, view it on GitHub https://github.com/mui-org/material-ui/issues/30562#issuecomment-1019841486, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAOSNPPB3R4DL2QHHPTIIILUXUFBXANCNFSM5LSPIQVA . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

You are receiving this because you modified the open/close state.Message ID: @.***>

[michaldudak]

@AlbinoGeek does it still occur for you? I wasn't able to reproduce it even once. Make sure to clear your browser's cache and storage.

[rhettl]

It no longer happens to me. If it happens again, I will try that before re-engaging.

[AlbinoGeek]

I just had this happen for me again when I dropped on to the material icons page from google, and I started typing in the icon search before the application switched into dark mode (saved preference).

It seems like you can cause code to be executed before hydration, or before the dogs are initialized, which reproduces this issue pretty reliably.

On Tue., Feb. 8, 2022, 10:13 a.m. Rhett Lowe, @.***> wrote:

It no longer happens to me. If it happens again, I will try that before re-engaging.

— Reply to this email directly, view it on GitHub https://github.com/mui/material-ui/issues/30562#issuecomment-1032916075, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAOSNPNJJKVAGK7HRUQN3YDU2FMOBANCNFSM5LSPIQVA . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

You are receiving this because you were mentioned.Message ID: @.***>

[AlbinoGeek]

Continues to be reproducible on Data Tables and Material Icons pages.

[michaldudak]

It seems to be specific to your setup. I was not able to reproduce the issue, nor I have seen any other reports outside of this issue. If you're willing to dive deeper and debug the problem, we'll be glad to accept a fix.

[AlbinoGeek]

An issue I've had with react applications in general, is that they're not really debuggable.

I'm sure that means I'm missing something required to develop efficiently.

But as you saw with the stock traces I posted, they're not exactly useful.

Even with Source maps loaded, the line numbers on the stack link me to comments, and not actual code. Is there a Chrome extension necessary to make the stack useful?

I would love to get to the bottom of this.

I have also reproduced this in firefox, and in a Chrome Incognito window, which I disabled all extensions for.

The only plug-in enabled at that point, was Cisco's open h265 decoder, because that's installed system wide on Fedora.

On Wed., Mar. 23, 2022, 5:01 a.m. Michał Dudak, @.***> wrote:

It seems to be specific to your setup. I was not able to reproduce the issue, nor I have seen any other reports outside of this issue. If you're willing to dive deeper and debug the problem, we'll be glad to accept a fix.

— Reply to this email directly, view it on GitHub https://github.com/mui/material-ui/issues/30562#issuecomment-1076295441, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAOSNPL7FKJJKCZQZ7HFCNTVBMBYRANCNFSM5LSPIQVA . You are receiving this because you were mentioned.Message ID: @.***>

[michaldudak]

Stack traces should be more readable if you run the docs site from sources: clone the repo and run yarn start in the root of the working copy.

[AlbinoGeek]

100% reproduction rate on the live website if you open Google chrome, open the network tab, and set it to shape you to 3G.

Seems to be related to interacting with the page before it's finished uploading, before it hydrates.

Running the application locally, clicking on any of the stack Trace entries, the line numbers still don't match up.

But again, this could easily be my problem, react does this for me everywhere.

I'll keep looking into this, and update this if I find a root cause.

One other person in this thread had the same issue as me, but didn't provide many details.

On Wed., Mar. 23, 2022, 5:24 a.m. Michał Dudak, @.***> wrote:

Stack traces should be more readable if you run the docs site from sources: clone the repo and run yarn start in the root of the working copy.

— Reply to this email directly, view it on GitHub https://github.com/mui/material-ui/issues/30562#issuecomment-1076315922, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAOSNPK76ETTHZQIO6YIJLDVBMEODANCNFSM5LSPIQVA . You are receiving this because you were mentioned.Message ID: @.***>

[michaldudak]

It works fine on both Chrome and Edge for me, even with cache disabled and on the 'Slow 3G' profile. I'm using Windows, though.

[AlbinoGeek]

Thanks for testing that, I will install Windows in a VM, and on my second computer, to see if the issue is specific to Fedora or Linux.

It's not a super pervasive or blocking issue, because if your patient and just let the page load first, the error doesn't happen.

If I go to the material icons page, and I start typing immediately to search the icons, it crashes every time.

If I go to the data tables page and start modifying the filters before the page completes loading, same thing.

It would definitely be curious if this was a linux-specific issue.

Thank you for your patience and help on investigating this issue. I don't like creating this many notifications for people haha.

On Wed., Mar. 23, 2022, 5:51 a.m. Michał Dudak, @.***> wrote:

It works fine on both Chrome and Edge for me, even with cache disabled and on the 'Slow 3G' profile. I'm using Windows, though.

— Reply to this email directly, view it on GitHub https://github.com/mui/material-ui/issues/30562#issuecomment-1076339898, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAOSNPOZ6BB6HUUC266YAU3VBMHVJANCNFSM5LSPIQVA . You are receiving this because you were mentioned.Message ID: @.***>

[Ihor999]

datagrid version 5.17.8 still has the error steps to reproduce

1. place datagrid on a page
2. place datagrid on the same page inside dialog
3. open dialog and click on datagrid row

as a result publishClick** event fired twice for both datagrids but second event can't find column.

Any thoughts why event rowClick event fired twice for both datagrids?

[AlbinoGeek]

Hey there! I don't think your issue has anything to do with this. In particular, this issue is talking about the documentation site exploding.

An update as well, I do apologize for the delay, I have a native Windows machine now, and can reproduce this 100% in Brave and Chrome.

Basically, just be impatient. Try and type in the search Fields before the page has loaded, or use keyboard navigation before the page has loaded.

It is significantly easier to cause if you have dark reader installed, because that delays the first contentful paint, which can make bugs in script execution order present themselves far more often than they would under normal circumstances.

The larger the documentation page, the easier this is to reproduce. If you have developer tools open, and simulate 3G, you can almost get it 100% of the time even without dark reader.

On Fri., Oct. 28, 2022, 1:45 a.m. Ihor999, @.***> wrote:

datagrid version 5.17.8 still has the error steps to reproduce

1. place datagrid on a page
2. place datagrid on the same page inside dialog
3. open dialog and click on datagrid row

[image: image] https://user-images.githubusercontent.com/10143613/198543820-81a7ee41-6241-4b6e-a644-e2bafd426408.png

as a result publishClick** event fired twice for both datagrids but second event can't find column.

Any thoughts why event rowClick event fired twice for both datagrids?

— Reply to this email directly, view it on GitHub https://github.com/mui/material-ui/issues/30562#issuecomment-1294712018, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAOSNPPUFP54TJGDSPK5P7DWFOHCFANCNFSM5LSPIQVA . You are receiving this because you modified the open/close state.Message ID: @.***>

[yelodevopsi]

datagrid version 5.17.8 still has the error steps to reproduce

1. place datagrid on a page
2. place datagrid on the same page inside dialog
3. open dialog and click on datagrid row

as a result publishClick** event fired twice for both datagrids but second event can't find column.

Any thoughts why event rowClick event fired twice for both datagrids?

This is more or less the exact setup I have too. When opening a Dialog with another DataGrid inside the column.type check fails

[michaldudak]

@rompeldunk For problems with DataGrid please open an issue in the https://github.com/mui/mui-x repo.

@AlbinoGeek I still cannot reproduce the issue. I installed Dark Reader, turned on Slow 3G emulation, went to https://mui.com/material-ui/material-icons, and started to type in the search box while the page was still loading. The search didn't work at first, but there were no crashes.

In the console, the only error I got was from ads:

carbon.js?serve=CKYIL27L&placement=material-uicom:1 Uncaught TypeError: Cannot read properties of null (reading 'src')
    at Object.getUrlVar (carbon.js?serve=CKYIL27L&placement=material-uicom:1:9144)

but it didn't cause any visible problems on the site.

cc @mui/core Perhaps someone else will be able to reproduce it.

[boldurean]

datagrid version 5.17.8 still has the error steps to reproduce

1. place datagrid on a page
2. place datagrid on the same page inside dialog
3. open dialog and click on datagrid row

as a result publishClick** event fired twice for both datagrids but second event can't find column. Any thoughts why event rowClick event fired twice for both datagrids?

This is more or less the exact setup I have too. When opening a Dialog with another DataGrid inside the column.type check fails

Make sure you don't have a cicle dependencies in your code. As this was exactly what happened to me. It clicks cicle twice instead of one time.

[NeelDigonto]

datagrid version 5.17.8 still has the error steps to reproduce

1. place datagrid on a page
2. place datagrid on the same page inside dialog
3. open dialog and click on datagrid row

as a result publishClick** event fired twice for both datagrids but second event can't find column. Any thoughts why event rowClick event fired twice for both datagrids?

This is more or less the exact setup I have too. When opening a Dialog with another DataGrid inside the column.type check fails

Make sure you don't have a cicle dependencies in your code. As this was exactly what happened to me. It clicks cicle twice instead of one time.

Can you explain a bit more? This same issue is bugging me, and I don't seem to get a solution from Google.

[peter-hg]

datagrid version 5.17.8 still has the error steps to reproduce

1. place datagrid on a page
2. place datagrid on the same page inside dialog
3. open dialog and click on datagrid row

as a result publishClick** event fired twice for both datagrids but second event can't find column. Any thoughts why event rowClick event fired twice for both datagrids?

This is more or less the exact setup I have too. When opening a Dialog with another DataGrid inside the column.type check fails

Make sure you don't have a cicle dependencies in your code. As this was exactly what happened to me. It clicks cicle twice instead of one time.

Can you explain a bit more? This same issue is bugging me, and I don't seem to get a solution from Google.

Adding e.stopPropagation() to the click handler fixed it for me.

[Luif3rch]

today this type error happens a lot when you have a table inside a dialog and you are passing data as libraries like reactquery.

[AddisonGm]

I'm stuck with this error... any update @AlbinoGeek? It's happening when data grid table is rendered