I have to automate the file upload functionality, wherein I've to select text file through the browse button. The file upload html block has following components:
<input id="abc" class="def" accept=".txt" ng-model="xxx" placeholder="Text file" readonly="" required="" style="">
<button id="browse_button_id" type="file" ngf-select="upload( $file,'text')" accept=".txt" ng-show="showBrowseButton" class="xxx" style="">Browse</button>
the behaviour is that once you select file through browse button click, that file name appears in above given input field, which is then verified for extension and then submit button appears.
Using the cypress-file-upload module, I can attach a file to the browse button but cannot change the input field's value as it is readonly.
Any solution to how I could achieve the desired functionality.