Css url's in template resolve incorrectly in Chrome

[sorvell]

Adding this to the stagingDocument at

https://github.com/Polymer/TemplateBinding/blob/master/src/TemplateBinding.js#L259

can help address this issue:

var base = owner.stagingDocument_.createElement('base');
base.href = window.document.baseURI;
owner.stagingDocument_.head.appendChild(base);

See this blink bug for more info:

https://code.google.com/p/chromium/issues/detail?id=229142

[sorvell]

Here's the kind of usage that fails:

https://gist.github.com/sorvell/9138631

The platform repo partially addresses this here:

https://github.com/Polymer/platform-dev/blob/master/src/dom.js#L101

This fix does not address stamping templates that originate in HTMLImports. It's not clear to me exactly how this interacts with the template staging document.

[rafaelw]

I'm having trouble creating a tmp fix for this. something else is weird:

<template><div style="background: url(foo.jpg)"></div></template>
<script>
var t = document.querySelector('template');
var node = t.content.firstChild;

// uncomment me to see clone.style.backgroundImage resolve correctly. WAT?
// node.style.backgroundImage;

// "stagingDoc"
var doc = document.implementation.createHTMLDocument('');
var base = doc.createElement('base');
base.href = document.baseURI;
doc.head.appendChild(base);

// "instance node"
var clone = doc.importNode(node);

console.log(clone.style.backgroundImage);
</script>

Adam?

[rafaelw]

band aid applied: https://github.com/Polymer/TemplateBinding/commit/08008af605298aaf2d56ef34d4af4df70679ea61