Topic: Update to 4.14 breaks website
lyndav001 premium asked 5 years ago
Expected behavior Not to break website after update
Actual behavior Website crashes, error message: ReferenceError: Element is not defined at Object. (.../node_modules/mdbreact/dist/mdbreact.js:3468:44)
Resources (screenshots, code snippets etc.)
Jakub Mandra staff answered 5 years ago
Hi,
We could not reproduce your issue on Linux/Chrome nor on Mac/Chrome with freshly installed create-react-app and added mdbreact via gitlab link, what is described in 'Existing project' section of this Getting Started page: https://mdbootstrap.com/docs/react/getting-started/quick-start/
But we have found the potential culprit which is this line of code:
inputRef: PropTypes.shape({ current: PropTypes.instanceOf(Element) }),
It is a prop-type in selectOption component and in the provided by @lyndav001 error message me can read that Element is not defined.
Discussion about prop types for Refs: https://stackoverflow.com/questions/48007326/what-is-the-correct-proptype-for-a-ref-in-react
https://github.com/facebook/prop-types/issues/240
So this prop-type will break under server-side rendering. Do you use SSR in your projects?
There are several ways to get rid of your issue:
1.Produce global shim for Element in your project: Element = typeof Element === 'undefined' ? function(){} : Element
2.downgrade to 4.13.0 version:
add the desired tag on the end of the repository link:
"mdbreact": "git+https://oauth2:YOUR_TOEKN@git.mdbootstrap.com/mdb/react/re-pro.git#4.13.0"
remove node_modules and lock files (to be sure that the package will be overwritten)
run npm install
3.Find the broken line in your node_modules/mdbreact/dist/mdbreact.js and comment it (this is just prop-types)
4.Request a hot-fix, but we have only 2 users with that problem so we will be more keen to provide a new branch named #next
for you (installation process same as from tag)
Hope my analysis will help.
Best,
Jakub
stathisntonas free commented 5 years ago
I’m using Next 8.1 so this is related to SSR. Waiting for a fix, thanks
Jakub Mandra staff commented 5 years ago
You can use package from branch #next
for now:
git+https://oauth2:YOUR_TOEKN@git.mdbootstrap.com/mdb/react/re-pro.git#next
lyndav001 premium answered 5 years ago
The lack of response isn't ideal, especially as we are paying customers.
Jakub Mandra staff commented 5 years ago
We answer for questions on support forum within our working hours :)
lyndav001 premium commented 5 years ago
Thanks. The issue was raised 2 days ago and the response was we can't replicate it and I replied instantly and had to wait another 24 hours for a reply.
lyndav001 premium answered 5 years ago
Hi
Please can we get this resolved, or provide an explanation on how to downgrade to v4.13.
Aliaksandr Andrasiuk staff answered 5 years ago
Hello,
I've tried to update the package and it works fine...
Can you describe this problem more detailed please :
1) How did you update to the new mdbreact version?
2) Did you delete node_modules
folder ?
3) Did you use npm install / yarn
after changing version?
4) Which version of react
do you use in your project?
Best regards.
lyndav001 premium commented 5 years ago
Hi 1) I ran npm update 2) No I did not delete node_modules folder 3) Yes I ran npm install 4) React v16.8.6
stathisntonas free commented 5 years ago
1) npm update 2) yes 3) yes 4) 16.8.6
Still getting the error
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Premium
- Premium support: Yes
- Technology: MDB React
- MDB Version: 4.13.0
- Device: MacBook
- Browser: Chrome
- OS: OSX
- Provided sample code: No
- Provided link: No