diff --git a/lib/mixins/element-mixin.js b/lib/mixins/element-mixin.js
index 5fd49929f2..76b7f3ff28 100644
--- a/lib/mixins/element-mixin.js
+++ b/lib/mixins/element-mixin.js
@@ -488,9 +488,14 @@ export const ElementMixin = dedupingMixin(base => {
// or set in registered(); once the static getter runs, a clone of it
// will overwrite it on the prototype as the working template.
if (!this.hasOwnProperty(JSCompiler_renameProperty('_template', this))) {
- const protoTemplate = this.prototype.hasOwnProperty(
+ let protoTemplate = this.prototype.hasOwnProperty(
JSCompiler_renameProperty('_template', this.prototype)) ?
this.prototype._template : undefined;
+ // Accept a function for the legacy Polymer({_template:...}) field for
+ // lazy parsing
+ if (typeof protoTemplate === 'function') {
+ protoTemplate = protoTemplate();
+ }
this._template =
// If user has put template on prototype (e.g. in legacy via registered
// callback or info object), prefer that first. Note that `null` is
diff --git a/test/unit/behaviors.html b/test/unit/behaviors.html
index 6af4b6512b..25ebf85b47 100644
--- a/test/unit/behaviors.html
+++ b/test/unit/behaviors.html
@@ -347,6 +347,23 @@
]
});
+ const getTemplateFromFunction = () => html`
[[prop]]
`;
+ Polymer({
+ is: 'template-from-function',
+ properties: { prop: {value: 'from-function'} },
+ _template: getTemplateFromFunction
+ });
+
+ const getTemplateFromBehaviorFunction = () => html`[[prop]]
`;
+ const functionTemplateBehavior = {
+ _template: getTemplateFromBehaviorFunction
+ };
+ Polymer({
+ is: 'template-from-behavior-function',
+ properties: { prop: {value: 'from-behavior-function'} },
+ behaviors: [functionTemplateBehavior]
+ });
+
window.ModifyObserversBehavior = {
__barChangedCalled: 0,
@@ -495,6 +512,19 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -649,7 +679,6 @@
});
-
suite('multi-behaviors element', function() {
var el;
@@ -792,6 +821,24 @@
});
+suite('template from function', function() {
+
+ test('template function assigned to _template', () => {
+ var el = fixture('from-function');
+ const div = el.shadowRoot.querySelector('#from-function');
+ assert.ok(div);
+ assert.equal(div.textContent, 'from-function');
+ });
+
+ test('template function assigned to _template in behavior', () => {
+ var el = fixture('from-behavior-function');
+ const div = el.shadowRoot.querySelector('#from-behavior-function');
+ assert.ok(div);
+ assert.equal(div.textContent, 'from-behavior-function');
+ });
+
+});
+