Twice rendering the HTML element content with the initial data

[mojtaba-khallash]

Describe the bug

Consider a form contains HTML element, its content will be displayed correctly in normal mode. But if we setup form with initial data, the content of the HTML element will be rendered twice.

Version/Branch
Formiojs version 4.21.2

To Reproduce

• form schema

var schema = {
  "display": "form",
  "components": [
	{
	  "label": "Version",
	  "key": "version",
	  "type": "textfield"
	},
	{
	  "label": "First Name",
	  "key": "firstName",
	  "type": "textfield"
	},
	{
	  "label": "Last Name",
	  "key": "lastName",
	  "type": "textfield"
	},
	{
	  "label": "HTML",
	  "content": "<h1>hello</h1>",
	  "key": "html",
	  "type": "htmlelement"
	}
  ]
};

• form setup

Formio.createForm(document.getElementById('formio'), schema).then(function(form) {
  form.submission = {
	data: {
	  version: Formio.version,
	  firstName: 'Joe',
	  lastName: 'Smith'
	}
  }; 
});

• Live demo

Expected behavior
HTML content is expected to be rendered once but twice.

Screenshots

[lane-formio]

We actually have a dev actively investigating this issue this week.
For internal reference: FIO-8423

[fuadkhan1996]

Is there any progress on it? I'm facing the same issue.

[lane-formio]

For 4.21.x we had to apply a workaround to resolve this behavior. To fix our own forms we changed the default html tag to "div" (from "p") and had to remove any html from the content that was registering as invalid.

Otherwise, this will be resolved in our 5.x official release. (Should be working in the latest 5.0.0-rc version)