Native HTML input vs. Atom


I’m wondering what Atom’s philosophy is regarding standard HTML elements such as password, number and color inputs. The list of possible inputs per the spec is fairly long:

Several related questions have been asked:

Answers to the above questions include recommendations to reimplement native behavior by hacking atom-text-editor, or to use (broken) native elements. Both approaches are quite limiting.

The problem with reimplementing all of these components for atom is that it’s redundant (Chrome already ships with working components), it’s error-prone (e.g. we would need to get all the details right regarding things like accessibility, security, etc) and not very straightforward in the case of hacking atom-text-editor.

The problem with native elements is that their behavior is largely broken in Atom. For example, backspace does not work, as documented in Backspace isn’t working in regular text fields :(. The suggested workaround is forcing Chrome’s native behavior by wrapping the input with an element of class “native-key-bindings”, but this in turn breaks focus switching via tab. Native inputs also need to be styled explicitly to conform to themes.

I see two options going forward:

  1. Atom embraces native input behavior and provides style support in the form of a themed base stylesheet.
  2. Atom provides Atom-esque equivalents of all common input types for developers to use.

Maybe there are additional options, but the current situation is hardly scalable as demand for different element types increases. What are your thoughts on this?


As you point out, the built-in controls aren’t completely broken. Yes, they do need to have the native-key-bindings class around them to properly integrate with all the Atom systems for key bindings, command handling and such. The atom-space-pen-views system makes this pretty simple. (You can see an example of how this works in my bug-report package.)

In addition, there is research going on, as it can, into a new view system for Atom:

Feel free to jump in and help out!


Also take a look at where there’s been some discussion about making Atom versions of text-area and text-input, among others.