A click on an angular js anchor button should open a kind of modal window (not a browser popup). However after the click I do not get the content of the new modal window.
I checked the other posts and have ensured that javascript is excecutable and I also added the wait function, but the resulting web page is the same as in the beginning - and the <input> element with name="file" is not found.
What do I have to change to make it work?
This is the relevant button:
<a href="" ng-click="openUploadFileModal()" tooltip="Upload" tooltip-placement="bottom"><i class="fa fa-upload"></i></a>
My java code:
WebClient webClient = new WebClient();
webClient.getOptions().setThrowExceptionOnScriptError(false);
webClient.setAjaxController(new NicelyResynchronizingAjaxController());
HtmlPage p = webClient.getPage(activeProject);
Optional<HtmlAnchor> anchor = p.getAnchors().stream()
.filter(a -> a.getAttribute("ng-click").equals("openUploadFileModal()")).findFirst();
anchor.ifPresent(x -> {
HtmlPage uploadPage;
try {
uploadPage = x.click();
webClient.waitForBackgroundJavaScript(10000);
System.out.println(uploadPage.getWebResponse().getContentAsString());
System.out.println(uploadPage.getElementByName("file"));
} catch (IOException e) {
e.printStackTrace();
}
});
On the page the following div should appear:
<div class="qq-uploader">
<div class="qq-upload-drop-area" style="display: none;"><span>Drop files here to upload</span></div>
<div class="qq-upload-button btn btn-primary btn-lg" style="position: relative; overflow: hidden; direction: ltr;">
<div>Upload</div>
<input multiple="multiple" name="file" type="file"></div>
<span class="or btn-lg"> or </span>
<span class="drag-here btn-lg">drag here</span>
<span class="qq-drop-processing"><span>Processing dropped files...</span><span class="qq-drop-processing-spinner"></span></span>
<div class="small"></div>
<ul class="qq-upload-list"></ul>
</div>
In Firefox it looks like this:
