Add ability to define importMeta on legacy elements. Fixes #5163

This commit is contained in:
Kevin Schaaf
2018-04-05 14:12:54 -07:00
parent 689ff72cc8
commit 616f6662f0
4 changed files with 34 additions and 20 deletions

View File

@@ -86,6 +86,16 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
this._applyListeners(); this._applyListeners();
} }
/**
* Forwards `importMeta` from the prototype (i.e. from the info object
* passed to `Polymer({...})`) to the static API.
*
* @return {!Object} The `import.meta` object set on the prototype
*/
static get importMeta() {
return this.prototype.importMeta;
}
/** /**
* Legacy callback called during the `constructor`, for overriding * Legacy callback called during the `constructor`, for overriding
* by the user. * by the user.

View File

@@ -402,11 +402,13 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
* This path is used to resolve url's in template style cssText. * This path is used to resolve url's in template style cssText.
* The `importPath` property is also set on element instances and can be * The `importPath` property is also set on element instances and can be
* used to create bindings relative to the import path. * used to create bindings relative to the import path.
* For elements defined in ES modules, users should implement `importMeta` *
* and this getter will return `import.meta.url`'s path. For elements * For elements defined in ES modules, users should implement
* defined in HTML imports, this getter will return the path to the * `static get importMeta() { return import.meta; }` and the default
* document containing a `dom-module` element matching this element's * implementation of `importPath` will return `import.meta.url`'s path.
* static `is` property. * For elements defined in HTML imports, this getter will return the path
* to the document containing a `dom-module` element matching this
* element's static `is` property.
* *
* Note, this path should contain a trailing `/`. * Note, this path should contain a trailing `/`.
* *
@@ -426,18 +428,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
return this._importPath; return this._importPath;
} }
/**
* When an element definition is being loaded from an ES module, users
* may override this getter to return the `import.meta` object from that
* module, which will be used to derive the `importPath` for the element.
* When implementing `importMeta`, users should not implement `importPath`.
*
* @return {!Object} The `import.meta` object for the element's module
*/
static get importMeta() {
return null;
}
constructor() { constructor() {
super(); super();
/** @type {HTMLTemplateElement} */ /** @type {HTMLTemplateElement} */

View File

@@ -82,7 +82,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
test('Urls in styles and attributes', testStylesAndAttributes('p-r', 'sub')); test('Urls in styles and attributes', testStylesAndAttributes('p-r', 'sub'));
test('Urls in styles and attributes (importMeta)', testStylesAndAttributes('p-r-im', 'http://foo.com/mymodule')); test('Urls in styles and attributes (importMeta)', testStylesAndAttributes('p-r-im', 'http://class.com/mymodule'));
test('Urls in styles and attributes (importMeta, hybrid)', testStylesAndAttributes('p-r-hybrid', 'http://hybrid.com/mymodule'));
test('url changes via setting importPath/rootPath on element instance', function() { test('url changes via setting importPath/rootPath on element instance', function() {
var el = document.createElement('p-r'); var el = document.createElement('p-r');

View File

@@ -39,14 +39,26 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
} }
customElements.define(PR.is, PR); customElements.define(PR.is, PR);
class PRImportMeta extends PR { class PRImportMeta extends Polymer.Element {
static get template() {
return Polymer.DomModule.import('p-r', 'template').cloneNode(true);
}
static get importMeta() { static get importMeta() {
// Idiomatically, this would be `return import.meta`, but for purposes // Idiomatically, this would be `return import.meta`, but for purposes
// of stubbing the test without actual modules, it's shimmed // of stubbing the test without actual modules, it's shimmed
return { url: 'http://foo.com/mymodule/index.js' } return { url: 'http://class.com/mymodule/index.js' };
} }
} }
customElements.define('p-r-im', PRImportMeta); customElements.define('p-r-im', PRImportMeta);
const PRHybrid = Polymer({
is: 'p-r-hybrid',
_template: Polymer.DomModule.import('p-r', 'template').cloneNode(true),
// Idiomatically, this would be `return import.meta`, but for purposes
// of stubbing the test without actual modules, it's shimmed
importMeta: { url: 'http://hybrid.com/mymodule/index.js' }
});
</script> </script>
<dom-module id="p-r-ap" assetpath="../../assets/"></dom-module> <dom-module id="p-r-ap" assetpath="../../assets/"></dom-module>