True. Although whenever I see a jQuery plugin like that I try to replace it with some combination of "components" [1]. There is a lot of progress in that area.

There are stuff like : File picker [2], dropdown [3], tip [4] for tooltips and many more.

1 : https://github.com/component

2 : https://github.com/component/file-picker

3 : https://github.com/component/dropdown

4 : http://component.github.io/tip/

What is this "components"? I can't find anywhere that explains what it is. Is it just a random collection of javascript utilities?

It's an isolated collection of HTML, js, and scss to achieve a thing. Like a credit card payment form.

They're mainly for react, though other platforms have them (eg, I use 'ractive', from the guardian, which has its own component model).

Go check out npm, there are a while bunch of react components you can just pick up and use.

It was like browserify before browserify. It was a TJ project that was abandoned and replaced by Duo.

CBP (component based programming) has been around (at least the idea has) since the 60s. It is the holy grail of some developers; being able to compose apps from a collection of components that work everywhere. I don't believe anyone has ever truly reached that goal. But surely it'll work this time because of JavaScript.

The dropdown and tooltips look useful, but FYI it's really simple to make a file picker. Just put a hidden input type="file" on the page, then:

    document.getElementById("that-element").addEventListener("change", function(e) {
        // e.target.files
    });
    document.getElementById("that-element").click();

It's not so easy

    document.getElementById("that-element").click();

doesn't exist. You need to use something like

        /** Creates the click on the input */
        const clickEvent = document.createEvent( "MouseEvents" );
        clickEvent.initEvent( "click", true, false );
        document.getElementById("that-element").dispatchEvent( clickEvent );

References :

1 : https://developer.mozilla.org/en-US/docs/Web/API/EventTarget...

2 : http://stackoverflow.com/questions/6367339/trigger-a-button-...

EDIT ( sorry can't reply to you, because HN ) :

Relevant jQuery discussion

3 : https://github.com/jquery/jquery/issues/2476

Here's code I wrote a while ago that did exactly what I specified and worked in production on all major browsers:

https://github.com/MediaCrush/MediaCrush/blob/master/scripts...

Here's the code in the jQuery library you linked to that does exactly this as well:

https://github.com/component/file-picker/blob/master/index.j...

It has some problems with input type=file elements.

The devil is in the details, although obviously your code works for any other clickable elements.

1 : https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement... 2 : http://stackoverflow.com/questions/210643/in-javascript-can-...