Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead
- [x] I've read and understood the contribution guidelines.
- [x] I've searched for any related issues and avoided creating a duplicate issue.
Please give us a description of what happened
When in the default Gutenberg editor, the console shows lots of Warning: E: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead (full error below)
These errors don’t show when the Yoast plugin deactivated.
Full error:
Warning: Ks: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.
at Ks (https://localhost/wp-content/plugins/wordpress-seo/js/dist/block-editor.js?ver=5d9eb0a02f8c7b68e3ca:225:1008)
at div
at nr (https://localhost/wp-content/plugins/wordpress-seo/js/dist/block-editor.js?ver=5d9eb0a02f8c7b68e3ca:272:1139
at SlotComponent (https://localhost/wp-includes/js/dist/components.js?ver=54eab95952fe254d64e9:33330:5)
at Slot
at UnforwardedSlot (https://localhost/wp-includes/js/dist/components.js?ver=54eab95952fe254d64e9:33890:5)
at t (https://localhost/wp-content/plugins/wordpress-seo/js/dist/externals/uiLibrary.js?ver=0499348f9e5ab4c08abf:1:591)
at _e (https://localhost/wp-content/plugins/wordpress-seo/js/dist/externals/styledComponents.js?ver=f030a78c47ee9be46c07:1:29679)
at x (https://localhost/wp-content/plugins/wordpress-seo/js/dist/block-editor.js?ver=5d9eb0a02f8c7b68e3ca:16:2199)
at N (https://localhost/wp-content/plugins/wordpress-seo/js/dist/block-editor.js?ver=5d9eb0a02f8c7b68e3ca:16:6414)
at L (https://localhost/wp-content/plugins/wordpress-seo/js/dist/block-editor.js?ver=5d9eb0a02f8c7b68e3ca:16:3062)
at vo (https://localhost/wp-content/plugins/wordpress-seo/js/dist/block-editor.js?ver=5d9eb0a02f8c7b68e3ca:563:3518)
at w (https://localhost/wp-content/plugins/wordpress-seo/js/dist/externals-contexts.js?ver=10ecaeb7fee15b420938:1:437)
at render
at PluginErrorBoundary (https://localhost/wp-includes/js/dist/plugins.js?ver=cd5358b6369eff6f7b85:291:5)
at div
at PluginArea (https://localhost/wp-includes/js/dist/plugins.js?ver=cd5358b6369eff6f7b85:602:3)
at Layout (https://localhost/wp-includes/js/dist/edit-post.js?ver=31dde9e0afebadcf425c:2763:3)
at ErrorBoundary (https://localhost/wp-includes/js/dist/editor.js?ver=e15506639990b108fc28:9270:5)
at BlockRefsProvider (https://localhost/wp-includes/js/dist/block-editor.js?ver=2cb36d67922bfdc27a1d:19804:3)
at Provider (https://localhost/wp-includes/js/dist/components.js?ver=54eab95952fe254d64e9:33905:3)
at https://localhost/wp-includes/js/dist/block-editor.js?ver=2cb36d67922bfdc27a1d:41829:5
at https://localhost/wp-includes/js/dist/block-editor.js?ver=2cb36d67922bfdc27a1d:41367:3
at BlockContextProvider (https://localhost/wp-includes/js/dist/block-editor.js?ver=2cb36d67922bfdc27a1d:39048:3)
at EntityProvider (https://localhost/wp-includes/js/dist/core-data.js?ver=1b304f4025915ff3c84b:6964:3)
at EntityProvider (https://localhost/wp-includes/js/dist/core-data.js?ver=1b304f4025915ff3c84b:6964:3)
at https://localhost/wp-includes/js/dist/editor.js?ver=e15506639990b108fc28:21362:3
at https://localhost/wp-includes/js/dist/editor.js?ver=e15506639990b108fc28:18997:3
at SlotFillProvider (https://localhost/wp-includes/js/dist/components.js?ver=54eab95952fe254d64e9:33743:3)
at provider_SlotFillProvider (https://localhost/wp-includes/js/dist/components.js?ver=54eab95952fe254d64e9:33841:3)
at Provider (https://localhost/wp-includes/js/dist/components.js?ver=54eab95952fe254d64e9:33905:3)
at Editor (https://localhost/wp-includes/js/dist/edit-post.js?ver=31dde9e0afebadcf425c:3062:11)
I got this from https://wordpress.org/support/topic/yoast-error-on-mobile-view/#post-17985225, but I'm having exactly the same issue. It appears as "resolved" but I think there was a mix of issues, since the fix was for Post Editor: Editor canvas squashed by metabox in mobile/tablet view
Screenshots, screen recording, code snippet
If possible, please provide a screenshot, a screen recording or a code snippet which demonstrates the bug.
Technical info
- If relevant, which editor is affected (or editors):
- [ ] Block Editor
- [x] Gutenberg Editor
- [ ] Elementor Editor
- [ ] Classic Editor
- [ ] Other:
- Which browser is affected (or browsers):
- [x] Chrome
- [x] Firefox
- [x] Safari
- [ ] Other:
Used versions
- Device you are using: Mac m1 pro
- Operating system: Macos 13.2
- PHP version: 7.4.33
- WordPress version: 6.6.2
- WordPress Theme:
- Yoast SEO version: 23.8
- Relevant plugins in case of a bug: Yoast
Hi @EverStarck
Thanks for creating the issue. I tested this on multiple sites created using https://playground.wordpress.net/ and https://instawp.com, but I cannot replicate the errors you have pointed out when checking via the Gutenberg editor plugin. Can you please share the exact steps to replicate this, once after reproducing it on the sites created using the above platforms?
We look forward to hearing from you and are happy to help you.
Thanks @josevarghese for your help checking this. I'm also able to reproduce using the latest WP 6.7 RC: https://playground.wordpress.net/?plugin=wordpress-seo&php=8.3&wp=beta
You should be able to see the warnings in the javascript console by going to the post editor, for example /wp-admin/post.php?post=2&action=edit
My guess is that it's related to WordPress now using React 18.3 since version 6.6 as mentioned in this dev note. As referenced there defaultProps is now deprecated and should be replaced with ES6 default params.
I see several instances in the Yoast SEO Wordpress plugin code that'll need to be reviewed.
After a bit more research I found that the warnings I'm noticing in the playground do seem to indeed come from Yoast (they don't show up using https://playground.wordpress.net/?php=8.3&wp=beta) however the one reported by @EverStarck about the defaultProps is not there.
We are able to reproduce locally by setting the SCRIPT_DEBUG to true in wp-config.php but I'll check if there's a way to reproduce it in the playground in some other way.
Hi @ibonilla
Thanks for the details. Yes, I am now able to replicate the error when the SCRIPT_DEBUG is set as true. However, when I tested with the 6.7-RC3 without setting the SCRIPT_DEBUG , the error did not occur over it.
Hi,
I discussed this with our development team, who informed me that they are aware of the SCRIPT_DEBUG constant showing console errors when the React dev build is loading on the page. They also have a list of tasks for making the React 19 compatibility internally. However, I would like to inform you that this compatibility change will take some time (not very soon), and you can expect a fix in future versions.
+1 https://wordpress.org/support/topic/yoast-plugin-possibly-preventing-automatic-updates/
Just adding here that this issue is really annoying for Agencies working on sites where we develop custom solutions. Getting the entire browser console flooded by Yoast really makes working on your own custom code much harder.
I would love to see this get prioritized more than it seemingly is right now.
Please inform the customer of conversation # 1260558 when this conversation has been closed.
Any update on this? I am experiencing the same thing. These should not be logged as error, but as warnings. Or better they should be fixed because this is never going back to defaultProps like this posts says https://github.com/facebook/react/issues/29233
Also experiencing the issue, and I second @fabiankaegy comment. My savvy clients have a tendency to open up the console to see if anything is out of place. A sea of red messages is problematic
Our team is working on making React 19 compatibility internally, and you can see some progress in the public repo: https://github.com/Yoast/wordpress-seo/pulls?q=is%3Apr+react