AdvancedCustomFields / AdvancedCustomFields/acf

First block with InnerBlock is not refreshing on field change PRO 5.9.4

Open
#452 14 comments 2 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
PHP
Stars
945
Forks
197
PR merge metrics
No merged PRs in 30d

Description

The fields in the admin sidebar don't receive the keyup event listener from acf-pro-blocks.min.js for the block added first in the sequence. Thus not triggering the expected refresh on the block.

To recreate:

  1. Register new block type that supports jsx
  2. Create field group for the new block type and add any field
  3. Create the render template for the new block type and add the code below
  4. Add the new block into a page twice
  5. Change the value of the field in the block type for both blocks on the page. You will see that the first block does not trigger the refresh, whereas the second one works.
Add to function.php
<?php
add_action('acf/init', 'anything_acf_debug_block_init');
function anything_acf_debug_block_init()
{
    // check function exists
    if (function_exists('acf_register_block')) {
        // register blocks
        acf_register_block(array(
            'name'            => 'debug',
            'title'           => __('Debug block..'),
            'description'     => __('Description.'),
            'render_template' => 'template-parts/blocks/debug-block.php',
            'category'        => 'formatting',
            'mode'            => 'preview',
            'icon'            => 'admin-users',
            'keywords'        => array(),
            'supports'        => array(
                'align'  => false,
                'anchor' => true,
                'jsx'    => true
            )
        ));
    }
}
template-parts/blocks/debug-block.php
<?php var_dump(get_field('the_added_field')); ?>
<div>
  <InnerBlocks
        allowedBlocks="<?php echo esc_attr(wp_json_encode(['core/heading', 'core/paragraph'])); ?>"
        template="<?php echo esc_attr(wp_json_encode([['core/heading', ['placeholder' => 'Add header']], ['core/paragraph', ['placeholder' => 'Add paragraph']]])); ?>"
        templateLock="all"
    />
</div>

Expected behaviour

The block shall respond normally no matter in what sequence it is added.

Tested debugging steps (no avail)

  • I have tried removing all other script assets on the site.
  • Tried recreating new field group.

Versions

Wordpress: 5.6
ACF Pro: 5.9.4

edit; Adding tested debugging steps.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the issue with WordPress 5.6 and ACF Pro 5.9.4 using the registration in functions.php and template-parts/blocks/debug-block.php. Inspect acf-pro-blocks.min.js and the keyup listener while changing fields in two InnerBlocks instances; done means both blocks refresh regardless of insertion order.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, php, wordpress
Domain
backend, frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.