[SalesForce] How to trigger a click() event on LWC element

I'm trying to trigger a click event on file upload element in LWC but not able to do that. it doesn't throw any error or any file selection prompt. what I'm trying to achieve is clicking on a button should prompt me the file selection prompt which I usually get when I click on a file input element.
In the traditional JS way I can simply write element.click() and it will trigger the respective click event on that element. Same thing I tried to do on the LWC element but it is not working.

Template code [HTML]

<template>
    <div class="standerdRelatedListCustom">
        <div class="slds-card slds-card_boundary">
            <lightning-card>        
                <h3 slot="title" title="Contracts">                    
                    <lightning-icon icon-name="doctype:attachment" alternative-text="Attachemet" size="small"></lightning-icon>
                    <b style="margin-left: 10px;">Addtional Documents</b>                    
                </h3>                
                <div slot="actions">
                    <template if:true={isLargeWidth} >                        
                        <lightning-button key={eachBtnRow.Name} label="Upload Files" onclick={uploadFileInput}></lightning-button>                        
                    </template>
                    <template if:false={isLargeWidth} >
                        <div class="slds-media__body slds-float_right">                                        
                            <div class="slds-dropdown-trigger">                                
                                <lightning-button-icon  icon-name="utility:down" variant="border-filled" alternative-text="" slot="actions" size="x-small"></lightning-button-icon>                                
                                <div class="slds-dropdown slds-dropdown_right">
                                    <ul class="slds-dropdown__list slds-dropdown--length-1" role="menu">                                        
                                        <li class="slds-dropdown__item" role="presentation">
                                            <lightning-button variant="base" label="Upload Files"  onclick={uploadFileInput} class="slds-m-left_x-small"></lightning-button>
                                        </li>                   
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </template>
                </div>      
                <div  slot="footer">  
                    <template if:true={isMoreData}>                      
                        <p slot="footer"><a onclick={openAllRecords}>View All</a></p>  
                    </template>                      
                </div>     
                <!-- Standard Related List Data Here-->
                <div class="slds-card__body slds-card__body_inner">                    
                    <lightning-input type="file" class="customFileInputClass"  onchange={handleFilesChange} onnotify={test} multiple></lightning-input>                    
                </div>              
            </lightning-card>
        </div>
    </div>

</template>

Component JS

import { LightningElement } from 'lwc';

export default class addComponentDocument extends LightningElement {
    uploadFileInput(){        
        // let FileSelector = this.template.querySelector(`.customFileInputClass`);
        // FileSelector.click(); 
        try {
            console.log('test');
            let entitySelectRow = this.template.querySelector('div.standerdRelatedListCustom');
            let fileUploadBtn = entitySelectRow.querySelector('lightning-input.customFileInputClass'); 
            fileUploadBtn.click();
        } catch (error) {
            console.log(error);
        }


    }

}

Best Answer

+1 to @sfdcfox, A sample example to open a file selector prompt on clicking of a button is here in this playground:- Playground

<template>
   <input id="fileInput" type="file" style="display:none;" />
   <input type="button" value="Choose Files!" onclick={handleclick}/>
</template>

JavaScript

handleclick(){
    this.template.querySelector('input').click();
}