Custom Lightning Component for Communities - throws error only in builder view

Question

So a weird error. I've created a lightning component to provide a custom detail page in communities to control access to fields we couldn't control with standard functionality. Initially, I was going to build the Tabs (like the standard detail layout) into the component using the <lightning:tabset> component, but since I've needed to remove the tab layout.

Here is my current page code: *note, I removed most of the fields just to improve readability, there are more fields in both the view and edit section and the edit section does include inputField components.

<aura:component implements="forceCommunity:availableForAllPageTypes,force:hasRecordId" access="global" controller="CommunityComponentController">
<aura:attribute name="recordId" type="String" />
<aura:attribute name="edit" type="Boolean" default="true"/>
        <aura:if isTrue="{!v.edit}">
            <lightning:recordViewForm recordId="{!v.recordId}" objectApiName="Case">
                <div class="slds-grid slds-gutters_large">
                    <div class="slds-col slds-size_6-of-12">
                        <div class="slds-form-element slds-form-element_edit slds-form-element_readonly slds-hint-parent">
                            <span class="slds-form-element__label">Case Owner</span>
                            <div class="slds-form-element__control">
                                <lightning:outputField fieldName="OwnerId" variant="label-hidden" class="slds-form-element__static"/>
                            </div>
                        </div>
                    </div>
                    <div class="slds-col slds-size_6-of-12">
                        <div class="slds-form-element slds-form-element_edit slds-form-element_readonly slds-hint-parent">
                            <span class="slds-form-element__label">Parent Case</span>
                            <div class="slds-form-element__control">
                                <lightning:outputField fieldName="ParentId" variant="label-hidden" class="slds-form-element__static"/>
                            </div>
                        </div>                            
                    </div>
                </div>
            </lightning:recordViewForm>
            <aura:set attribute="else">
                <lightning:recordEditForm recordId="{!v.recordId}" objectApiName="Case" aura:id="recordHandler" onsuccess="{!c.toggleEdit}">
                <div class="slds-grid slds-gutters_large">
                    <div class="slds-col slds-size_6-of-12">
                        <div class="slds-form-element slds-form-element_edit slds-form-element_readonly slds-hint-parent">
                            <span class="slds-form-element__label">Case Owner</span>
                            <div class="slds-form-element__control">
                                <lightning:outputField fieldName="OwnerId" variant="label-hidden" class="slds-form-element__static"/>
                            </div>
                        </div>                            
                    </div>
                    <div class="slds-col slds-size_6-of-12">
                        <div class="slds-form-element slds-form-element_edit slds-form-element_readonly slds-hint-parent">
                            <span class="slds-form-element__label">Parent Case</span>
                            <div class="slds-form-element__control">
                                <lightning:outputField fieldName="ParentId" variant="label-hidden" class="slds-form-element__static"/>
                            </div>
                        </div>
                    </div>
                </div>
                    <lightning:button label="Cancel" title="Neutral action" onclick="{! c.toggleEdit }"/>
                    <lightning:button variant="brand" label="Save" title="Brand action" type="submit" />
            </lightning:recordEditForm>
            </aura:set>
        </aura:if>
    </aura:component>

So this code right here give me a random error code:

An internal server error has occurred Error ID: 1257794140-105282 (-733430381)

It ONLY does this in the builder and if I publish and view the published community it looks fine with no errors.

HOWEVER, when the component included the tabset component to look like so:

<aura:component implements="forceCommunity:availableForAllPageTypes,force:hasRecordId" access="global" controller="CommunityComponentController">
    <aura:attribute name="recordId" type="String" />
    <aura:attribute name="edit" type="Boolean" default="true"/>
    <lightning:tabset>
        <lightning:tab>
            ... same code as above ...
        </lightning:tab>
    </lightning:tabset>
</aura:component>

It doesn't give an error and I can view the page in the builder.

Any ideas about what I'm doing wrong? My first though was that the <aura:if> tag needed to be wrapped in another component, but I couldn't find reference to this and attempting to wrap it in anything other than the tab/tabset doesn't fix it.

Answer 1

So unfortunately, I edited out one of the fields in the original question which caused the issue.

I had this:

<div class="slds-form-element__control">
    <lightning:outputField fieldName="Subject" variant="label-hidden" class="slds-form-element__static"/>
    <button class="slds-button slds-button_icon" title="Edit: Subject" onclick="{!c.toggleEdit}">
        <lightning:buttonIcon iconName="utility:edit" variant="bare"/>
            <span class="slds-assistive-text">Edit: Subject</span>
    </button>                               
</div>

but changing it to this fixed my issue:

<div class="slds-form-element__control">
    <lightning:outputField fieldName="Subject" variant="label-hidden" class="slds-form-element__static"/>
    <button class="slds-button slds-button_icon" title="Edit: Subject" onclick="{!c.toggleEdit}">
        <lightning:icon iconName="utility:edit" size="x-small" iconClass="slds-button slds-button_icon" />
            <span class="slds-assistive-text">Edit: Subject</span>
    </button>                               
</div>

the buttonIcon component broke the page with no actual error. If anyone can explain why?