<select> inside of a <label> causes incorrectly targeted click events #729
Description
I have noticed a problem when clicking on an <option> inside of a <select>, if it is nested inside of a <label>. I ripped out all of my CSS and was able to repro this with only the basic rmlui.rcss.
To wit. This basic example does work - the select box result changes when you click an option:
<select name="language" data-value="language">
<option value="en">$options:languageEnglish</option>
<option value="fr">$options:languageFrench</option>
<option value="de">$options:languageGerman</option>
<option value="it">$options:languageItalian</option>
<option value="es">$options:languageSpanish</option>
</select>This basic example also works:
<label>$options:language</label>
<select name="language" data-value="language">
<option value="en">$options:languageEnglish</option>
<option value="fr">$options:languageFrench</option>
<option value="de">$options:languageGerman</option>
<option value="it">$options:languageItalian</option>
<option value="es">$options:languageSpanish</option>
</select>However, this example does not work.
<label>$options:language
<select name="language" data-value="language">
<option value="en">$options:languageEnglish</option>
<option value="fr">$options:languageFrench</option>
<option value="de">$options:languageGerman</option>
<option value="it">$options:languageItalian</option>
<option value="es">$options:languageSpanish</option>
</select>
</label>The reason I'm nesting the elements like this is so clicking on any part of the larger element is like clicking on the select. I attempted to do some RCA and it appears that any OnClick on an <option> element ends up targeting <select> instead.
This is on RmlUi 6.0.