title: QUnit - testing a searchbox
body: <p>I'm trying to test out my custom <a href="http://www.jmagicbox.16mb.com/dist/jquery-magicbox.js" rel="nofollow">jquery plugin</a> that is very similar to <a href="https://jqueryui.com/autocomplete/" rel="nofollow">query-ui.autocomplete</a>. Once applied to a input element, it's able to search entries in a db table based on what's in the <code>.input-box</code>. Once the javascript finds any matches in DB,it spawns another element <code>.suggestion-box</code> under the <code>.input-box</code>. And populates the <code>.suggestion-box</code> element with all the results.</p>
  
  <p>My intention is to : </p>
  
  <ul>
  <li>manually trigger a click event on '.input-box'</li>
  <li>check '.suggestion-box' for any 'li' elements.</li>
  </ul>
  
  <p><strong>input element:</strong></p>
  
  <pre><code>&lt;input class="widget input-box default" id="" type="text" value="type a car name"&gt;
  </code></pre>
  
  <p>The search functionality itself is working as expected,it's just that I'd like to run couple of tests using <strong>QUnit</strong>. </p>
  
  <p>So far I only have this: </p>
  
  <pre><code>QUnit.module( "group B" );
  QUnit.test( "a test", function( assert ) {
    assert.expect( 1 );
    var $input_box =  $(".widget.input-box" );
    $input_box.on( "click", function(e) {
      assert.ok( true, "Input-box was clicked" );
      console.log($('ul', $(".suggestion-box")).length);
    });
    $input_box.val('B')
    $input_box.click();
  });
  </code></pre>
  
  <p>After running this, I could clearly see that the 'click' event was triggered properly as well as the search function. And even though it returned some results back, the QUnit test still reporting zero results. </p>
  
  <p>Is there any way to test this purely using <strong>Qunit</strong> or do I need to use any other plugins? </p>