form builder: edited labels result in visible markup on public display
When I created a form using Form Builder, edited a label, and then viewed the results as a standalone webpage, the edited labels unexpectedly displayed markup, which I believe to be a bug.
- I created at Form Builder form at https://dmaster.demo.civicrm.org, titled Form Title Here, located at https://dmaster.demo.civicrm.org/civicrm/form-title-here
- I exposed the form as a standalone webpage, by entering civicrm/form-title-here into the field, Page, located under form settings > Placement
- I added a few fields associated with an organization contact to my form. These included a fieldset which contained an address block, as well as a supplemental address 1 field.
- I edited the labels for Street Address and Supplemental Address 1 fields.
- I viewed the form at https://dmaster.demo.civicrm.org/civicrm/form-title-here and found markup displayed along with the label. See screenshot.
Here is my form's markup
<af-form ctrl="afform">
<af-entity data="{contact_type: 'Organization', source: 'Form Title Here'}" type="Contact" name="Organization1" label="Organization 1" actions="{create: true, update: true}" security="RBAC" />
<fieldset af-fieldset="Organization1" class="af-container" af-title="Org 1">
<div af-join="Address" af-repeat="Add" min="1">
<div class="af-container af-layout-inline">
<af-field name="street_address" defn="{label: '<span class="ng-pristine ng-untouched ng-valid ng-binding ng-isolate-scope ng-not-empty" contenteditable="true">Street Address 1</span>', input_attrs: {}}" />
<af-field name="supplemental_address_1" defn="{label: 'Street Address 2', input_attrs: {}}" />
</div>
<div class="af-container af-layout-inline">
<af-field name="city" />
<af-field name="country_id" defn="{afform_default: '1228', input_attrs: {}}" />
<af-field name="state_province_id" />
<af-field name="postal_code" />
</div>
</div>
</fieldset>
<button class="af-button btn btn-primary" crm-icon="fa-check" ng-click="afform.submit()">Submit</button>
</af-form>