title: hiding a "No file chosen" tooltip in Javascript
body: <p>I know there are many question about it, but they don't answer properly.
  After readings and looking for, I tried this:</p>
  
  <pre><code>&lt;input id="ext-element-47" class="x-input-file x-input-el" type="file" accept="" style="display:none"&gt;
  </code></pre>
  
  <p>hiding the file-input and then</p>
  
  <pre><code>this.element.down(".x-input-file").dom.click();
  </code></pre>
  
  <p>this works on Chrome's console but in my JS code it doesn't. It doesn't click.</p>
  
  <h2>Anyone knows why? and what can I do for make click?</h2>
  
  <blockquote>
    <p>Notes:
    I need to make click because the file element is not visible and so when it clicks it does not show unless I do element.click ().</p>
  </blockquote>
  
  <p>Here is an example what I'm doing:
  <div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>document.getElementsByClassName('o-file-field-input')[0].click()</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.o-file-field-input {
    display: none;
  }
  
  .o-big-btn {
    background-color: red;
    height: 3em;
    width: 3em;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="x-container x-unsized o-cont-option" data-componentid="ext-container-5" id="ext-container-5"&gt;
    &lt;div class="x-inner x-align-center x-pack-center x-horizontal x-layout-box" id="ext-element-50"&gt;
      &lt;div class="x-button x-button-plain open-field-icon o-big-btn x-layout-box-item x-flexed x-stretched" id="ext-OUI_BaseButton-1" data-componentid="ext-OUI_BaseButton-1" tabindex="0" style="-webkit-box-flex: 1;"&gt;
        &lt;span class="x-button-icon x-shown smf smf-upload-file" id="ext-element-45"&gt;&lt;/span&gt;
        &lt;div class="o-button-bg"&gt;&lt;/div&gt;
        &lt;div class="x-unsized x-field-input x-has-height" id="ext-fileinput-1" data-componentid="ext-fileinput-1" style="height: 38px;"&gt;
          &lt;input id="ext-element-47" class="x-input-file x-input-el o-file-field-input" type="file" accept=""&gt;
          &lt;div class="x-field-mask x-hidden-display" id="ext-element-48"&gt;&lt;/div&gt;
          &lt;div class="x-clear-icon" id="ext-element-49"&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>See ya!</p>