Blocks repeated twice with custom content when set in a certain order

My problem seems somewhat similar to https://forum.grabaperch.com/forum/10-27-2015-custom-content-repeated-twice-using-blocks

I think I can guess what's happening though and wondering if it's a bug, or unintended side effect of how blocks work.

Here is a short 2 min video so you can see my demonstration, in case it helps understand my issue.

What I'm trying to do is fetch just the heading from my blocks template process/blocks.html and output it in different markup using my other blocks template called buttons-for-blocks.html

Here is a simplified version of my page template—page.php:

<?php
/* Standard stuff here */
include('perch/runtime.php');
perch_layout('global/head');

/* Create some content using a blocks template */
perch_content_create('Content', array(
    'template' => 'process/blocks.html',
    'edit-mode' => 'singlepage',
    'multiple' => false,
));
?>

<article>
    <?php
                /* First output some buttons through a template that only contains the "heading" block */
        perch_content_custom('Content', array(
            'template'   => 'process/buttons-for-blocks.html',
        ));
               /* Then output standard content from all the blocks */
           perch_content('Content');
    ?>
</article>

<?php perch_layout('global/footer'); ?>

Here are my two block templates… The first one "buttons for blocks" just contains one block that outputs the heading for each section (buttons-for-blocks.html)

Buttons for Blocks

<perch:blocks>

    <perch:block type="process_heading" label="Process Heading">
        <div class="c-btn">
            <a href="#<perch:content id="slug"/>">
                <svg aria-labelledby="title-<perch:content id="process_icon_name" type="select" label="Icon" options="Pen|pen, Clipboard|clipboard, Strategy|strategy" allowempty="true"/>" role="img" class="c-jg-icon c-jg-icon--<perch:content id="process_icon_name"/>">
                    <use xlink:href="/svg-icons/symbol-defs.svg#c-jg-icon--<perch:content id="process_icon_name"/>"></use>
                </svg> <perch:content id="process_heading" type="text" label="Heading" size="l" />
            </a>
        </div>
    </perch:block>

</perch:blocks>

The second set of blocks which includes the heading and also a text block (process/blocks.html)

Full Blocks

<perch:blocks>

    <perch:block type="process_heading" label="Process Heading">
        <div id="<perch:content id="slug" for="process_heading" type="slug" />">
            <h2>
                <svg aria-labelledby="title-<perch:content id="process_icon_name" type="select" label="Icon" options="Pen|pen, Clipboard|clipboard, Strategy|strategy" allowempty="true"/>" role="img" class="c-jg-icon c-jg-icon--<perch:content id="process_icon_name"/>">
                    <use xlink:href="/svg-icons/symbol-defs.svg#c-jg-icon--<perch:content id="process_icon_name"/>"></use>
                </svg> <perch:content id="process_heading" type="text" label="Heading" size="l" />
            </h2>
        </div>
    </perch:block>

    <perch:block type="process_text" label="Text">
           <perch:content id="text" type="textarea" editor="markitup" label="Text" markdown="true" html="true" size="l" />
    </perch:block>

</perch:blocks>