Show the delete button for filled multilingual name fields even if no name tag is present (close #7572)

Focus the language input when clicking a multilingual name field label instead of deleting the value
Be more lenient with `utilUniqueDomId` function input

modules/ui/fields/localized.js

@@ -10,7 +10,7 @@ import { services } from '../../services';
 import { svgIcon } from '../../svg';
 import { uiTooltip } from '../tooltip';
 import { uiCombobox } from '../combobox';
-import { utilArrayUniq, utilEditDistance, utilGetSetValue, utilNoAuto, utilRebind } from '../../util';
+import { utilArrayUniq, utilEditDistance, utilGetSetValue, utilNoAuto, utilRebind, utilUniqueDomId } from '../../util';
 
 var _languagesArray = [];
 
@@ -493,12 +493,15 @@ export function uiFieldLocalized(field, context) {
         var entriesEnter = entries.enter()
             .append('div')
             .attr('class', 'entry')
-            .each(function() {
+            .each(function(_, index) {
                 var wrap = d3_select(this);
 
+                var domId = utilUniqueDomId(index);
+
                 var label = wrap
                     .append('label')
-                    .attr('class', 'field-label');
+                    .attr('class', 'field-label')
+                    .attr('for', domId);
 
                 var text = label
                     .append('span')
@@ -536,6 +539,7 @@ export function uiFieldLocalized(field, context) {
                 wrap
                     .append('input')
                     .attr('class', 'localized-lang')
+                    .attr('id', domId)
                     .attr('type', 'text')
                     .attr('placeholder', t('translate.localized_translation_language'))
                     .on('blur', changeLang)
@@ -570,6 +574,10 @@ export function uiFieldLocalized(field, context) {
 
         entries.order();
 
+        entries.classed('present', function(d) {
+            return d.lang && d.value;
+        });
+
         utilGetSetValue(entries.select('.localized-lang'), function(d) {
             return localizer.languageName(d.lang);
         });

modules/util/util.js

@@ -510,8 +510,8 @@ export function utilSafeClassName(str) {
 // Returns string based on `str` that is highly unlikely to collide with an id
 // used previously or that's present elsewhere in the document. Useful for preventing
 // browser-provided autofills or when embedding iD on pages with unknown elements.
-export function utilUniqueDomId(str) {
-    return 'ideditor-' + utilSafeClassName(str) + '-' + new Date().getTime().toString();
+export function utilUniqueDomId(val) {
+    return 'ideditor-' + utilSafeClassName(val.toString()) + '-' + new Date().getTime().toString();
 }
 
 export function utilUnicodeCharsCount(str) {