Explore how to re-add anchor support to dynamic blocks

[t-hamano]

In #44771, anchor support was added to dynamic blocks, but static blocks with existing anchor were broken (See #48232, #49382, and #49578).

This feature was originally planned to be included in WordPress 6.2, but #48232 was the first to report this issue during the Beta phase. Therefore, by #48592, this feature was excluded in the WordPress 6.2 release.

However, this feature still remains on the Gutenberg plugin, which will be bundled with WordPress 6.3 and will cause similar problems. A solution was attempted in #48438, but we reverted in #51288 anchor support for dynamic blocks in the Gutenberg plugin as well, in order to find a more ideal solution.

One approach I have explored is described in this comment:

• The allowed values for supports.anchor are false, true, "html", or "delimiter". The block.json schema and document have also been updated.
• If the value is true or "html", the attribute is taken from the markup of the root element.
• If the value is delimiter, the attribute is taken from the comment delimiter.
• Based on these specifications, in dynamic blocks where anchor support was added in #44771, the value of the anchor property was changed to "delimiter".
• With the increased selection of possible values for anchor, several tests have been added to the unit test for addAttribute().

[stefanfisk]

Is there any sort of workaround available for this? I build all of my sites with 100% dynamic blocks, and I've just found that I have several customers whose site's are now somewhat broken :/

Previously I just hade to use supports.anchor = true and an "anchor": {"type":"string"} attribute for it to work.

[t-hamano]

Hi @stefanfisk,

Anchor support for dynamic blocks should not currently be available in both WordPress core and the Gutenberg repository, as an ideal approach has not yet been found.

At this time, anchor support is probably not available unless you utilize some kind of your own custom hook.

[stefanfisk]

@t-hamano I understand that anchor support has been removed for dynamic blocks due to bugs.

What I am asking is if there is anything I can in the scope of "utilize some kind of your own custom hook" to restore the functionality.

My current situation is that I have a handful of custom sites that have partially broken navigation because this functionality was removed.

I'm fine with custom workarounds while you sort out a permanent solution. I just need some sort of pointer on how to implement it.

[t-hamano]

If you want to add anchor functionality to a dynamic block that you have created yourself, one approach is as follows.

• Don't define supports.anchor, define attributes.anchor
• Inject a text field into the Advanced panel via InspectorControl to update its attributes
• Inject the id attribute into the block wrapper using render_block() hook or similar

I build all of my sites with 100% dynamic blocks, and I've just found that I have several customers whose site's are now somewhat broken :/

What errors are you seeing in the browser console? Also, does it have something to do with the removal of anchor support for dynamic blocks from the Gutenberg plugin?

[stefanfisk]

Nevermind!

My issue was with sloppy debugging and unfounded assumptions after reading that anchor support had been removed for dynamic blocks.

AFAICT combining supports.anchor = true and "anchor": {"type":"string"} still works great with my setup.