Important Notice - Forums is archived
To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
CustomLayout URL's Incorrect
I am trying to add a custom layout that has a dynamic background image. I am using the following code
private static final String LAYOUT_TEMPLATE = "<div class=\"banner\" style=\"background-image: url('%s');\">"
+ "<div location=\"content\"></div>"
+ "</div>";
private static String layout(String url) {
return String.format(LAYOUT_TEMPLATE, url);
}
public ProfileBioComponent(String url) {
super();
String layout = layout(url);
System.out.println(layout);
super.setTemplateContents(layout);
System.out.println(super.getTemplateContents());
...
}
When I print out the values I am getting correct code:
<div class="banner" style="background-image: url('http://ih.imgur.com/fsbUP4Sh.jpg');"><div location="content" class="v-align-middle"></div></div>
<div class="banner" style="background-image: url('http://ih.imgur.com/fsbUP4Sh.jpg');"><div location="content" class="v-align-middle"></div></div>
But when it is actually rendered, it is prepending the background-image url with the theme/layouts directory:
<div class="banner" style="background-image: url( http://localhost:8080/VAADIN/themes/valo/layouts/'http://ih.imgur.com/fsbUP4Sh.jpg' );">
<div location="content" class="v-align-middle">...</div>
</div>
After a quick search I found this bug that mentions this happening in img src properties. I am guessing it is a similar fix. Should I submit a ticket?
Are there any work arounds that I can use in the mean time?
FUN FACT: If you change the single quotes to double quotes in the css url function then it works! The following is my final template that renders correctly.
private static final String LAYOUT_TEMPLATE = "<div class=\"banner\" style='background-image: url(\"%s\");'>"
+ "<div location=\"content\"></div>"
+ "</div>";
Solved...