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