Can't handle an Application event in Lightning

Question

I am trying to handle Application event in a listening component but it doesn't work for some reason. Please, help. I can't write in console log "here" in the end

Application

<aura:application extends="force:slds" access="global">
    <c:SearchCmp/>
    <c:DisplaySearchResultCmp/>   
</aura:application>

Search Component

<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes" access="global" >
    <aura:registerEvent name="searchEvt" type="c:SearchEvent" />
    <aura:attribute name="inputSearch" type="String"/>
    <div>
        <lightning:input label="Search for books and writers:" value="{!v.inputSearch}"/>
    </div>
    <lightning:button
        label="Search"
        onclick="{!c.getInput}" />
</aura:component>   

Search Component Controller

getInput : function(component, event, helper) {
    helper.fireAppAction(component, event);
}

Search Component Helper

fireAppAction : function(component, event) {
        var appEvent = $A.get("e.c:SearchEvent");
        appEvent.setParams({
            "searchQuery": component.get("v.inputSearch")
            });
        appEvent.fire();
    }

Result Component

<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes"  access="global" controller="SearchCmpController">

    <aura:handler name="showResultList" event="c:SearchEvent" action="{!c.searchData}"/>

   <aura:attribute name="resultWrappers" type="SearchCmpController.BookWriterWrapper[]"/>
    <aura:attribute name="isEmptyResult" type="Boolean" default="true"/>

    <div>
        <div class="{!v.IsEmptyResult ? 'disp' : 'slds-hide'}">Results</div>
        <div class="{!v.IsEmptyResult ? 'slds-hide' : 'disp'}">No Results</div>
    </div>

</aura:component>

Result Component Controller

searchData : function(component, event, helper) {
        console.log("here");
        component.set("v.resultWrappers", true);
    }

Event "SearchEvent"

<aura:event type="APPLICATION">
    <aura:attribute name="searchQuery" type="String"/>
</aura:event>

Answer 1

You will need to remove the name attribute from your Result Component while declaring the handler.

From documentation:

The handler for an application event won’t work if you set the name attribute in <aura:handler>. Use the name attribute only when you’re handling component events.

So on your Result Component, your handler declaration should be written as (notice there’s no name attribute):

<aura:handler event="c:SearchEvent" action="{!c.searchData}"/>