Commit fea46c77 authored by Evan W. Patton's avatar Evan W. Patton Committed by Jeffrey Schiller

Map empty URL to none for background-image CSS

When dragging a button or other component with an image from the
palette, its Image property is set, and when it is dropped, the
property is set again. This property is empty by default. In the
network devtools one can observe that this results in a request to the
root of the web server tagged as "img". This is because the
background-image CSS set in response to the Image property uses an
empty string URL, which will resolve against the base URL of the
page. This results in every new button created causing the browser to
fetch index.html twice. In production, we don't cache index.html so
that means every new button created by an App Inventor user causes
them to download ~6 kB of HTML that can't even be used. This fix
switches to setting background-image to none, which foregoes the
unnecessary network requests.

Change-Id: Ifc1165833b2c4aa9d412b0a929dca47381a0cfe8
parent f444e8b1
......@@ -59,7 +59,11 @@ public final class MockComponentsUtil {
* @param image URL
*/
static void setWidgetBackgroundImage(Widget widget, String image) {
if (image.isEmpty()) {
DOM.setStyleAttribute(widget.getElement(), "backgroundImage", "none");
} else {
DOM.setStyleAttribute(widget.getElement(), "backgroundImage", "url(" + image + ')');
}
DOM.setStyleAttribute(widget.getElement(), "backgroundRepeat", "no-repeat");
DOM.setStyleAttribute(widget.getElement(), "backgroundPosition", "center");
DOM.setStyleAttribute(widget.getElement(), "backgroundSize", "100% 100%");
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment