WordPress / WordPress/create-block-theme

Export creates new patterns by copying content from other patterns, without re-using them

Open
#533 1 comment 2 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug Patterns
Dominant language
JavaScript
Stars
417
Forks
66
PR merge metrics
No merged PRs in 30d

Description

What?

Export or Save changes options creates new patterns and makes the existing patterns orphans.

Steps:

  1. Activate adventurer theme.
  2. Edit home page and add an image block.
  3. Save the template.
  4. Now use one of CBT options "Save changes" or "Export"
  5. Observe the following behavior.

Original template home.html

<!-- wp:group {"style":{"spacing":{"blockGap":"0"}},"backgroundColor":"tertiary","layout":{"type":"default"}} -->
<div class="wp-block-group has-tertiary-background-color has-background">
    <!-- wp:template-part {"slug":"secondary-header"} /-->

    <!-- wp:pattern {"slug":"adventurer/list"} /-->

    <!-- wp:pattern {"slug":"adventurer/search"} /-->

    <!-- wp:template-part {"slug":"footer","tagName":"footer"} /-->
</div>
<!-- /wp:group -->

Template after CBT Export

<!-- wp:pattern {"slug":"adventurer/home"} /-->

newly created home pattern

<?php
/**
 * Title: home
 * Slug: adventurer/home
 * Categories: hidden
 * Inserter: no
 */
?>
<!-- wp:group {"style":{"spacing":{"blockGap":"0"}},"backgroundColor":"tertiary","layout":{"type":"default"}} -->
<div class="wp-block-group has-tertiary-background-color has-background"><!-- wp:template-part {"slug":"secondary-header"} /-->

<!-- wp:group {"metadata":[],"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|80","bottom":"var:preset|spacing|80","right":"var:preset|spacing|50","left":"var:preset|spacing|50"}}},"backgroundColor":"tertiary","layout":{"type":"constrained","contentSize":"1100px"}} -->
<div class="wp-block-group alignfull has-tertiary-background-color has-background" style="padding-top:var(--wp--preset--spacing--80);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--80);padding-left:var(--wp--preset--spacing--50)"><!-- wp:heading {"level":3,"style":{"typography":{"textTransform":"uppercase","fontSize":"0.8rem","letterSpacing":"1px"}},"fontFamily":"roboto"} -->
<h3 class="wp-block-heading has-roboto-font-family" style="font-size:0.8rem;letter-spacing:1px;text-transform:uppercase">Browse by Country</h3>
<!-- /wp:heading -->

<!-- wp:heading {"style":{"typography":{"lineHeight":1.1,"fontSize":"80px","textTransform":"uppercase","fontStyle":"normal","fontWeight":"900"}}} -->
<h2 class="wp-block-heading" id="botswana-new-zealand-south-korea-japan-madagascar" style="font-size:80px;font-style:normal;font-weight:900;line-height:1.1;text-transform:uppercase"><a href="">ITALY</a><br><a href="">COSTA RICA</a><br><a href="">CANADA</a><br><a href="">LAOS</a><br><a href="">TURKEY</a></h2>
<!-- /wp:heading -->

<!-- wp:group {"layout":{"type":"constrained"}} -->
<div class="wp-block-group"><!-- wp:image {"id":2350,"sizeSlug":"full","linkDestination":"none"} -->
<figure class="wp-block-image size-full"><img src="<?php echo esc_url( get_stylesheet_directory_uri() ); ?>/assets/images/image.png" alt="" class="wp-image-2350"/></figure>
<!-- /wp:image --></div>
<!-- /wp:group --></div>
<!-- /wp:group -->

<!-- wp:group {"metadata":[],"align":"full","style":{"spacing":{"padding":{"top":"8rem","bottom":"8rem","left":"var:preset|spacing|50","right":"var:preset|spacing|50"}}},"backgroundColor":"primary","layout":{"type":"constrained","contentSize":"1100px"}} -->
<div class="wp-block-group alignfull has-primary-background-color has-background" style="padding-top:8rem;padding-right:var(--wp--preset--spacing--50);padding-bottom:8rem;padding-left:var(--wp--preset--spacing--50)"><!-- wp:columns -->
<div class="wp-block-columns"><!-- wp:column -->
<div class="wp-block-column"><!-- wp:heading {"textAlign":"left","level":3,"style":{"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"textColor":"background","fontSize":"large"} -->
<h3 class="wp-block-heading has-text-align-left has-background-color has-text-color has-link-color has-large-font-size">Don't find what you're looking for? Search posts here.</h3>
<!-- /wp:heading --></div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column"><!-- wp:search {"label":"Search","showLabel":false,"placeholder":"E.g. \u0026quot;Botswana\u0026quot;","width":538,"widthUnit":"px","buttonText":"Search","style":{"border":{"width":"0px","style":"none","radius":"2px"},"typography":{"letterSpacing":"1px","fontStyle":"normal","fontWeight":"400","fontSize":"0.8rem"}},"backgroundColor":"background","textColor":"primary"} /--></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->

<!-- wp:template-part {"slug":"footer","tagName":"footer"} /--></div>
<!-- /wp:group -->

Note that newly created pattern copies the actual contents from the following patterns leaving them orphans.

<!-- wp:pattern {"slug":"adventurer/list"} /-->
<!-- wp:pattern {"slug":"adventurer/search"} /-->

Expectation

Pattern should reuse the existing patterns.

Contributor guide

Open the contributing guide

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 Adventurer theme by editing home, adding an image block, and using CBT's "Save changes" or "Export" options. Compare the generated home pattern with the original home.html and the adventurer/list and adventurer/search pattern references. Done means the existing patterns remain referenced and are not copied into a new orphaned pattern.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
tooling
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.