Handling merge conflicts from upgrading your theme

When you upgrade your theme, UltraCart performs looks at all the files within your theme that have been modified.  If the file has been modified then UltraCart will calculate two sets of change records:

• Previous Version and Your Modified Version
• Previous Version and New Version

As long as none of the changes occur within the same region of the Previous Version then the merge will be clean and no conflicts will occur. However if you modified line 100 of a template and the theme developer also modified line 100 in a different way then a merge conflict will occur.  

UltraCart does a pre-upgrade check to see if any merge conflicts are going to occur.  If so, the system will force you to:

• duplicate your theme
• upgrade the duplicate
• resolve the merge conflicts
• activate the new theme

This will protect your production site during the upgrade process.  At the end of an upgrade, if there are merge conflicts the result dialog will tell you the file paths of the templates in conflict.  

To find and resolve the merge conflicts first navigate to the File Manager as shown below.

Now click on the Merge Conflicts search icon shown in the toolbar.  This will find all the file within your StoreFront that have merge conflicts.  You will also notice that the words "merge conflict" appear in brackets to the right of the version number if the file contains any conflicts.

Now, when you click on the file name it will open up the file editor.

When the file editor first appears there will be a warning at that top indicating that the file contains merge conflicts like the example below.  You can click on the orange warning and it will dismiss.

The next step is to look through the file and identify the block of merge conflict HTML that needs to be fixed.  In this example we have the following block of code.

<<<<<<< /templates/template_item.vm[new theme]
        #if($item.isReviewable())
          <dd>
            <a href="#panel-product-reviews" id="product-reviews-tab" title="View this">
              <span class="show-for-medium-up">Product </span> Reviews
            </a>
          </dd>
        #end
||||||| /templates/template_item.vm[previous theme]
        <dd>
          <a href="#panel-product-reviews" id="product-reviews-tab" title="View this">
            <span class="show-for-medium-up">Product </span> Reviews
          </a>
        </dd>
=======
        <dd>
          <a href="#panel-product-reviews" id="product-reviews-tab" title="View this">
            <span class="show-for-medium-up">Product </span> Reviews
          </a>
        </dd>
        <dd>
          <a href="#panel-product-component" id="component-id-guide-tab" title="View this">
            <span class="show-for-medium-up"></span> Component ID Guide
          </a>
        </dd>
      <dd>
          <a href="#instructions" id="instructions-tab" title="View this">
            <span class="show-for-medium-up"></span> Instructions
          </a>
        </dd>
>>>>>>> /templates/template_item.vm[modified]

A merge conflict block is broken down into three parts that appear in the following order:

1. Content from the new version of the file (located between <<<<<<< and |||||||||)
2. Content from the previous version of the file (located between ||||||||||| and =========)
3. Modified content created by the merchant (located between ========== and >>>>>>>)

First you want to compare segments one and two to understand the intent of the change that the theme developer made.  In this example we can see that the theme developer was surrounding the dd tags with a new if statement.  Next we need to determine what the change we made was.  In this example we added a new dd tag for the Component ID Guide and a new dd tag for Instructions.  Now that we understand what both developers were trying to do we can come up with the resolution to the merge conflict.  In this case we want the final code to look line:

        #if($item.isReviewable())
        <dd>
          <a href="#panel-product-reviews" id="product-reviews-tab" title="View this">
            <span class="show-for-medium-up">Product </span> Reviews
          </a>
        </dd>
        #end
        <dd>
          <a href="#panel-product-component" id="component-id-guide-tab" title="View this">
            <span class="show-for-medium-up"></span> Component ID Guide
          </a>
        </dd>
        <dd>
          <a href="#instructions" id="instructions-tab" title="View this">
            <span class="show-for-medium-up"></span> Instructions
          </a>
        </dd>

So we would want to edit the file so that we remove everything between:

<<<<<<< /templates/template_item.vm[new theme]
>>>>>>> /templates/template_item.vm[modified]

and replace that section with our merge conflict resolution.  Upon saving the file UltraCart will notice that the merge conflict has been resolved.