Add support for more input types in form-fill and forms/set bricks

[twschiller]

Copied from https://github.com/pixiebrix/pixiebrix-extension/pull/1726#issue-764721859

• More events should be added for broader support
• Not all input fields are currently supported, like select for example
• Checkboxes and radios should be have differently when multiple elements with the same name attribute are selected. For example [name=color] with a value blue should check [name=color][value=blue], not _all fields with the name color
• Text editors like CodeMirrors are not supported

[fregante]

• Not all input fields are currently supported

A few years ago used the "deserialize" part of dom-form-serializer to replace the custom "field set" operation and support more field types:

However I think some/most of its logic is in this file: https://github.com/jefersondaniel/dom-form-serializer/blob/master/lib/InputWriters.js

• Text editors like CodeMirrors are not supported

This is a little complex as it needs to inject a reader into the unsafe context and set the value via CodeMirror’s API instead. I wrote this code before:

• https://github.com/fregante/GhostText/blob/765dc7a6834c6a7b47eeb67daf14c0ac3cff3ea6/source/unsafe-messenger.js
• https://github.com/fregante/GhostText/blob/765dc7a6834c6a7b47eeb67daf14c0ac3cff3ea6/source/ghost-text.js#L31-L68
• https://github.com/fregante/GhostText/blob/765dc7a6834c6a7b47eeb67daf14c0ac3cff3ea6/source/ghost-text.js#L314-L318

[twschiller]

This is a little complex as it needs to inject a reader into the unsafe context

Yes, I've taken a similar approach in a private extension that calls the API for Tiny MCE, another popular rich text editor component (via tinyMCE.activeEditor.setContent). We'll probably just need to create some definitions of common editor components: 1) how to detect them, 2) how to read the content, 3) how to set the content

I would vote we hold off on supporting these editors though until we get interest for them