Image not refreshed in Chrome browser after source changed

I am using 7.2.11 and running on Chrome. I have a screen that changes some text fields and an Image source (from byte array) in a listener. When the listener is triggered, the text fields in the form are updated but the image disappears. If I switch to another window and then go back to Chrome, the image is shown. This is the not the same in Firefox. In Firefox, both the text fields and Image are updated when the listener is triggered.

How do I make the image show in Chrome after the source is changed. ?


Could you share a code where you set an image source? I’ve tried to set different streams by a button click, and the image is changed.

public void onInit(InitEvent event) {
sagemReader.setListener(ev -> {
JSONObject json = new JSONObject(ev);
if (json.has(“error”)) {
.withCaption(messages.getMessage(getClass(), “systemError”))


        Mykad mykad = new Mykad();

        if (json.has("image")) {
            byte[] bytes = Base64.getDecoder().decode(json.getString("image"));
            image.setSource(StreamResource.class).setStreamSupplier(() ->
                    new ByteArrayInputStream(bytes))


        events.publish(new MykadFragmentEvent(this, mykad));

Unfortunately, still cannot reproduce the issue. I can suggest debugging the listener code to check that it works as expected.

The listener is working. As I mentioned, using Firefox browser, the image shows up immediately after I change the StreamResource content. But in Chrome and MS Edge browser, the image doesn’t show up until I resize the window or switch to another window and back. It looks like Vaadin component is not refreshing the image in Chrome/Edge and working fine in Firefox.

Could you reproduce it in a small demo project and share it?

Sorry. Found the problem. There is something wrong with the image I used.