Display a friendly warning on block validation fails.

[delowardev]

Description

WordPress core injects the rel=noopener attribute to the anchor tag that has the target attribute; which causes the block validation to fail if the developer doesn't use the rel=noopener in the save function. It's really hard to debug the error by reading the current validation warning.

Issues: #38978, #39051
See also: https://github.com/WordPress/WordPress/blob/2ae4784ca0aa4ba0e8e87d9c7c1c22f26b214701/wp-includes/formatting.php#L3236-L3288

Testing Instructions

Screenshots

Types of changes

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• I've tested my changes with keyboard and screen readers.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.
• I've updated all React Native files affected by any refactorings/renamings in this PR (please manually search all *.native.js files for terms that need renaming or removal).
• I've updated related schemas if appropriate.

[talldan]

@delowardev Thanks for being proactive about this issue. I'm not sure adding this to the blocks package is the right thing to do, as this isn't a WordPress specific package. It can be used by any implementation of a block editor whether within WordPress or outside of WordPress (e.g. I think Drupal also use the block editor). Outside of WordPress this problem with rel won't exist.

This is one of the things that makes fixing or improving this particular issue difficult, a lot of the code that results in a validation error is intended to be generic. Sorry I haven't been able to offer any other ideas just yet, I'm thinking about it.

[delowardev]

My bad, I was thinking WordPress-centric here. Now I can see the difficulties; thanks for pointing it out.