I am trying to run an Event on my Child Component when the Datable row is selected on my Parent Component.  
I am receiving the error below

Here is the Event code from my Child Component

    handleCancel(event){
        const inputFields = this.template.querySelectorAll( 'lightning-input-field' );
        if ( inputFields ) {
            inputFields.forEach( field => {
            field.reset();
            this.showSaveButton = false;
            } );   
        }
    }

Here is the Event code from my Parent Component

    handleRowSelection(event){
            var selectedRows=event.detail.selectedRows;
            if(selectedRows.length>1)
            {
                var el = this.template.querySelector('lightning-datatable');
                selectedRows=el.selectedRows=el.selectedRows.slice(1);
                event.preventDefault();
                return;
            }
            this.werRecordId = selectedRows[0].Id;
            this.template.querySelector('c-work-experience-record-page').handleCancel(event.target.value);
            this.werSelectedRow=true;
        }

Error 

    [NoErrorObjectAvailable] Script error.
    a()@https://static.lightning.force.com/cs196/auraFW/javascript/nv49ahbZfs85wzJXOZaywA/aura_prod.js:1000:112
    {anonymous}()@https://static.lightning.force.com/cs196/auraFW/javascript/nv49ahbZfs85wzJXOZaywA/aura_prod.js:1000:305
    dispatchEvent()@https://static.lightning.force.com/cs196/auraFW/javascript/nv49ahbZfs85wzJXOZaywA/aura_prod.js:13:46387
    Na.dispatchEvent()@https://static.lightning.force.com/cs196/auraFW/javascript/nv49ahbZfs85wzJXOZaywA/aura_prod.js:13:13839
    Na.fireSelectedRowsChange()@https://falcon-pe--dxtest.sandbox.lightning.force.com/components/lightning/datatable.js:1:95086
    Na.zn()@https://falcon-pe--dxtest.sandbox.lightning.force.com/components/lightning/datatable.js:1:49259
    Na.handleSelectionCellClick()@https://falcon-pe--dxtest.sandbox.lightning.force.com/components/lightning/datatable.js:1:93785