JavaScript is not executed in Chrome

Hi there,

I want to use a MenuBar to do several things, like adding a new project, deleting projects but also uploading information. For that purpose, I execute a small JavaScript that clicks on a hidden Upload component. That works perfect in FireFox and Edge, but not in Chrome.

Any ideas why it does not work in Chrome?

project.addItem("Import Project",
			e -> JavaScript.getCurrent().execute("document.getElementsByClassName(\"gwt-FileUpload\")[0]
.click()"));

thanks
best regards

Could be a security restriction: https://blog.mariusschulz.com/2016/05/31/programmatically-opening-a-file-dialog-with-javascript

-Olli

So there is no chance to upload a File via a MenuBar?

You might need a custom client-side component, at least. So you need to react to the original click event on the menu item.

-Olli

Thanks. To be honest I have no idea how to do that.

I’m just thinking about why [this fiddle]
(http://jsfiddle.net/32na3/) looks like it is doing exactly the same but works in Chrome as well?!

I believe in that fiddle it’s different because the “click” call is still a reaction to a direct user event. When you have an event handler on the server side, you lose that connection and the browser has no way of knowing that the .click() wasn’t just some random JavaScript function. I’ve created this MenuBar extension that solves a similar issue with opening new windows: [https://github.com/OlliTietavainenVaadin/popup-menu-bar/]
(https://github.com/OlliTietavainenVaadin/popup-menu-bar/) - trying to open a new browser Window without a user event is typically stopped by popup blockers. You might be able to adapt this to your use case?

There’s also a lot of information about creating and modifying client-side widgets in the docs; you can start for example from here: https://vaadin.com/docs/v8/framework/clientsidewidgets/clientsidewidgets-overview.html

-Olli

Thank you Olli for your very detailed answer! I think your add-on is a good starting point for my problem. I will try adopt your solution on my problem.

Thanks!

No problem, I hope that you find a solution that works for you!