cmp.find(...).getElement is not a function salesforce lightning

Question

Below is my code where i am trying to create a typehead component. But its giving error

cmp.find(...).getElement is not a function

How to resolve this issue.

component -

<aura:component implements="flexipage:availableForAllPageTypes" access="global" controller="AccountController" >

    <ltng:require scripts="{!$Resource.rxjs2}" afterScriptsLoaded="{!c.autoComplete}"/>
    <ltng:require scripts="/resource/Lgt_InputLookup/js/jquery-2.2.4.min.js,
                /resource/Lgt_InputLookup/js/bootstrap.min.js,
                /resource/typeahead" 
                  styles="/resource/Lgt_InputLookup/css/bootstrap.min.css" />

    <aura:attribute name="accounts" type="Account[]"/>

    <form class="slds-form--stacked">
        <div class="slds-form-element">
            <label class="slds-form-element__label" for="name">Name</label>
            <div class="slds-form-element__control">
                <ui:inputText aura:id='atcmplbox' class="slds-input" updateOn="keyup"/>
            </div>
        </div>
        <div class="slds-form-element">
            <label class="slds-form-element__label" for="email">Email</label>
            <div class="slds-form-element__control">
                <input id="email" class="slds-input" type="text" />
            </div>
        </div>

        <div class="slds-form-element">
            <button class="slds-button slds-button--brand" type="button">Update</button>
        </div>
    </form>
    <datalist id="acctlist">
        <aura:iteration items="{!v.accounts}" var="account">
            <option value = "{!account.Name}"/>
        </aura:iteration>
    </datalist>

</aura:component>

Controller -

({
    autoComplete : function(cmp, event, helper) {

        helper.autoComplete(cmp);

    }
})

helper -

({
    autoComplete: function(cmp) {

        var self = this;
        var test = cmp.find('atcmplbox');
        console.log(cmp.find('atcmplbox').getElement());
    }
})

Render -

({
    afterRender : function(cmp,helper){
        return this.superAfterRender();
    }
})

Answer 1

Your atcmplbox is a ui component, what makes it part of the ui namespace.

<ui:inputText aura:id='atcmplbox' class="slds-input" updateOn="keyup"/>

So find() will not return a public SecureComponent, but a SecureComponentRef.

You won't have access to it's Element since SecureComponentRef is not providing these methods. Read this to understand why this is happening.

These are the different methods, first SecureComponent second SecureComponentRef

Some Code in case you want to play around:

<aura:application extends="force:slds">
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    <div aura:id="div" />
    <lightning:input aura:id="input" name="input1" label="Enter some text" />
</aura:application>

({
    doInit : function(cmp, evt, helper) {
        console.log(cmp.find("div"));
        console.log(cmp.find("input"));
    }
})