AdvancedCustomFields / AdvancedCustomFields/acf

5.8.0-beta4: rel="noopener" in WYSIWYG block element causes broken JSON in DB

Open
#149 3 comments 0 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

Steps to reproduce:

  1. Install Advanced Custom Fields PRO 5.8.0-beta3
  2. Create a Gutenberg block
add_action('acf/init', 'my_acf_init');
function my_acf_init() {
	
	// check function exists
	if( function_exists('acf_register_block') ) {
		
		// register a testimonial block
		acf_register_block(array(
			'name'				=> 'testimonial',
			'title'				=> __('Testimonial'),
			'description'		=> __('A custom testimonial block.'),
			'render_callback'	=> 'my_acf_block_render_callback',
			'category'			=> 'formatting',
			'icon'				=> 'admin-comments',
			'keywords'			=> array( 'testimonial', 'quote' ),
		));
	}
}
  1. Create a field group for that block, containing a WYSIWYG editor field.
  2. Create a new page. Use block in page. Use a link in the WYSIWYG editor and check the external link checkbox for target=_blank. Save the page.
  3. Field is stored in db (post_content) like this:
<!-- wp:acf/testimonial {"id":"block_5c8a5e69fcebb","data":{"field_5c8a5de6c98ec":"\u003cp\u003ethis block is used in acf-beta3 and here is an external \u003ca href=\u0022https://www.advancedcustomfields.com\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003elink\u003c/a\u003e\u003c/p\u003e"},"name":"acf/testimonial","align":"","mode":"edit"} /-->
  1. Update to Advanced Custom Fields PRO 5.8.0-beta4
  2. Update the blocks content, save the page.
  3. Field is stored in db (post_content) like this:
<!-- wp:acf/testimonial {
    "id": "block_5c8a5e69fcebb",
    "data": {
        "test_block_content": "<p>this block is used in acf-beta4 and here is an external <a href=\"https:\/\/www.advancedcustomfields.com\" target=\"_blank\" rel="\&quot;noopener\&quot; noopener noreferrer">link<\/a><\/p>",
        "_test_block_content": "field_5c8a5de6c98ec"
    },
    "name": "acf\/testimonial",
    "align": "",
    "mode": "edit"
} /-->

What's going on with the rel attribute? 😕

// Edit: Tested on WP 5.1.1

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 the Advanced Custom Fields PRO beta versions, a Gutenberg block, and a WYSIWYG link using target="_blank". Compare the resulting post_content block JSON and trace how the rel attribute is serialized; done means the saved block content remains valid JSON and preserves the intended rel value.

Written by the indexing model from the issue text.

Assessment

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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.