Google Maps Autocomplete InvalidValueError: not an instance of HTMLInputElement

I've read through a few different S.O. questions on this one and haven't been able to find anything indicating what I might be missing here. I'm very new to Ember, so it's possible that I've got this code in the wrong place. Regardless, here's what I've got:

../components/auto-complete.js

import Ember from 'ember';

export default Ember.Component.extend({
  didRender: function(){
    var defaultBounds = new google.maps.LatLngBounds(
      new google.maps.LatLng(-90, -180),
      new google.maps.LatLng(90, 180)
    );
    var options = {
      bounds: defaultBounds
    }
    var i = Ember.$('input');
    var autocomplete = new google.maps.places.Autocomplete(i, options);
  }
});

../components/auto-complete.hbs

<input id="input-user" class="controls" type="text" placeholder="Location"
          onfocus="autocomplete">

My console output

I've looked at the tutorial, docs, etc. and there doesn't seem to be that much room for error here. I've also tried without the onfocus="autocomplete" Any and all advice would be appreciated.