Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Block API: Can't restrict where a block may be inserted using parent #23227

Closed
noisysocks opened this issue Jun 17, 2020 · 0 comments · Fixed by #23231
Closed

Block API: Can't restrict where a block may be inserted using parent #23227

noisysocks opened this issue Jun 17, 2020 · 0 comments · Fixed by #23231
Assignees
Labels
[Feature] Block API API that allows to express the block paradigm. [Status] In Progress Tracking issues with work in progress [Type] Bug An existing feature does not function as intended

Comments

@noisysocks
Copy link
Member

noisysocks commented Jun 17, 2020

Describe the bug

Third parties are no longer able to make it so that a child block C can only be added to specific parent block P while also allowing P to have non-C blocks added to it.

To reproduce

  1. Paste the following snippet into the DevTools console:

    Snippet
    ( function() {
    	const { registerBlockType } = wp.blocks;
    	const { createElement: el } = wp.element;
    	const { InnerBlocks } = wp.blockEditor;
    
    	registerBlockType( 'acme/product', {
    		title: 'Product',
    		icon: 'carrot',
    		category: 'common',
    
    		edit() {
    			return el( 'div', { className: 'product', style: { outline: '1px solid gray', padding: 5 } },
    				// Only paragraphs, images, and Add to Cart blocks:
    				el( InnerBlocks, { allowedBlocks: [ 'core/paragraph', 'core/image' ] } )
    				// Everything and Add to Cart blocks:
    				//el( InnerBlocks )
    			);
    		},
    
    		save() {
    			return el( 'div', { className: 'product', style: { outline: '1px solid gray', padding: 5 } },
    				el( InnerBlocks.Content )
    			);
    		},
    	} );
    
    	registerBlockType( 'acme/buy-button', {
    		title: 'Buy Button',
    		icon: 'cart',
    		category: 'common',
    
    		// Only allow in products:
    		parent: [ 'acme/product' ],
    
    		edit() {
    			return el(
    				'button',
    				{
    					className: 'buy-button',
    					style: { display: 'block', margin: '0 auto', padding: '10px 30px' },
    				},
    				'Buy Now'
    			);
    		},
    
    		save() {
    			return el(
    				'button',
    				{
    					className: 'buy-button',
    					style: { display: 'block', margin: '0 auto', padding: '10px 30px' },
    				},
    				'Buy Now'
    			);
    		},
    	} );
    } )();
  2. Add a Product block to the post.
  3. Select the Product block and open the Inserter.

Expected result

The Paragraph, Image and Add to Cart blocks should appear in the Inserter.

Actual result

Only the Add to Cart block appears in the Inserter.

Additional context

This functionality was introduced in #6753.

@noisysocks noisysocks added [Type] Bug An existing feature does not function as intended [Feature] Block API API that allows to express the block paradigm. labels Jun 17, 2020
@noisysocks noisysocks self-assigned this Jun 17, 2020
@github-actions github-actions bot added the [Status] In Progress Tracking issues with work in progress label Jun 17, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Block API API that allows to express the block paradigm. [Status] In Progress Tracking issues with work in progress [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant