STR:

1. Visit the new HTML-based about:config

2. Type any non-existent pref e.g., non-existent-pref

3. The following will be rendered:

   non-existent-pref     o Boolean o Number o String   [Add]
   

4. Click on the "Number" text label.

Expected:

• The radio input before "Number" should be selected.

Actual:

• Nothing happens. To select the desired type I now need to aim my mouse pointer at the radio box and click there.

This is easy to fix, just create a <label> element, and append the input+span to that element instead of form, and then append that label to the form at https://searchfox.org/mozilla-central/rev/4587d146681b16ff9878a6fdcba53b04f76abe1d/browser/components/aboutconfig/content/aboutconfig.js#229,232

This just bit me... I actually clicked several times because I was so incredulous it didn't work. We shouldn't ship without fixing trivial stuff like this.

I'm reopening this bug because the solution described in comment 0 was the correct one, while the implementation in bug 1576943 uses an ID which breaks the case of multiple forms shown on the page. I'll write a patch to fix this.

https://hg.mozilla.org/mozilla-central/rev/ef66bc33c166

https://hg.mozilla.org/mozilla-central/rev/ef645e35877a

Confirmed issue with 67.0a1 (2019-02-26) on Widnows 10.
Verified fix with 71.0b5 on Windows 10, Ubuntu 18.04, 71.0b3 on macOS 10.14.