[Request] Render question titles in <label> instead of <h5>

Are you requesting a feature, reporting a bug or ask a question?

Feature

What is the current behavior?

The titles of form fields are rendered within a <h5> and <span> tag.

Taken from Vue version:

<h5><span style="position: static;"><span style="position: static;">Phone</span></span></h5>

What is the expected behavior?

For screen readers and usability it would be better if this could be rendered in a <label for="{fieldId}"> tag.

<label for="phone_field_id">Phone</label>

• surveyjs platform (angular or react or jquery or knockout or vue): Vue
• surveyjs version: v1.0.7

[kaphert]

For the one who is interested. The following event listener will do the trick by replacing the h5 tag with a label tag.

survey.onAfterRenderQuestion.add(function (sender, options) {
    let title = options.htmlElement.getElementsByTagName('H5')[0];
    if (title) {
        title.outerHTML = '<label for="'+ options.question.inputId +'" class="'+ title.className +'">'+ title.innerHTML +'</label>';
    }
});

[kaphert]

Above solution is not working because of: https://github.com/surveyjs/surveyjs/issues/930