diff --git a/index.html b/index.html index fc96912358..bffaf2da89 100644 --- a/index.html +++ b/index.html @@ -13,8 +13,8 @@ - - + + diff --git a/lib/elements/array-selector.js b/lib/elements/array-selector.js index 436983a016..51b88d1705 100644 --- a/lib/elements/array-selector.js +++ b/lib/elements/array-selector.js @@ -1,4 +1,4 @@ - +*/ +import { PolymerElement } from '../../polymer-element.js'; + +import { dedupingMixin } from '../utils/mixin.js'; +import { calculateSplices } from '../utils/array-splice.js'; +import { ElementMixin } from '../mixins/element-mixin.js'; + +/** + * Element mixin for recording dynamic associations between item paths in a + * master `items` array and a `selected` array such that path changes to the + * master array (at the host) element or elsewhere via data-binding) are + * correctly propagated to items in the selected array and vice-versa. + * + * The `items` property accepts an array of user data, and via the + * `select(item)` and `deselect(item)` API, updates the `selected` property + * which may be bound to other parts of the application, and any changes to + * sub-fields of `selected` item(s) will be kept in sync with items in the + * `items` array. When `multi` is false, `selected` is a property + * representing the last selected item. When `multi` is true, `selected` + * is an array of multiply selected items. + * + * @polymer + * @mixinFunction + * @appliesMixin Polymer.ElementMixin + * @memberof Polymer + * @summary Element mixin for recording dynamic associations between item paths in a + * master `items` array and a `selected` array + */ +let ArraySelectorMixin = dedupingMixin(superClass => { - - - - - + return ArraySelectorMixin; + +}); + +// export mixin +export { ArraySelectorMixin }; + +/** + * @constructor + * @extends {Polymer.Element} + * @implements {Polymer_ArraySelectorMixin} + */ +let baseArraySelector = ArraySelectorMixin(PolymerElement); + +/** + * Element implementing the `Polymer.ArraySelector` mixin, which records + * dynamic associations between item paths in a master `items` array and a + * `selected` array such that path changes to the master array (at the host) + * element or elsewhere via data-binding) are correctly propagated to items + * in the selected array and vice-versa. + * + * The `items` property accepts an array of user data, and via the + * `select(item)` and `deselect(item)` API, updates the `selected` property + * which may be bound to other parts of the application, and any changes to + * sub-fields of `selected` item(s) will be kept in sync with items in the + * `items` array. When `multi` is false, `selected` is a property + * representing the last selected item. When `multi` is true, `selected` + * is an array of multiply selected items. + * + * Example: + * + * ```html + * + * + * + * + * + * ``` + * + * ```js + *class EmployeeList extends Polymer.Element { + * static get is() { return 'employee-list'; } + * static get properties() { + * return { + * employees: { + * value() { + * return [ + * {first: 'Bob', last: 'Smith'}, + * {first: 'Sally', last: 'Johnson'}, + * ... + * ]; + * } + * } + * }; + * } + * toggleSelection(e) { + * let item = this.$.employeeList.itemForElement(e.target); + * this.$.selector.select(item); + * } + *} + * ``` + * + * @polymer + * @customElement + * @extends {baseArraySelector} + * @appliesMixin Polymer.ArraySelectorMixin + * @memberof Polymer + * @summary Custom element that links paths between an input `items` array and + * an output `selected` item or array based on calls to its selection API. + */ +class ArraySelector extends baseArraySelector { + // Not needed to find template; can be removed once the analyzer + // can find the tag name from customElements.define call + static get is() { return 'array-selector'; } +} +customElements.define(ArraySelector.is, ArraySelector); +export { ArraySelector }; diff --git a/lib/elements/custom-style.js b/lib/elements/custom-style.js index 67c3f657e5..9af6bc5459 100644 --- a/lib/elements/custom-style.js +++ b/lib/elements/custom-style.js @@ -1,4 +1,4 @@ - - - - +window.customElements.define('custom-style', CustomStyle); +export { CustomStyle }; diff --git a/lib/elements/dom-bind.js b/lib/elements/dom-bind.js index 8b64cca385..b0a1abc14c 100644 --- a/lib/elements/dom-bind.js +++ b/lib/elements/dom-bind.js @@ -1,4 +1,4 @@ - - - - - - - - +export { DomBind }; diff --git a/lib/elements/dom-if.js b/lib/elements/dom-if.js index 527ede86ae..1b3f20f07d 100644 --- a/lib/elements/dom-if.js +++ b/lib/elements/dom-if.js @@ -1,4 +1,4 @@ - +*/ +import { PolymerElement } from '../../polymer-element.js'; - - - - +import { templatize } from '../utils/templatize.js'; +import { Debouncer } from '../utils/debounce.js'; +import { enqueueDebouncer, flush } from '../utils/flush.js'; +import { microTask } from '../utils/async.js'; +import { root as root$0 } from '../utils/path.js'; - +export { DomIf }; diff --git a/lib/elements/dom-module.js b/lib/elements/dom-module.js index 01aad394c8..a16239e6b7 100644 --- a/lib/elements/dom-module.js +++ b/lib/elements/dom-module.js @@ -1,4 +1,4 @@ - - - - +// export +export { DomModule }; diff --git a/lib/elements/dom-repeat.js b/lib/elements/dom-repeat.js index f14f88f7a7..71b4c63724 100644 --- a/lib/elements/dom-repeat.js +++ b/lib/elements/dom-repeat.js @@ -1,4 +1,4 @@ - +*/ +import { PolymerElement } from '../../polymer-element.js'; + +import { TemplateInstanceBase as TemplateInstanceBase$0, templatize, modelForElement as modelForElement$0 } from '../utils/templatize.js'; +import { Debouncer } from '../utils/debounce.js'; +import { enqueueDebouncer, flush } from '../utils/flush.js'; +import { OptionalMutableData } from '../mixins/mutable-data.js'; +import { matches, translate } from '../utils/path.js'; +import { timeOut, microTask } from '../utils/async.js'; + +let TemplateInstanceBase = TemplateInstanceBase$0; // eslint-disable-line + +/** + * @constructor + * @implements {Polymer_OptionalMutableData} + * @extends {Polymer.Element} + */ +const domRepeatBase = OptionalMutableData(PolymerElement); + +/** + * The `` element will automatically stamp and binds one instance + * of template content to each object in a user-provided array. + * `dom-repeat` accepts an `items` property, and one instance of the template + * is stamped for each item into the DOM at the location of the `dom-repeat` + * element. The `item` property will be set on each instance's binding + * scope, thus templates should bind to sub-properties of `item`. + * + * Example: + * + * ```html + * + * + * + * + * + * ``` + * + * With the following custom element definition: + * + * ```js + * class EmployeeList extends Polymer.Element { + * static get is() { return 'employee-list'; } + * static get properties() { + * return { + * employees: { + * value() { + * return [ + * {first: 'Bob', last: 'Smith'}, + * {first: 'Sally', last: 'Johnson'}, + * ... + * ]; + * } + * } + * }; + * } + * } + * ``` + * + * Notifications for changes to items sub-properties will be forwarded to template + * instances, which will update via the normal structured data notification system. + * + * Mutations to the `items` array itself should be made using the Array + * mutation API's on `Polymer.Base` (`push`, `pop`, `splice`, `shift`, + * `unshift`), and template instances will be kept in sync with the data in the + * array. + * + * Events caught by event handlers within the `dom-repeat` template will be + * decorated with a `model` property, which represents the binding scope for + * each template instance. The model is an instance of Polymer.Base, and should + * be used to manipulate data on the instance, for example + * `event.model.set('item.checked', true);`. + * + * Alternatively, the model for a template instance for an element stamped by + * a `dom-repeat` can be obtained using the `modelForElement` API on the + * `dom-repeat` that stamped it, for example + * `this.$.domRepeat.modelForElement(event.target).set('item.checked', true);`. + * This may be useful for manipulating instance data of event targets obtained + * by event handlers on parents of the `dom-repeat` (event delegation). + * + * A view-specific filter/sort may be applied to each `dom-repeat` by supplying a + * `filter` and/or `sort` property. This may be a string that names a function on + * the host, or a function may be assigned to the property directly. The functions + * should implemented following the standard `Array` filter/sort API. + * + * In order to re-run the filter or sort functions based on changes to sub-fields + * of `items`, the `observe` property may be set as a space-separated list of + * `item` sub-fields that should cause a re-filter/sort when modified. If + * the filter or sort function depends on properties not contained in `items`, + * the user should observe changes to those properties and call `render` to update + * the view based on the dependency change. + * + * For example, for an `dom-repeat` with a filter of the following: + * + * ```js + * isEngineer(item) { + * return item.type == 'engineer' || item.manager.type == 'engineer'; + * } + * ``` + * + * Then the `observe` property should be configured as follows: + * + * ```html + * + * ``` + * + * @customElement + * @polymer + * @memberof Polymer + * @extends {domRepeatBase} + * @appliesMixin Polymer.OptionalMutableData + * @summary Custom element for stamping instance of a template bound to + * items in an array. + */ +class DomRepeat extends domRepeatBase { + + // Not needed to find template; can be removed once the analyzer + // can find the tag name from customElements.define call + static get is() { return 'dom-repeat'; } + + static get template() { return null; } + + static get properties() { - - - - - - - +export { DomRepeat }; diff --git a/lib/legacy/class.js b/lib/legacy/class.js index afe838cc57..e1ac44c717 100644 --- a/lib/legacy/class.js +++ b/lib/legacy/class.js @@ -1,4 +1,4 @@ - - - +export { mixinBehaviors }; diff --git a/lib/legacy/legacy-element-mixin.js b/lib/legacy/legacy-element-mixin.js index c1302b1346..b7fa702e6b 100644 --- a/lib/legacy/legacy-element-mixin.js +++ b/lib/legacy/legacy-element-mixin.js @@ -1,4 +1,4 @@ - +*/ +import '../../../../@webcomponents/shadycss/entrypoints/apply-shim.js'; + +import { ElementMixin } from '../mixins/element-mixin.js'; +import { GestureEventListeners } from '../mixins/gesture-event-listeners.js'; +import { DirMixin } from '../mixins/dir-mixin.js'; +import { dedupingMixin } from '../utils/mixin.js'; +import { importHref as importHref$0 } from '../utils/import-href.js'; +import '../utils/render-status.js'; +import '../utils/unresolved.js'; +import { dom as dom$0, matchesSelector } from './polymer.dom.js'; +import { setTouchAction } from '../utils/gestures.js'; +import { Debouncer } from '../utils/debounce.js'; +import { timeOut, microTask } from '../utils/async.js'; +import { get as get$0 } from '../utils/path.js'; + +let styleInterface = window.ShadyCSS; + +/** + * Element class mixin that provides Polymer's "legacy" API intended to be + * backward-compatible to the greatest extent possible with the API + * found on the Polymer 1.x `Polymer.Base` prototype applied to all elements + * defined using the `Polymer({...})` function. + * + * @mixinFunction + * @polymer + * @appliesMixin Polymer.ElementMixin + * @appliesMixin Polymer.GestureEventListeners + * @property isAttached {boolean} Set to `true` in this element's + * `connectedCallback` and `false` in `disconnectedCallback` + * @summary Element class mixin that provides Polymer's "legacy" API + */ +export const LegacyElementMixin = dedupingMixin((base) => { - - - - - - - - - - - +}); diff --git a/lib/legacy/mutable-data-behavior.js b/lib/legacy/mutable-data-behavior.js index 0d66613191..ee236668b7 100644 --- a/lib/legacy/mutable-data-behavior.js +++ b/lib/legacy/mutable-data-behavior.js @@ -1,4 +1,4 @@ - +*/ +import { MutableData } from '../mixins/mutable-data.js'; - - - + _shouldPropertyChange(property, value, old) { + return mutablePropertyChange(this, property, value, old, this.mutableData); + } +}; diff --git a/lib/legacy/polymer-fn.js b/lib/legacy/polymer-fn.js index 80106a89ed..2296c820d7 100644 --- a/lib/legacy/polymer-fn.js +++ b/lib/legacy/polymer-fn.js @@ -1,4 +1,4 @@ - +*/ +import { Class } from './class.js'; - +import { Polymer } from '../utils/boot.js'; - +/** + * Legacy class factory and registration helper for defining Polymer + * elements. + * + * This method is equivalent to + * `customElements.define(info.is, Polymer.Class(info));` + * + * See `Polymer.Class` for details on valid legacy metadata format for `info`. + * + * @global + * @override + * @function Polymer + * @param {!PolymerInit} info Object containing Polymer metadata and functions + * to become class methods. + * @return {function(new: HTMLElement)} Generated class + * @suppress {duplicate, invalidCasts, checkTypes} + */ +export const Polymer = function(info) { + // if input is a `class` (aka a function with a prototype), use the prototype + // remember that the `constructor` will never be called + let klass; + if (typeof info === 'function') { + klass = info; + } else { + klass = Class(info); + } + customElements.define(klass.is, /** @type {!HTMLElement} */(klass)); + return klass; +}; diff --git a/lib/legacy/polymer.dom.js b/lib/legacy/polymer.dom.js index afae35b1c3..9c4bfc637e 100644 --- a/lib/legacy/polymer.dom.js +++ b/lib/legacy/polymer.dom.js @@ -1,4 +1,4 @@ - - - - - - + get path() { + return this.event.composedPath(); + } +} + +export { DomApi }; + +/** + * @function + * @param {boolean=} deep + * @return {!Node} + */ +DomApi.prototype.cloneNode; +/** + * @function + * @param {!Node} node + * @return {!Node} + */ +DomApi.prototype.appendChild; +/** + * @function + * @param {!Node} newChild + * @param {Node} refChild + * @return {!Node} + */ +DomApi.prototype.insertBefore; +/** + * @function + * @param {!Node} node + * @return {!Node} + */ +DomApi.prototype.removeChild; +/** + * @function + * @param {!Node} oldChild + * @param {!Node} newChild + * @return {!Node} + */ +DomApi.prototype.replaceChild; +/** + * @function + * @param {string} name + * @param {string} value + * @return {void} + */ +DomApi.prototype.setAttribute; +/** + * @function + * @param {string} name + * @return {void} + */ +DomApi.prototype.removeAttribute; +/** + * @function + * @param {string} selector + * @return {?Element} + */ +DomApi.prototype.querySelector; +/** + * @function + * @param {string} selector + * @return {!NodeList} + */ +DomApi.prototype.querySelectorAll; + +/** + * Legacy DOM and Event manipulation API wrapper factory used to abstract + * differences between native Shadow DOM and "Shady DOM" when polyfilling on + * older browsers. + * + * Note that in Polymer 2.x use of `Polymer.dom` is no longer required and + * in the majority of cases simply facades directly to the standard native + * API. + * + * @summary Legacy DOM and Event manipulation API wrapper factory used to + * abstract differences between native Shadow DOM and "Shady DOM." + * @param {(Node|Event)=} obj Node or event to operate on + * @return {!DomApi|!EventApi} Wrapper providing either node API or event API + */ +export const dom = function(obj) { + obj = obj || document; + if (!obj.__domApi) { + let helper; + if (obj instanceof Event) { + helper = new EventApi(obj); + } else { + helper = new DomApi(obj); + } + obj.__domApi = helper; + } + return obj.__domApi; +}; + +export { matchesSelector }; + +/** + * Forces several classes of asynchronously queued tasks to flush: + * - Debouncers added via `Polymer.enqueueDebouncer` + * - ShadyDOM distribution + * + * This method facades to `Polymer.flush`. + * + */ +export { flush$0 as flush }; + +/** + * Adds a `Polymer.Debouncer` to a list of globally flushable tasks. + * + * This method facades to `Polymer.enqueueDebouncer`. + * + * @param {!Polymer.Debouncer} debouncer Debouncer to enqueue + */ +export { enqueueDebouncer as addDebouncer }; diff --git a/lib/legacy/templatizer-behavior.js b/lib/legacy/templatizer-behavior.js index 05ad62d0d4..0677a0e118 100644 --- a/lib/legacy/templatizer-behavior.js +++ b/lib/legacy/templatizer-behavior.js @@ -1,4 +1,4 @@ - +*/ +import { TemplateInstanceBase as TemplateInstanceBase$0, templatize as templatize$0, modelForElement as modelForElement$0 } from '../utils/templatize.js'; - +let TemplateInstanceBase = TemplateInstanceBase$0; // eslint-disable-line - + /** + * Returns the template "model" (`TemplateInstance`) associated with + * a given element, which serves as the binding scope for the template + * instance the element is contained in. A template model should be used + * to manipulate data associated with this template instance. + * + * @param {HTMLElement} el Element for which to return a template model. + * @return {TemplateInstanceBase} Model representing the binding scope for + * the element. + * @this {TemplatizerUser} + */ + modelForElement(el) { + return modelForElement$0(this._templatizerTemplate, el); + } +}; diff --git a/lib/mixins/dir-mixin.js b/lib/mixins/dir-mixin.js index 68db35d5fe..a7a2c6b685 100644 --- a/lib/mixins/dir-mixin.js +++ b/lib/mixins/dir-mixin.js @@ -1,4 +1,4 @@ - - - - + return Dir; +}); diff --git a/lib/mixins/disable-upgrade-mixin.js b/lib/mixins/disable-upgrade-mixin.js index f714325de5..4110954dfd 100644 --- a/lib/mixins/disable-upgrade-mixin.js +++ b/lib/mixins/disable-upgrade-mixin.js @@ -1,4 +1,4 @@ - - - +}); diff --git a/lib/mixins/element-mixin.js b/lib/mixins/element-mixin.js index b0f7fba988..069558786e 100644 --- a/lib/mixins/element-mixin.js +++ b/lib/mixins/element-mixin.js @@ -1,4 +1,4 @@ - +*/ +import '../utils/boot.js'; + +import { rootPath as rootPath$0 } from '../utils/settings.js'; +import { dedupingMixin } from '../utils/mixin.js'; +import { stylesFromTemplate, stylesFromModuleImports } from '../utils/style-gather.js'; +import { pathFromUrl, resolveCss, resolveUrl as resolveUrl$0 } from '../utils/resolve-url.js'; +import { DomModule } from '../elements/dom-module.js'; +import { PropertyEffects } from './property-effects.js'; +import { PropertiesMixin } from './properties-mixin.js'; + +/** + * Element class mixin that provides the core API for Polymer's meta-programming + * features including template stamping, data-binding, attribute deserialization, + * and property change observation. + * + * Subclassers may provide the following static getters to return metadata + * used to configure Polymer's features for the class: + * + * - `static get is()`: When the template is provided via a `dom-module`, + * users should return the `dom-module` id from a static `is` getter. If + * no template is needed or the template is provided directly via the + * `template` getter, there is no need to define `is` for the element. + * + * - `static get template()`: Users may provide the template directly (as + * opposed to via `dom-module`) by implementing a static `template` getter. + * The getter may return an `HTMLTemplateElement` or a string, which will + * automatically be parsed into a template. + * + * - `static get properties()`: Should return an object describing + * property-related metadata used by Polymer features (key: property name + * value: object containing property metadata). Valid keys in per-property + * metadata include: + * - `type` (String|Number|Object|Array|...): Used by + * `attributeChangedCallback` to determine how string-based attributes + * are deserialized to JavaScript property values. + * - `notify` (boolean): Causes a change in the property to fire a + * non-bubbling event called `-changed`. Elements that have + * enabled two-way binding to the property use this event to observe changes. + * - `readOnly` (boolean): Creates a getter for the property, but no setter. + * To set a read-only property, use the private setter method + * `_setProperty(property, value)`. + * - `observer` (string): Observer method name that will be called when + * the property changes. The arguments of the method are + * `(value, previousValue)`. + * - `computed` (string): String describing method and dependent properties + * for computing the value of this property (e.g. `'computeFoo(bar, zot)'`). + * Computed properties are read-only by default and can only be changed + * via the return value of the computing method. + * + * - `static get observers()`: Array of strings describing multi-property + * observer methods and their dependent properties (e.g. + * `'observeABC(a, b, c)'`). + * + * The base class provides default implementations for the following standard + * custom element lifecycle callbacks; users may override these, but should + * call the super method to ensure + * - `constructor`: Run when the element is created or upgraded + * - `connectedCallback`: Run each time the element is connected to the + * document + * - `disconnectedCallback`: Run each time the element is disconnected from + * the document + * - `attributeChangedCallback`: Run each time an attribute in + * `observedAttributes` is set or removed (note: this element's default + * `observedAttributes` implementation will automatically return an array + * of dash-cased attributes based on `properties`) + * + * @mixinFunction + * @polymer + * @appliesMixin Polymer.PropertyEffects + * @appliesMixin Polymer.PropertiesMixin + * @property rootPath {string} Set to the value of `Polymer.rootPath`, + * which defaults to the main document path + * @property importPath {string} Set to the value of the class's static + * `importPath` property, which defaults to the path of this element's + * `dom-module` (when `is` is used), but can be overridden for other + * import strategies. + * @summary Element class mixin that provides the core API for Polymer's + * meta-programming features. + */ +export const ElementMixin = dedupingMixin(base => { - - - - - - - - + /** + * @constructor + * @extends {base} + * @implements {Polymer_PropertyEffects} + * @implements {Polymer_PropertiesMixin} + */ + const polymerElementBase = PropertiesMixin(PropertyEffects(base)); - + } + + return PolymerElement; +}); + +/** + * Provides basic tracking of element definitions (registrations) and + * instance counts. + * + * @summary Provides basic tracking of element definitions (registrations) and + * instance counts. + */ +`TODO(modulizer): A namespace named Polymer.telemetry was +declared here. The surrounding comments should be reviewed, +and this string can then be deleted`; + +/** + * Total number of Polymer element instances created. + * @type {number} + */ +export let instanceCount = 0; + +/** + * Array of Polymer element classes that have been finalized. + * @type {Array} + */ +export const registrations = []; + +/** + * @param {!PolymerElementConstructor} prototype Element prototype to log + * @this {this} + * @private + */ +export function _regLog(prototype) { + console.log('[' + prototype.is + ']: registered'); +} + +/** + * Registers a class prototype for telemetry purposes. + * @param {HTMLElement} prototype Element prototype to register + * @this {this} + * @protected + */ +export function register(prototype) { + registrations.push(prototype); + undefined && _regLog(prototype); +} + +/** + * Logs all elements registered with an `is` to the console. + * @public + * @this {this} + */ +export function dumpRegistrations() { + registrations.forEach(_regLog); +} + +/** + * When using the ShadyCSS scoping and custom property shim, causes all + * shimmed `styles` (via `custom-style`) in the document (and its subtree) + * to be updated based on current custom property values. + * + * The optional parameter overrides inline custom property styles with an + * object of properties where the keys are CSS properties, and the values + * are strings. + * + * Example: `Polymer.updateStyles({'--color': 'blue'})` + * + * These properties are retained unless a value of `null` is set. + * + * @param {Object=} props Bag of custom property key/values to + * apply to the document. + * @return {void} + */ +export const updateStyles = function(props) { + if (window.ShadyCSS) { + window.ShadyCSS.styleDocument(props); + } +}; diff --git a/lib/mixins/gesture-event-listeners.js b/lib/mixins/gesture-event-listeners.js index 9ad4f12c8b..2208a8dcf2 100644 --- a/lib/mixins/gesture-event-listeners.js +++ b/lib/mixins/gesture-event-listeners.js @@ -1,4 +1,4 @@ - - - - +*/ +import '../utils/boot.js'; - +}); diff --git a/lib/mixins/mutable-data.js b/lib/mixins/mutable-data.js index d5b1587b6d..58655b8121 100644 --- a/lib/mixins/mutable-data.js +++ b/lib/mixins/mutable-data.js @@ -1,4 +1,4 @@ - - - - - +// Export for use by legacy behavior +MutableData._mutablePropertyChange = mutablePropertyChange; diff --git a/lib/mixins/properties-changed.js b/lib/mixins/properties-changed.js index cfde2854cc..7922bcf233 100644 --- a/lib/mixins/properties-changed.js +++ b/lib/mixins/properties-changed.js @@ -1,4 +1,4 @@ - +*/ +import '../utils/boot.js'; + +import { dedupingMixin } from '../utils/mixin.js'; +import { microTask } from '../utils/async.js'; + +/** @const {!AsyncInterface} */ +const microtask = microTask; + +/** + * Element class mixin that provides basic meta-programming for creating one + * or more property accessors (getter/setter pair) that enqueue an async + * (batched) `_propertiesChanged` callback. + * + * For basic usage of this mixin, call `MyClass.createProperties(props)` + * once at class definition time to create property accessors for properties + * named in props, implement `_propertiesChanged` to react as desired to + * property changes, and implement `static get observedAttributes()` and + * include lowercase versions of any property names that should be set from + * attributes. Last, call `this._enableProperties()` in the element's + * `connectedCallback` to enable the accessors. + * + * @mixinFunction + * @polymer + * @summary Element class mixin for reacting to property changes from + * generated property accessors. + */ +export const PropertiesChanged = dedupingMixin(superClass => { + + /** + * @polymer + * @mixinClass + * @extends {superClass} + * @implements {Polymer_PropertiesChanged} + * @unrestricted + */ + class PropertiesChanged extends superClass { - - - - - + return PropertiesChanged; +}); diff --git a/lib/mixins/properties-mixin.js b/lib/mixins/properties-mixin.js index 782311bb8e..912b3b55c9 100644 --- a/lib/mixins/properties-mixin.js +++ b/lib/mixins/properties-mixin.js @@ -1,4 +1,4 @@ - - - - - - - + return output; +} + +/** + * Mixin that provides a minimal starting point to using the PropertiesChanged + * mixin by providing a mechanism to declare properties in a static + * getter (e.g. static get properties() { return { foo: String } }). Changes + * are reported via the `_propertiesChanged` method. + * + * This mixin provides no specific support for rendering. Users are expected + * to create a ShadowRoot and put content into it and update it in whatever + * way makes sense. This can be done in reaction to properties changing by + * implementing `_propertiesChanged`. + * + * @mixinFunction + * @polymer + * @appliesMixin Polymer.PropertiesChanged + * @summary Mixin that provides a minimal starting point for using + * the PropertiesChanged mixin by providing a declarative `properties` object. + */ +export const PropertiesMixin = dedupingMixin(superClass => { + + /** + * @constructor + * @extends {superClass} + * @implements {Polymer_PropertiesChanged} + */ + const base = PropertiesChanged(superClass); + + /** + * Returns the super class constructor for the given class, if it is an + * instance of the PropertiesMixin. + * + * @param {!PropertiesMixinConstructor} constructor PropertiesMixin constructor + * @return {PropertiesMixinConstructor} Super class constructor + */ + function superPropertiesClass(constructor) { + const superCtor = Object.getPrototypeOf(constructor); + + // Note, the `PropertiesMixin` class below only refers to the class + // generated by this call to the mixin; the instanceof test only works + // because the mixin is deduped and guaranteed only to apply once, hence + // all constructors in a proto chain will see the same `PropertiesMixin` + return (superCtor.prototype instanceof PropertiesMixin) ? + /** @type {PropertiesMixinConstructor} */ (superCtor) : null; + } + + /** + * Returns a memoized version of the `properties` object for the + * given class. Properties not in object format are converted to at + * least {type}. + * + * @param {PropertiesMixinConstructor} constructor PropertiesMixin constructor + * @return {Object} Memoized properties object + */ + function ownProperties(constructor) { + if (!constructor.hasOwnProperty(JSCompiler_renameProperty('__ownProperties', constructor))) { + let props = null; + + if (constructor.hasOwnProperty(JSCompiler_renameProperty('properties', constructor)) && constructor.properties) { + props = normalizeProperties(constructor.properties); + } + + constructor.__ownProperties = props; + } + return constructor.__ownProperties; + } + + /** + * @polymer + * @mixinClass + * @extends {base} + * @implements {Polymer_PropertiesMixin} + * @unrestricted + */ + class PropertiesMixin extends base { + + /** + * Implements standard custom elements getter to observes the attributes + * listed in `properties`. + * @suppress {missingProperties} Interfaces in closure do not inherit statics, but classes do + */ + static get observedAttributes() { + const props = this._properties; + return props ? Object.keys(props).map(p => this.attributeNameForProperty(p)) : []; + } + + /** + * Finalizes an element definition, including ensuring any super classes + * are also finalized. This includes ensuring property + * accessors exist on the element prototype. This method calls + * `_finalizeClass` to finalize each constructor in the prototype chain. + * @return {void} + */ + static finalize() { + if (!this.hasOwnProperty(JSCompiler_renameProperty('__finalized', this))) { + const superCtor = superPropertiesClass(/** @type {PropertiesMixinConstructor} */(this)); + if (superCtor) { + superCtor.finalize(); + } + this.__finalized = true; + this._finalizeClass(); + } + } + + /** + * Finalize an element class. This includes ensuring property + * accessors exist on the element prototype. This method is called by + * `finalize` and finalizes the class constructor. + * + * @protected + */ + static _finalizeClass() { + const props = ownProperties(/** @type {PropertiesMixinConstructor} */(this)); + if (props) { + this.createProperties(props); + } + } + + /** + * Returns a memoized version of all properties, including those inherited + * from super classes. Properties not in object format are converted to + * at least {type}. + * + * @return {Object} Object containing properties for this class + * @protected + */ + static get _properties() { + if (!this.hasOwnProperty( + JSCompiler_renameProperty('__properties', this))) { + const superCtor = superPropertiesClass(/** @type {PropertiesMixinConstructor} */(this)); + this.__properties = Object.assign({}, + superCtor && superCtor._properties, + ownProperties(/** @type {PropertiesMixinConstructor} */(this))); + } + return this.__properties; + } + + /** + * Overrides `PropertiesChanged` method to return type specified in the + * static `properties` object for the given property. + * @param {string} name Name of property + * @return {*} Type to which to deserialize attribute + * + * @protected + */ + static typeForProperty(name) { + const info = this._properties[name]; + return info && info.type; + } + + /** + * Overrides `PropertiesChanged` method and adds a call to + * `finalize` which lazily configures the element's property accessors. + * @override + * @return {void} + */ + _initializeProperties() { + this.constructor.finalize(); + super._initializeProperties(); + } + + /** + * Called when the element is added to a document. + * Calls `_enableProperties` to turn on property system from + * `PropertiesChanged`. + * @suppress {missingProperties} Super may or may not implement the callback + * @return {void} + */ + connectedCallback() { + if (super.connectedCallback) { + super.connectedCallback(); + } + this._enableProperties(); + } + + /** + * Called when the element is removed from a document + * @suppress {missingProperties} Super may or may not implement the callback + * @return {void} + */ + disconnectedCallback() { + if (super.disconnectedCallback) { + super.disconnectedCallback(); + } + } + + } + + return PropertiesMixin; + +}); diff --git a/lib/mixins/property-accessors.js b/lib/mixins/property-accessors.js index f26f467b12..4bb6974d1f 100644 --- a/lib/mixins/property-accessors.js +++ b/lib/mixins/property-accessors.js @@ -1,4 +1,4 @@ - +*/ +import '../utils/boot.js'; - - - - +import { dedupingMixin } from '../utils/mixin.js'; +import * as caseMap$0 from '../utils/case-map.js'; +import { PropertiesChanged } from './properties-changed.js'; - +}); diff --git a/lib/mixins/property-effects.js b/lib/mixins/property-effects.js index de92b17c4a..8607b8cc00 100644 --- a/lib/mixins/property-effects.js +++ b/lib/mixins/property-effects.js @@ -1,4 +1,4 @@ - - - - - - - - - - - - - +}; diff --git a/lib/mixins/strict-binding-parser.js b/lib/mixins/strict-binding-parser.js index 03a3b3d278..48f86847fd 100644 --- a/lib/mixins/strict-binding-parser.js +++ b/lib/mixins/strict-binding-parser.js @@ -1,4 +1,4 @@ - - - - - +*/ +import '../utils/boot.js'; - + return null; + } + }; +}); + +export { StrictBindingParser }; diff --git a/lib/mixins/template-stamp.js b/lib/mixins/template-stamp.js index c6fbe94729..0355fd8c84 100644 --- a/lib/mixins/template-stamp.js +++ b/lib/mixins/template-stamp.js @@ -1,4 +1,4 @@ - +*/ +import '../utils/boot.js'; - - +import { dedupingMixin } from '../utils/mixin.js'; - +}); diff --git a/lib/utils/array-splice.js b/lib/utils/array-splice.js index 43420d4711..2ee70ff326 100644 --- a/lib/utils/array-splice.js +++ b/lib/utils/array-splice.js @@ -1,4 +1,4 @@ - - - + return splices; +} + +function sharedPrefix(current, old, searchLength) { + for (let i = 0; i < searchLength; i++) + if (!equals(current[i], old[i])) + return i; + return searchLength; +} + +function sharedSuffix(current, old, searchLength) { + let index1 = current.length; + let index2 = old.length; + let count = 0; + while (count < searchLength && equals(current[--index1], old[--index2])) + count++; + + return count; +} + +function calculateSplices(current, previous) { + return calcSplices(current, 0, current.length, previous, 0, + previous.length); +} + +function equals(currentValue, previousValue) { + return currentValue === previousValue; +} + +/** + * @summary Module that provides utilities for diffing arrays. + */ +`TODO(modulizer): A namespace named Polymer.ArraySplice was +declared here. The surrounding comments should be reviewed, +and this string can then be deleted`; + +/** + * Returns an array of splice records indicating the minimum edits required + * to transform the `previous` array into the `current` array. + * + * Splice records are ordered by index and contain the following fields: + * - `index`: index where edit started + * - `removed`: array of removed items from this index + * - `addedCount`: number of items added at this index + * + * This function is based on the Levenshtein "minimum edit distance" + * algorithm. Note that updates are treated as removal followed by addition. + * + * The worst-case time complexity of this algorithm is `O(l * p)` + * l: The length of the current array + * p: The length of the previous array + * + * However, the worst-case complexity is reduced by an `O(n)` optimization + * to detect any shared prefix & suffix between the two arrays and only + * perform the more expensive minimum edit distance calculation over the + * non-shared portions of the arrays. + * + * @function + * @param {!Array} current The "changed" array for which splices will be + * calculated. + * @param {!Array} previous The "unchanged" original array to compare + * `current` against to determine the splices. + * @return {!Array} Returns an array of splice record objects. Each of these + * contains: `index` the location where the splice occurred; `removed` + * the array of removed items from this location; `addedCount` the number + * of items added at this location. + */ +export { calculateSplices }; diff --git a/lib/utils/async.js b/lib/utils/async.js index 4ddd961c6f..ce9ee1023b 100644 --- a/lib/utils/async.js +++ b/lib/utils/async.js @@ -1,4 +1,4 @@ - - +*/ +import './boot.js'; - +}; diff --git a/lib/utils/boot.js b/lib/utils/boot.js index 0426caa656..59eea45605 100644 --- a/lib/utils/boot.js +++ b/lib/utils/boot.js @@ -1,65 +1,4 @@ - - +/** @namespace Polymer */ +let __PolymerBootstrap; diff --git a/lib/utils/case-map.js b/lib/utils/case-map.js index b1b44cdafe..0f87213d3f 100644 --- a/lib/utils/case-map.js +++ b/lib/utils/case-map.js @@ -1,4 +1,4 @@ - - - +/** + * Converts "camelCase" identifier (e.g. `fooBarBaz`) to "dash-case" + * (e.g. `foo-bar-baz`). + * + * @param {string} camel Camel-case identifier + * @return {string} Dash-case representation of the identifier + */ +export function camelToDashCase(camel) { + return caseMap[camel] || ( + caseMap[camel] = camel.replace(CAMEL_TO_DASH, '-$1').toLowerCase() + ); +} diff --git a/lib/utils/debounce.js b/lib/utils/debounce.js index 1507faa20a..8804283de5 100644 --- a/lib/utils/debounce.js +++ b/lib/utils/debounce.js @@ -1,4 +1,4 @@ - - - - +*/ +import './boot.js'; - +/** @const */ +export { Debouncer }; diff --git a/lib/utils/flattened-nodes-observer.js b/lib/utils/flattened-nodes-observer.js index 2273b1604f..d24dd189f6 100644 --- a/lib/utils/flattened-nodes-observer.js +++ b/lib/utils/flattened-nodes-observer.js @@ -1,4 +1,4 @@ - - - - - +export { FlattenedNodesObserver }; diff --git a/lib/utils/flush.js b/lib/utils/flush.js index 3feaad6166..e73521d885 100644 --- a/lib/utils/flush.js +++ b/lib/utils/flush.js @@ -1,4 +1,4 @@ - - - +/** + * Forces several classes of asynchronously queued tasks to flush: + * - Debouncers added via `enqueueDebouncer` + * - ShadyDOM distribution + * + * @return {void} + */ +export const flush = function() { + let shadyDOM, debouncers; + do { + shadyDOM = window.ShadyDOM && ShadyDOM.flush(); + if (window.ShadyCSS && window.ShadyCSS.ScopingShim) { + window.ShadyCSS.ScopingShim.flush(); + } + debouncers = flushDebouncers(); + } while (shadyDOM || debouncers); +}; diff --git a/lib/utils/gestures.js b/lib/utils/gestures.js index 2a05daa462..a883b8983c 100644 --- a/lib/utils/gestures.js +++ b/lib/utils/gestures.js @@ -1,4 +1,4 @@ - - - - +*/ +import './boot.js'; - +/** @deprecated */ +export const remove = removeListener; diff --git a/lib/utils/html-tag.js b/lib/utils/html-tag.js index 79028525b0..a88ac89948 100644 --- a/lib/utils/html-tag.js +++ b/lib/utils/html-tag.js @@ -1,4 +1,4 @@ - - - +/** + * An html literal tag that can be used with `Polymer.html` to compose. + * a literal string. + * + * Example: + * + * static get template() { + * return Polymer.html` + * + *
${staticValue}
+ * ${super.template} + * `; + * } + * static get styleTemplate() { return Polymer.htmlLiteral`.shadowed { background: gray; }`; } + * + * @param {!ITemplateArray} strings Constant parts of tagged template literal + * @param {...*} values Variable parts of tagged template literal + * @return {!LiteralString} Constructed literal string + */ +export const htmlLiteral = function(strings, ...values) { + return new LiteralString(values.reduce((acc, v, idx) => + acc + literalValue(v) + strings[idx + 1], strings[0])); +}; diff --git a/lib/utils/import-href.js b/lib/utils/import-href.js index 80d354bc77..0dac6238bb 100644 --- a/lib/utils/import-href.js +++ b/lib/utils/import-href.js @@ -1,4 +1,4 @@ - +*/ +import './boot.js'; - - - + link.addEventListener('load', loadListener); + link.addEventListener('error', errorListener); + if (link.parentNode == null) { + document.head.appendChild(link); + // if the link already loaded, dispatch a fake load event + // so that listeners are called and get a proper event argument. + } else if (link.__dynamicImportLoaded) { + link.dispatchEvent(new Event('load')); + } + return link; +}; diff --git a/lib/utils/mixin.js b/lib/utils/mixin.js index e97b3e2123..45bf64f2f5 100644 --- a/lib/utils/mixin.js +++ b/lib/utils/mixin.js @@ -1,4 +1,4 @@ - +*/ +import './boot.js'; - +// unique global id for deduping mixins. +let dedupeId = 0; - + return /** @type {T} */ (dedupingMixin); +}; +/* eslint-enable valid-jsdoc */ diff --git a/lib/utils/path.js b/lib/utils/path.js index 924c9d0abb..3b473850ce 100644 --- a/lib/utils/path.js +++ b/lib/utils/path.js @@ -1,4 +1,4 @@ - +*/ +import './boot.js'; - +/** + * Module with utilities for manipulating structured data path strings. + * + * @summary Module with utilities for manipulating structured data path strings. + */ +`TODO(modulizer): A namespace named Polymer.Path was +declared here. The surrounding comments should be reviewed, +and this string can then be deleted`; - +/** + * Returns true if the given string is a structured data path (has dots). + * + * This function is deprecated. Use `Polymer.Path.isPath` instead. + * + * Example: + * + * ``` + * Polymer.Path.isDeep('foo.bar.baz') // true + * Polymer.Path.isDeep('foo') // false + * ``` + * + * @deprecated + * @param {string} path Path string + * @return {boolean} True if the string contained one or more dots + */ +export const isDeep = isPath; diff --git a/lib/utils/render-status.js b/lib/utils/render-status.js index 151f74ebc0..cbe65c9a41 100644 --- a/lib/utils/render-status.js +++ b/lib/utils/render-status.js @@ -1,4 +1,4 @@ - - +*/ +import './boot.js'; - +/** + * Flushes all `beforeNextRender` tasks, followed by all `afterNextRender` + * tasks. + * + * @return {void} + */ +export { flush }; diff --git a/lib/utils/resolve-url.js b/lib/utils/resolve-url.js index 6d061a826e..934b962b9f 100644 --- a/lib/utils/resolve-url.js +++ b/lib/utils/resolve-url.js @@ -1,4 +1,4 @@ - - - - +export { resolveCss }; +export { resolveUrl }; +export { pathFromUrl }; diff --git a/lib/utils/settings.js b/lib/utils/settings.js index 5b0dc42039..f93d34f22c 100644 --- a/lib/utils/settings.js +++ b/lib/utils/settings.js @@ -1,4 +1,4 @@ - +*/ +import './boot.js'; - - +import { pathFromUrl } from './resolve-url.js'; +export const useShadow = !(window.ShadyDOM); +export const useNativeCSSProperties = Boolean(!window.ShadyCSS || window.ShadyCSS.nativeCss); +export const useNativeCustomElements = !(window.customElements.polyfillWrapFlushCallback); - +/** + * Sets `passiveTouchGestures` globally for all elements using Polymer Gestures. + * + * @param {boolean} usePassive enable or disable passive touch gestures globally + * @return {void} + */ +export const setPassiveTouchGestures = function(usePassive) { + passiveTouchGestures = usePassive; +}; diff --git a/lib/utils/style-gather.js b/lib/utils/style-gather.js index 3b0a48da6a..6479fb6672 100644 --- a/lib/utils/style-gather.js +++ b/lib/utils/style-gather.js @@ -1,4 +1,4 @@ - - - +/** + * @deprecated + * @this {StyleGather} + * @param {!HTMLElement} module dom-module element that could contain `` styles + * @return {string} Concatenated CSS content from links in the dom-module + */ +export function _cssFromModuleImports(module) { + let cssText = ''; + let styles = _stylesFromModuleImports(module); + for (let i=0; i < styles.length; i++) { + cssText += styles[i].textContent; + } + return cssText; +} diff --git a/lib/utils/templatize.js b/lib/utils/templatize.js index 67b4a53179..3abf452e82 100644 --- a/lib/utils/templatize.js +++ b/lib/utils/templatize.js @@ -1,4 +1,4 @@ - +*/ +import './boot.js'; - - - +import { PropertyEffects } from '../mixins/property-effects.js'; +import { MutableData } from '../mixins/mutable-data.js'; - +export { TemplateInstanceBase }; diff --git a/lib/utils/unresolved.js b/lib/utils/unresolved.js index 6c8752a97f..fd692d4022 100644 --- a/lib/utils/unresolved.js +++ b/lib/utils/unresolved.js @@ -1,31 +1,9 @@ - - +function resolve() { + document.body.removeAttribute('unresolved'); +} + +if (document.readyState === 'interactive' || document.readyState === 'complete') { + resolve(); +} else { + window.addEventListener('DOMContentLoaded', resolve); +} diff --git a/polymer-element.js b/polymer-element.js index aeb4a0e193..e28c43b2d9 100644 --- a/polymer-element.js +++ b/polymer-element.js @@ -1,44 +1,30 @@ - - - - - \ No newline at end of file +/** + * @constructor + * @implements {Polymer_ElementMixin} + * @extends {HTMLElement} + */ +export { Element as PolymerElement }; + +// NOTE: this is here for modulizer to export `html` for the module version of this file +export { html$0 as html }; diff --git a/polymer-legacy.js b/polymer-legacy.js index a2ceeadb0c..bd8192f2eb 100644 --- a/polymer-legacy.js +++ b/polymer-legacy.js @@ -1,4 +1,16 @@ - - - - - - - - - - - - - - - - +// NOTE: this is here for modulizer to export `html` for the module version of this file +export { html$0 as html }; diff --git a/test/perf/binding-expressions.html b/test/perf/binding-expressions.html index 6df67e94a6..381023e24c 100644 --- a/test/perf/binding-expressions.html +++ b/test/perf/binding-expressions.html @@ -3,10 +3,10 @@ - - - - + + + + @@ -56,23 +56,26 @@ - + diff --git a/test/perf/perf-tests.html b/test/perf/perf-tests.html index c5fbb8ee43..74ac4112be 100644 --- a/test/perf/perf-tests.html +++ b/test/perf/perf-tests.html @@ -3,9 +3,9 @@ - - - + + + - + @@ -95,41 +96,41 @@ {{toFixed(value)}} {{value}} - + @@ -157,31 +158,31 @@ - + @@ -216,159 +217,159 @@

Table {{index}}:

- + } + } +}); + diff --git a/test/smoke/dirty-check.html b/test/smoke/dirty-check.html index ba0287342a..6aac8cc500 100644 --- a/test/smoke/dirty-check.html +++ b/test/smoke/dirty-check.html @@ -10,8 +10,8 @@ - - + + @@ -21,37 +21,40 @@

1 + [[foo]] = [[bar]]

- + } + objChanged(val, old) { + console.log('new', val, 'old', old); + } + _shouldPropertyChange(prop, val, old) { + if (this.strict) { + return val !== old; + } else if (val instanceof Date) { + return !(old instanceof Date) || val.getTime() !== old.getTime(); + } else { + return super._shouldPropertyChange(prop, val, old); + } + } +} +customElements.define('x-host', XHost); + - + - + @@ -32,24 +31,26 @@

[[prop]]

- + @@ -74,24 +75,26 @@

x-disabled with disable-upgrade

- + diff --git a/test/smoke/disabled-attr-gestures.html b/test/smoke/disabled-attr-gestures.html index e33cf34e1a..245531df23 100644 --- a/test/smoke/disabled-attr-gestures.html +++ b/test/smoke/disabled-attr-gestures.html @@ -10,8 +10,8 @@ --> - - + + @@ -22,17 +22,18 @@ - + diff --git a/test/smoke/dom-if.html b/test/smoke/dom-if.html index 84b1aacb8c..320df6023a 100644 --- a/test/smoke/dom-if.html +++ b/test/smoke/dom-if.html @@ -1,7 +1,7 @@ - + @@ -34,24 +34,25 @@ - + } + } + constructor() { + super(); + this.prop = 'my-element' + } +} +customElements.define(MyElement.is, MyElement); + diff --git a/test/smoke/gestures.html b/test/smoke/gestures.html index 24b41f51d3..abf625d7f7 100644 --- a/test/smoke/gestures.html +++ b/test/smoke/gestures.html @@ -14,8 +14,8 @@ --> - - + + @@ -40,9 +40,11 @@ - + \ No newline at end of file diff --git a/test/smoke/html-tag.html b/test/smoke/html-tag.html index 7f1ad95cbf..b944eb5fee 100644 --- a/test/smoke/html-tag.html +++ b/test/smoke/html-tag.html @@ -10,54 +10,57 @@ --> - - + + - - + + diff --git a/test/smoke/label-click.html b/test/smoke/label-click.html index c2ca4d3fa1..47c4c7891c 100644 --- a/test/smoke/label-click.html +++ b/test/smoke/label-click.html @@ -13,8 +13,8 @@ - - + + diff --git a/test/smoke/ordering-test.html b/test/smoke/ordering-test.html index 5400425ed8..5314236b9c 100644 --- a/test/smoke/ordering-test.html +++ b/test/smoke/ordering-test.html @@ -12,124 +12,126 @@ - - + + - diff --git a/test/smoke/passive-gestures.html b/test/smoke/passive-gestures.html index cc578a2d52..24d2726e0f 100644 --- a/test/smoke/passive-gestures.html +++ b/test/smoke/passive-gestures.html @@ -10,9 +10,13 @@ --> - - - + + + - + \ No newline at end of file diff --git a/test/smoke/style-props/src/elements-defaults.js b/test/smoke/style-props/src/elements-defaults.js index 4ca54e4fe9..c40f8c5fb3 100644 --- a/test/smoke/style-props/src/elements-defaults.js +++ b/test/smoke/style-props/src/elements-defaults.js @@ -1,4 +1,7 @@ - \ No newline at end of file +`; + +document.head.appendChild($_documentContainer); diff --git a/test/smoke/style-props/src/elements.html b/test/smoke/style-props/src/elements.js similarity index 87% rename from test/smoke/style-props/src/elements.html rename to test/smoke/style-props/src/elements.js index 880b8b00a0..dbb1fb27c0 100644 --- a/test/smoke/style-props/src/elements.html +++ b/test/smoke/style-props/src/elements.js @@ -1,7 +1,8 @@ - - - - - +`; - - - +`, - \ No newline at end of file + clickHandler: function() { + this.fire('setting-change', this.setting); + } +}); diff --git a/test/smoke/style-props/test.html b/test/smoke/style-props/test.html index 8fd1850296..dc0d2a09af 100644 --- a/test/smoke/style-props/test.html +++ b/test/smoke/style-props/test.html @@ -4,19 +4,24 @@ style properties - - - + + + - + - + diff --git a/test/unit/array-selector-elements.js b/test/unit/array-selector-elements.js index b4995579a0..6f8b566280 100644 --- a/test/unit/array-selector-elements.js +++ b/test/unit/array-selector-elements.js @@ -1,4 +1,4 @@ - - diff --git a/test/unit/array-selector.html b/test/unit/array-selector.html index 7b11b599cc..57a61d6a5a 100644 --- a/test/unit/array-selector.html +++ b/test/unit/array-selector.html @@ -11,10 +11,10 @@ - - - - + + + + @@ -45,7 +45,9 @@ - diff --git a/test/unit/async.html b/test/unit/async.html index 0b33865eab..5ab21e49ee 100644 --- a/test/unit/async.html +++ b/test/unit/async.html @@ -11,468 +11,468 @@ - - - + + + - diff --git a/test/unit/attributes-elements.js b/test/unit/attributes-elements.js index 99e060edf0..96a69ea21c 100644 --- a/test/unit/attributes-elements.js +++ b/test/unit/attributes-elements.js @@ -1,4 +1,4 @@ - +*/ +import { Polymer } from '../../lib/utils/boot.js'; - - - + propChangedCount: 0, + attr1ChangedCount: 0, - - - - + } +}); +Polymer({ + _template: html` + +`, + + is: 'x-compose', + + hostAttributes: { + attr1: 'compose' + }, + + properties: { + attr1: String, + prop2: String + }, + + ready: function() { + this.setAttribute('prop2', 'hi'); + } +}); diff --git a/test/unit/attributes.html b/test/unit/attributes.html index ea08885ac6..f853fca934 100644 --- a/test/unit/attributes.html +++ b/test/unit/attributes.html @@ -11,10 +11,10 @@ - - - - + + + + @@ -87,270 +87,272 @@ - + + test('hostAttributes set correctly in composed element', function() { + var element = fixture('compose'); + assert.strictEqual(element.$.basic.getAttribute('attr1'), 'compose'); + assert.strictEqual(element.$.basic.getAttribute('attr2'), '42'); + assert.strictEqual(element.$.basic.getAttribute('aria-role'), 'button'); + assert.strictEqual(element.$.basic.getAttribute('title'), 'awesome'); + assert.strictEqual(element.$.basic.title, 'awesome'); + + assert.equal(element.$.basic.getAttribute('attr-object'), JSON.stringify(configuredObject)); + assert.equal(element.$.basic.hasAttribute('attr-stupid'), false); + + // class does not overwrite user setting + assert.notOk(element.$.basic.classList.contains('foo')); + assert.notOk(element.$.basic.classList.contains('bar')); + assert.notOk(element.$.basic.classList.contains('baz')); + + assert(element.$.basic.classList.contains('should-not-override')); + + // applied to property with effect + assert.strictEqual(element.$.basic.prop, 'compose'); + assert.equal(element.$.basic.propChangedCount, 1); + assert.equal(element.$.basic.attr1ChangedCount, 1); + assert.equal(element.prop2, 'hi'); + }); + +}); + diff --git a/test/unit/behaviors.html b/test/unit/behaviors.html index 34d94097eb..35c26edaa3 100644 --- a/test/unit/behaviors.html +++ b/test/unit/behaviors.html @@ -11,9 +11,9 @@ - - - + + + @@ -22,269 +22,269 @@ - +window.registerBehavior1 ={ + beforeRegister: function() { + this._createPropertyObserver('beforeProp', 'beforePropChanged1'); + this.beforeRegisterCount++; + this.beforeRegisterBehaviors = this.behaviors; + }, + registered: function() { + this._createPropertyObserver('prop', 'propChanged1'); + this._createMethodObserver('propChanged2(prop)'); + this.registeredCount++; + this.registeredProps = [this.prop1, this.prop2, this.prop3, this.prop4]; + this.registeredBehaviors = this.behaviors; + }, + prop1: true, + ready: function() { + this._ensureAttribute('attr', true); + }, + beforePropChanged1: function() { + this.beforePropChangedCalled = true; + }, + propChanged1: function() { + this.propChanged1Called = true; + }, + propChanged2: function() { + this.propChanged2Called = true; + } +}; + +window.registerBehavior2 ={ + prop2: true, + beforeRegister: function() { + this.beforeRegisterCount++; + }, + registered: function() { + this.registeredCount++; + } +}; + +window.registerBehavior3 ={ + prop3: true, + beforeRegister: function() { + this.beforeRegisterCount++; + }, + registered: function() { + this.registeredCount++; + } +}; + +Polymer({ + behaviors: [ + window.registerBehavior1, + window.registerBehavior2, + window.registerBehavior3 + ], + prop4: true, + beforeRegister: function() { + this.beforeRegisterCount++; + }, + registered: function() { + this.registeredCount++; + }, + + beforeRegisterCount: 0, + registeredCount: 0, + + is: 'behavior-registered' +}); + - diff --git a/test/unit/case-map.html b/test/unit/case-map.html index e3dad06589..2581691e97 100644 --- a/test/unit/case-map.html +++ b/test/unit/case-map.html @@ -11,33 +11,34 @@ - - - + + + - diff --git a/test/unit/configure.html b/test/unit/configure.html index 06be8105f4..7b15e06c0e 100644 --- a/test/unit/configure.html +++ b/test/unit/configure.html @@ -11,195 +11,195 @@ - - - + + + - + - +}); + - +}); + - +}); + - +}); + @@ -216,103 +216,105 @@ > - + - + - + @@ -320,22 +322,22 @@ - + @@ -346,189 +348,190 @@ - diff --git a/test/unit/css-parse.html b/test/unit/css-parse.html index 40ba7e9157..066764fda2 100644 --- a/test/unit/css-parse.html +++ b/test/unit/css-parse.html @@ -13,12 +13,12 @@ - - + + css-parse - + @@ -98,85 +98,86 @@ .bar {} - diff --git a/test/unit/custom-style-async-import.html b/test/unit/custom-style-async-import.html index 6a9b1cd95d..dba3767539 100644 --- a/test/unit/custom-style-async-import.html +++ b/test/unit/custom-style-async-import.html @@ -27,9 +27,10 @@ x-client - + diff --git a/test/unit/custom-style-async.html b/test/unit/custom-style-async.html index c6ff2e7e87..4f34d18a2a 100644 --- a/test/unit/custom-style-async.html +++ b/test/unit/custom-style-async.html @@ -11,9 +11,9 @@ - - - + + + @@ -31,39 +31,40 @@ - + - +function assertComputed(element, value, property, pseudo) { + var computed = getComputedStyle(element, pseudo); + property = property || 'border-top-width'; + assert.equal(computed[property], value, 'computed style incorrect for ' + property); +} + diff --git a/test/unit/custom-style-import.js b/test/unit/custom-style-import.js index eb8503cce7..1574c9da7f 100644 --- a/test/unit/custom-style-import.js +++ b/test/unit/custom-style-import.js @@ -1,13 +1,8 @@ - - +import './sub/style-import.js'; +const $_documentContainer = document.createElement('div'); +$_documentContainer.setAttribute('style', 'display: none;'); + +$_documentContainer.innerHTML = ` - - - + - - - - - + - +`; + +document.head.appendChild($_documentContainer); + +/** +@license +Copyright (c) 2017 The Polymer Project Authors. All rights reserved. +This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt +The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt +The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt +Code distributed by Google as part of the polymer project is also +subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt +*/ +/* + FIXME(polymer-modulizer): the above comments were extracted + from HTML and may be out of place here. Review them and + then delete this comment! +*/ +; diff --git a/test/unit/custom-style-late.html b/test/unit/custom-style-late.html index aab52da785..6671329814 100644 --- a/test/unit/custom-style-late.html +++ b/test/unit/custom-style-late.html @@ -11,9 +11,9 @@ - - - + + + @@ -40,35 +40,37 @@ - +function assertComputed(element, value, property, pseudo) { + var computed = getComputedStyle(element, pseudo); + property = property || 'border-top-width'; + assert.equal(computed[property], value, 'computed style incorrect for ' + property); +} + diff --git a/test/unit/custom-style-scope-cache.html b/test/unit/custom-style-scope-cache.html index 78078c58b3..650768f0ff 100644 --- a/test/unit/custom-style-scope-cache.html +++ b/test/unit/custom-style-scope-cache.html @@ -11,9 +11,9 @@ - - - + + + @@ -34,50 +34,50 @@ cache-element - + - +function assertComputed(element, value, property, pseudo) { + var computed = getComputedStyle(element, pseudo); + property = property || 'border-top-width'; + assert.equal(computed[property], value, 'computed style incorrect for ' + property); +} + diff --git a/test/unit/custom-style.html b/test/unit/custom-style.html index 97ff8ac21a..7d24133f21 100644 --- a/test/unit/custom-style.html +++ b/test/unit/custom-style.html @@ -11,13 +11,24 @@ - - - - + + + + - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - + + + + + + + + + - Polymer({ - is: 'x-bar' - }); + +Polymer({ + is: 'x-red-text' +}); - - suite('custom-style', function() { + + // Because FireFox and Chrome parse font-family differently... + var computed = getComputedStyle(el); + assert.equal(computed['font-family'].replace(/['"]+/g, ''), 'Varela font'); + }); + + test('BEM-like CSS selectors under media queries', function() { + assertComputed(document.querySelector('.foo--bar'), '20px'); + }); + +}); + + +function assertComputed(element, value, property, pseudo) { + var computed = getComputedStyle(element, pseudo); + property = property || 'border-top-width'; + assert.equal(computed[property], value, 'computed style incorrect for ' + property); +} + diff --git a/test/unit/debounce.html b/test/unit/debounce.html index 96819d44a8..7166b090d7 100644 --- a/test/unit/debounce.html +++ b/test/unit/debounce.html @@ -11,9 +11,9 @@ - - - + + + @@ -28,17 +28,60 @@ - diff --git a/test/unit/dir.html b/test/unit/dir.html index 0cc008246d..c39a803c2d 100644 --- a/test/unit/dir.html +++ b/test/unit/dir.html @@ -10,10 +10,10 @@ --> - - - - + + + + - - - - + + + + @@ -31,30 +31,31 @@

[[prop]]

- + @@ -72,48 +73,50 @@

[[prop]]

[[prop]]

- + @@ -125,23 +128,24 @@

[[prop]]

Disabled - + @@ -156,116 +160,119 @@

[[prop]]

- + - \ No newline at end of file diff --git a/test/unit/dom-bind-elements1.js b/test/unit/dom-bind-elements1.js index bc0639fbf1..3e471cd3d6 100644 --- a/test/unit/dom-bind-elements1.js +++ b/test/unit/dom-bind-elements1.js @@ -1,4 +1,4 @@ - - +*/ +import { Polymer } from '../../lib/utils/boot.js'; - - - - +import { html } from '../../lib/utils/html-tag.js'; +Polymer({ + is: 'x-basic', + properties: { + notifyingvalue: { + notify: true + } + } +}); +Polymer({ + _template: html` +
+`, - - - - + template.content.appendChild(span); + domBind.hello = 'hey'; - - - - + this.$.local.appendChild(domBind); + } +}); +Polymer({ + _template: html` + +`, - + } +}); diff --git a/test/unit/dom-bind-elements2.js b/test/unit/dom-bind-elements2.js index 076b718d53..4ae2439458 100644 --- a/test/unit/dom-bind-elements2.js +++ b/test/unit/dom-bind-elements2.js @@ -1,4 +1,4 @@ - - + this.config = this.__dataHost.getAttribute('config'); + } +}); diff --git a/test/unit/dom-bind.html b/test/unit/dom-bind.html index 6a5af3461a..1fc1f1d12b 100644 --- a/test/unit/dom-bind.html +++ b/test/unit/dom-bind.html @@ -11,8 +11,8 @@ - - + + @@ -22,13 +22,16 @@ - + - - + + - +
@@ -56,216 +63,219 @@
- - // Flush CE & distribution - Polymer.flush(); - - assert.equal(composeEl.$.local.$.slot.assignedNodes()[0].textContent, 'hey', - 'dom-bind did not distribute'); - document.body.removeChild(composeEl); - }); - - }); - - suite('timing', function() { - - test('late-loaded import should block stamping', function() { - assert.equal(needsHost.config, 'config'); - }); - - test('non-upgrade case finds template', function() { - assert.equal(nonUpgrade.textContent.trim(), 'stamped'); - }); - - }); - - - - - + diff --git a/test/unit/dom-if-elements.js b/test/unit/dom-if-elements.js index a077feea22..dc54d1d557 100644 --- a/test/unit/dom-if-elements.js +++ b/test/unit/dom-if-elements.js @@ -1,4 +1,4 @@ - - - - - - - - - - +`, + + is: 'x-nested-if', + testHandler1Count: 0, + testHandler2Count: 0, + testHandler3Count: 0, + domUpdateHandlerCount: 0, + + testHandler1: function() { + this.testHandler1Count++; + }, + + testHandler2: function() { + this.testHandler2Count++; + }, - - - - + }, - - - - - + }, - - - +}); + diff --git a/test/unit/logging.html b/test/unit/logging.html index b8c08a95a7..7acb627086 100644 --- a/test/unit/logging.html +++ b/test/unit/logging.html @@ -11,95 +11,96 @@ - - - + + + - + - + - +}); + diff --git a/test/unit/mixin-behaviors.html b/test/unit/mixin-behaviors.html index e73eec279e..37f1fa19f7 100644 --- a/test/unit/mixin-behaviors.html +++ b/test/unit/mixin-behaviors.html @@ -11,329 +11,333 @@ - - - + + + - - _simpleProperty: 'C' - }; + + + - window.BehaviorD = { + + + - properties: { + + + constructor() { + super(); + } - - - - - - - + _fooChanged(foo) { + this.__foo = foo; + } - - + _ensureAttributes() { + this._ensureAttribute('element', 'element'); + super._ensureAttributes(); + } +}); + - + - + @@ -371,7 +375,11 @@ - diff --git a/test/unit/mixin-utils.html b/test/unit/mixin-utils.html index 378a716d1c..d5241e4a22 100644 --- a/test/unit/mixin-utils.html +++ b/test/unit/mixin-utils.html @@ -11,108 +11,110 @@ - - - + + + - +}); + \ No newline at end of file diff --git a/test/unit/multi-style.html b/test/unit/multi-style.html index 4c1d571a2a..d040de9e6f 100644 --- a/test/unit/multi-style.html +++ b/test/unit/multi-style.html @@ -10,8 +10,8 @@ --> - - + + @@ -54,71 +54,74 @@
zot
- + - + +}); + \ No newline at end of file diff --git a/test/unit/path-effects-elements.js b/test/unit/path-effects-elements.js index e436f369d5..9fa5f4e4fd 100644 --- a/test/unit/path-effects-elements.js +++ b/test/unit/path-effects-elements.js @@ -1,4 +1,4 @@ - +*/ +import { PropertiesMixin } from '../../lib/mixins/properties-mixin.js'; - - - +}); +Polymer({ + _template: html` + + +`, - + }, - - - - + observers: [ + 'objSubpathChanged(obj.*)', + 'objValueChanged(obj.value)', + ], + + created: function() { + this.resetObservers(); + }, - - - - +`, - - - - +`, + is: 'x-stuff', - + }, + + computeFromPaths: function(a, b, c) { + return a + b + c; + }, - - - - + }, + prop: { + value: 0 + } + }, - + observers: ['objChanged(obj.*)'], - - - - + }, + + observers: ['objChanged(obj.*)'], + + created: function() { + this.objChanged = sinon.spy(); + } +}); diff --git a/test/unit/path-effects.html b/test/unit/path-effects.html index 2a90a7ecdc..35aaef3782 100644 --- a/test/unit/path-effects.html +++ b/test/unit/path-effects.html @@ -11,15 +11,16 @@ - - - - + + + + - diff --git a/test/unit/path.html b/test/unit/path.html index 01a6bee1c7..088ba8fc16 100644 --- a/test/unit/path.html +++ b/test/unit/path.html @@ -11,76 +11,78 @@ - - - + + + - diff --git a/test/unit/polymer-dom-observeNodes.html b/test/unit/polymer-dom-observeNodes.html index a6e0272d0b..b7cb9f44aa 100644 --- a/test/unit/polymer-dom-observeNodes.html +++ b/test/unit/polymer-dom-observeNodes.html @@ -11,9 +11,9 @@ - - - + + + @@ -21,164 +21,165 @@ - + }, + detached: function() { + dom(this).unobserveNodes(this._observer); + } +}); + - + - + - + - + - + - + - + - + - + - + - + @@ -188,841 +189,842 @@
- diff --git a/test/unit/polymer-dom.html b/test/unit/polymer-dom.html index 44e15b4064..3d3c2b7e57 100644 --- a/test/unit/polymer-dom.html +++ b/test/unit/polymer-dom.html @@ -11,9 +11,9 @@ - - - + + + @@ -21,55 +21,55 @@ - + - + - + - + @@ -90,261 +90,263 @@ - diff --git a/test/unit/polymer-element-with-apply-import.js b/test/unit/polymer-element-with-apply-import.js index 2fbc78dd89..92fc023eec 100644 --- a/test/unit/polymer-element-with-apply-import.js +++ b/test/unit/polymer-element-with-apply-import.js @@ -1,4 +1,4 @@ - - - - +*/ +import { PolymerElement } from '../../polymer-element.js'; - - - - - - - - \ No newline at end of file + + static get is() {return 'x-outer';} +} +customElements.define('x-outer', XOuter); diff --git a/test/unit/polymer-element-with-apply.html b/test/unit/polymer-element-with-apply.html index 87e76f9d9c..bebf066da6 100644 --- a/test/unit/polymer-element-with-apply.html +++ b/test/unit/polymer-element-with-apply.html @@ -10,9 +10,9 @@ --> - - - + + + @@ -39,27 +39,28 @@ - +}); + \ No newline at end of file diff --git a/test/unit/polymer.element.html b/test/unit/polymer.element.html index 3f098da0d9..b342ccfbdf 100644 --- a/test/unit/polymer.element.html +++ b/test/unit/polymer.element.html @@ -11,267 +11,261 @@ - - - + + + - + - + }; + } + + static get observers() { + return [ + '_subMethodObserver(prop, prop2)' + ]; + } + + constructor() { + super(); + this._calledConstructor++; + this._prop2Observer = sinon.spy(); + this._subMethodObserver = sinon.spy(); + } + + connectedCallback() { + super.connectedCallback(); + this._calledConnectedCallback++; + } + + ready() { + super.ready(); + this._calledReady++; + this._ensureAttribute('role', 'button'); + this.addEventListener('click', (e) => this._tapListener(e)); + } + +} + +customElements.define(SubElement.is, SubElement); + +window.SubElement = SubElement; + - + static get is() { return 'sub-mixin-element'; } + + static get properties() { + return { + prop3: { + value: 'prop3', + observer: '_prop3Observer' + } + }; + } + + static get observers() { + return [ + '_subMixinMethodObserver(mixin, prop, prop2, prop3)' + ]; + } + + constructor() { + super(); + this._calledConstructor++; + this._prop3Observer = sinon.spy(); + this._subMixinMethodObserver = sinon.spy(); + } + + connectedCallback() { + super.connectedCallback(); + this._calledConnectedCallback++; + } + + ready() { + super.ready(); + this._calledReady++; + this._ensureAttribute('submixinattr', 'submixinattr'); + this.addEventListener('click', (e) => this._tapListener(e)); + } + +} + +customElements.define(SubMixinElement.is, SubMixinElement); + +window.SubMixinElement = SubMixinElement; + - +customElements.define('sub-new-template', SubNewTemplate); + - + - + @@ -339,219 +331,238 @@

Sub template

 - + teardown(function() { + document.body.removeChild(el); + document.body.removeChild(baseEl); + }); + test('has original template', function() { + assert.equal(el.prop, 'base'); + assert.equal(el.$.content.textContent, el.prop); + }); + test('has new element', function() { + assert.ok(el.$.subContent); + assert.equal(el.$.subContent.getAttribute('imaginary-prop'), 'base'); + }); + test('base doesnt have new element', function() { + assert.notOk(baseEl.$.subContent); + }); +}); + diff --git a/test/unit/polymer.legacyelement.html b/test/unit/polymer.legacyelement.html index 10159e9353..843e9ec4e7 100644 --- a/test/unit/polymer.legacyelement.html +++ b/test/unit/polymer.legacyelement.html @@ -11,95 +11,93 @@ - - - + + + - + static get properties() { + return { + prop: { + value: 'base' + } + }; + } + + created() { + super.created(); + this._calledCreated++; + } + + attached() { + super.attached(); + this._calledAttached++; + } + + attributeChanged() { + super.attributeChanged.apply(this, arguments); + this._callAttributeChanged++; + } + + ready() { + super.ready(); + this._calledReady++; + } +} + +MyElement.prototype._calledCreated = 0; +MyElement.prototype._calledAttached = 0; +MyElement.prototype._calledReady = 0; +MyElement.prototype._callAttributeChanged = 0; + +customElements.define(MyElement.is, MyElement); + +window.MyElement = MyElement; + - +window.SubElement = SubElement; + @@ -108,86 +106,88 @@ - +}); + diff --git a/test/unit/polymer.properties-mixin-with-property-accessors.html b/test/unit/polymer.properties-mixin-with-property-accessors.html index 5bfc623dc8..69f7c2eacc 100644 --- a/test/unit/polymer.properties-mixin-with-property-accessors.html +++ b/test/unit/polymer.properties-mixin-with-property-accessors.html @@ -11,174 +11,172 @@ - - - - + + + + - + - + - + ready() { + super.ready(); + this._calledReady++; + this._ensureAttribute('submixinattr', 'submixinattr'); + this.addEventListener('click', (e) => this._tapListener(e)); + } + +} + +customElements.define('sub-mixin-element', SubMixinElement); + +window.SubMixinElement = SubMixinElement; + @@ -199,159 +197,158 @@ - +}); + diff --git a/test/unit/polymer.properties-mixin.html b/test/unit/polymer.properties-mixin.html index 1f4a5a179d..db7ce8ac4a 100644 --- a/test/unit/polymer.properties-mixin.html +++ b/test/unit/polymer.properties-mixin.html @@ -11,208 +11,203 @@ - - - + + + - + - + - +} + +customElements.define('sub-mixin-element', SubMixinElement); + +window.SubMixinElement = SubMixinElement; + @@ -233,201 +228,199 @@ - +}); + diff --git a/test/unit/properties-changed.html b/test/unit/properties-changed.html index 9ee8417f35..2cd61ba266 100644 --- a/test/unit/properties-changed.html +++ b/test/unit/properties-changed.html @@ -11,73 +11,74 @@ - - - + + + - - diff --git a/test/unit/property-accessors.html b/test/unit/property-accessors.html index 51b3cd7d0b..b86c042ad0 100644 --- a/test/unit/property-accessors.html +++ b/test/unit/property-accessors.html @@ -11,34 +11,35 @@ - - - + + + - - diff --git a/test/unit/property-effects-elements.js b/test/unit/property-effects-elements.js index f9144d74f1..77013249ec 100644 --- a/test/unit/property-effects-elements.js +++ b/test/unit/property-effects-elements.js @@ -1,4 +1,4 @@ - - - - - - - + - + @@ -403,20 +404,20 @@ - + } + } +}); + @@ -424,31 +425,31 @@
- + - + @@ -456,29 +457,29 @@ - + - + @@ -489,45 +490,45 @@ - + - + - + @@ -542,87 +543,87 @@ - + - + - + - + - + - + @@ -643,45 +644,45 @@ - + - + - + @@ -700,29 +701,29 @@ - + - + @@ -731,29 +732,29 @@ - + - + @@ -810,565 +811,566 @@ }; } - diff --git a/test/unit/shady-events.html b/test/unit/shady-events.html index 57e0c18d1f..b22e0c5f05 100644 --- a/test/unit/shady-events.html +++ b/test/unit/shady-events.html @@ -19,9 +19,9 @@ force: true }; - - - + + + @@ -29,51 +29,51 @@ - + }, + fireComposed: function() { + return this.fire('composed', null, {node: this.$.scoped}); + }, + fireScoped: function(){ + return this.fire('scoped', null, {node: this.$.scoped, composed: false}); + } +}); + @@ -85,35 +85,35 @@
- + @@ -121,22 +121,22 @@
- + @@ -175,7 +175,8 @@ - - - - + + + + @@ -44,13 +44,14 @@
Happy: orange
- + @@ -68,58 +69,61 @@
Happy: orange
- + - \ No newline at end of file diff --git a/test/unit/shady.html b/test/unit/shady.html index f5c881420e..51ada8f92c 100644 --- a/test/unit/shady.html +++ b/test/unit/shady.html @@ -11,22 +11,19 @@ - - - + + + - diff --git a/test/unit/styling-cross-scope-apply.html b/test/unit/styling-cross-scope-apply.html index 8cd5d27906..f9fd9cb94f 100644 --- a/test/unit/styling-cross-scope-apply.html +++ b/test/unit/styling-cross-scope-apply.html @@ -11,9 +11,9 @@ - - - + + + @@ -37,11 +37,11 @@
Content
- + @@ -97,11 +97,11 @@
mixin8
mixin9
- + @@ -149,20 +149,20 @@ x-keyframes - + @@ -278,11 +278,11 @@
override
- + @@ -297,13 +297,13 @@ } - + @@ -317,13 +317,13 @@ X - + @@ -339,13 +339,13 @@ - + @@ -361,13 +361,13 @@ - + @@ -384,13 +384,13 @@
X
- + @@ -402,11 +402,11 @@
- + @@ -420,11 +420,11 @@ - + @@ -439,11 +439,11 @@ - + @@ -483,14 +483,16 @@ - - diff --git a/test/unit/styling-cross-scope-unknown-host.html b/test/unit/styling-cross-scope-unknown-host.html index fbe5496607..e4599b0435 100644 --- a/test/unit/styling-cross-scope-unknown-host.html +++ b/test/unit/styling-cross-scope-unknown-host.html @@ -11,9 +11,9 @@ - - - + + + @@ -31,18 +31,17 @@ - + - + @@ -73,62 +72,61 @@ - + attached: function() { + this.$.unknown.shadowRoot.appendChild(document.createElement('x-foo')); + } +}); + - +}); + diff --git a/test/unit/styling-cross-scope-var.html b/test/unit/styling-cross-scope-var.html index be4786ea08..b301d0fe88 100644 --- a/test/unit/styling-cross-scope-var.html +++ b/test/unit/styling-cross-scope-var.html @@ -11,9 +11,9 @@ - - - + + + Host property - + - + @@ -102,11 +102,11 @@ - + @@ -140,11 +140,11 @@ - + @@ -161,11 +161,11 @@ overrides: - + @@ -186,11 +186,11 @@ overrides: - + @@ -203,11 +203,11 @@ late - + @@ -227,11 +227,11 @@ overrides: - + @@ -246,11 +246,11 @@ Element with default variable. - + @@ -264,16 +264,16 @@
iffy
- + @@ -286,14 +286,14 @@ Button! - + @@ -307,13 +307,13 @@ Dynamic - + @@ -359,20 +359,20 @@ x-keyframes - + @@ -533,13 +533,13 @@
- + @@ -554,13 +554,13 @@ } - + @@ -577,13 +577,13 @@ - + @@ -597,13 +597,13 @@ } - + @@ -615,13 +615,13 @@ test - + @@ -639,13 +639,13 @@ - + @@ -658,13 +658,13 @@ } - + @@ -678,13 +678,13 @@ - + @@ -702,13 +702,13 @@ } - + @@ -729,384 +729,386 @@ - + _activeChanged: function() { + this.updateStyles(); + } +}); + - diff --git a/test/unit/styling-import-host.css b/test/unit/styling-import-host.css deleted file mode 100644 index 7fd9e04f4f..0000000000 --- a/test/unit/styling-import-host.css +++ /dev/null @@ -1,13 +0,0 @@ -/* -@license -Copyright (c) 2017 The Polymer Project Authors. All rights reserved. -This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt -The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt -The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt -Code distributed by Google as part of the polymer project is also -subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt -*/ -:host { - display: block; - border: 1px solid black; -} \ No newline at end of file diff --git a/test/unit/styling-import-shared-styles.js b/test/unit/styling-import-shared-styles.js index 63af673d13..21555ddc4c 100644 --- a/test/unit/styling-import-shared-styles.js +++ b/test/unit/styling-import-shared-styles.js @@ -1,20 +1,14 @@ - - +const $_documentContainer = document.createElement('div'); +$_documentContainer.setAttribute('style', 'display: none;'); + +$_documentContainer.innerHTML = ` - - + + - +`; + +document.head.appendChild($_documentContainer); + +/** +@license +Copyright (c) 2017 The Polymer Project Authors. All rights reserved. +This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt +The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt +The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt +Code distributed by Google as part of the polymer project is also +subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt +*/ +/* + FIXME(polymer-modulizer): the above comments were extracted + from HTML and may be out of place here. Review them and + then delete this comment! +*/ +; diff --git a/test/unit/styling-import.html b/test/unit/styling-import.html index b74c99ae29..59a62d713e 100644 --- a/test/unit/styling-import.html +++ b/test/unit/styling-import.html @@ -11,10 +11,10 @@ - - - - + + + + @@ -25,11 +25,12 @@
- + @@ -45,11 +46,12 @@
- + @@ -62,56 +64,59 @@
- + - diff --git a/test/unit/styling-only-with-template.html b/test/unit/styling-only-with-template.html index c724b26678..2261a4194e 100644 --- a/test/unit/styling-only-with-template.html +++ b/test/unit/styling-only-with-template.html @@ -12,9 +12,9 @@ - - - + + + @@ -40,40 +40,41 @@ - + - + test('dom-repeat and dom-if do not break custom-style', () => { + // force custom-style flushing + let target = document.querySelector('#target'); + window.ShadyCSS.styleDocument(); + assertComputed(target, '2px'); + }); +}); + \ No newline at end of file diff --git a/test/unit/styling-scoped.html b/test/unit/styling-scoped.html index 47b63d85e7..5721ff5205 100644 --- a/test/unit/styling-scoped.html +++ b/test/unit/styling-scoped.html @@ -11,20 +11,19 @@ - - - - + + + + x-keyframes - + - @@ -118,14 +117,14 @@ - @@ -139,11 +138,11 @@
x-child2
- @@ -151,13 +150,13 @@ - + @@ -274,20 +273,20 @@ - @@ -314,22 +313,22 @@
- - - + @@ -408,11 +407,11 @@ - + @@ -437,11 +436,11 @@ - + @@ -452,11 +451,11 @@ } - + @@ -496,11 +495,11 @@ - @@ -527,11 +526,11 @@
bar3
- + @@ -559,11 +558,11 @@ x-shared1 - + @@ -571,11 +570,11 @@ x-shared2 - + @@ -596,11 +595,11 @@ - + - @@ -681,14 +680,14 @@ - + @@ -705,28 +704,28 @@ } - + - + @@ -750,461 +749,461 @@ - + - diff --git a/test/unit/sub/resolveurl-elements.js b/test/unit/sub/resolveurl-elements.js index b9bdfa82fb..3fce1b0838 100644 --- a/test/unit/sub/resolveurl-elements.js +++ b/test/unit/sub/resolveurl-elements.js @@ -1,5 +1,4 @@ - - - - - - +const PRHybrid = Polymer({ + is: 'p-r-hybrid', + _template: 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' } +}); - - +class PRAp extends PolymerElement { + static get is() { return 'p-r-ap'; } +} +customElements.define(PRAp.is, PRAp); diff --git a/test/unit/sub/style-import.js b/test/unit/sub/style-import.js index eaf7abb4cd..3273a2c312 100644 --- a/test/unit/sub/style-import.js +++ b/test/unit/sub/style-import.js @@ -1,4 +1,7 @@ - +const $_documentContainer = document.createElement('div'); +$_documentContainer.setAttribute('style', 'display: none;'); + +$_documentContainer.innerHTML = ` - - - + - \ No newline at end of file +`; + +document.head.appendChild($_documentContainer); diff --git a/test/unit/sub/x-sub.html b/test/unit/sub/x-sub.html index 6cfd90e0b3..79f8c120fa 100644 --- a/test/unit/sub/x-sub.html +++ b/test/unit/sub/x-sub.html @@ -2,10 +2,11 @@ - + \ No newline at end of file diff --git a/test/unit/sub/x-test.html b/test/unit/sub/x-test.html index fd11e3be73..a474d8df33 100644 --- a/test/unit/sub/x-test.html +++ b/test/unit/sub/x-test.html @@ -2,9 +2,10 @@ - + \ No newline at end of file diff --git a/test/unit/template-stamp.html b/test/unit/template-stamp.html index e5fe58a764..7e4641b26f 100644 --- a/test/unit/template-stamp.html +++ b/test/unit/template-stamp.html @@ -12,10 +12,10 @@ - - + + - + @@ -31,69 +31,68 @@ - + let template = document.getElementById('test-template'); + this.dom = this._stampTemplate(template); + this.attachShadow({mode:'open'}).appendChild(this.dom); + } +} +customElements.define('template-stamper', TemplateStamper); + - +// Note template parsing API is tested in `property-effects-template.html`, +// combined with adding property effects + diff --git a/test/unit/template-whitespace.html b/test/unit/template-whitespace.html index 4bb15c9ad2..87099d3ab4 100644 --- a/test/unit/template-whitespace.html +++ b/test/unit/template-whitespace.html @@ -11,9 +11,9 @@ - - - + + + @@ -21,13 +21,13 @@ - + @@ -41,13 +41,13 @@
B
- + @@ -65,13 +65,13 @@
B
- + @@ -86,13 +86,13 @@ - + @@ -110,19 +110,19 @@
{{a}} {{b}}
- + @@ -136,75 +136,76 @@ - + - diff --git a/test/unit/templatize-elements.js b/test/unit/templatize-elements.js index 00470f6e1f..aae6e58c99 100644 --- a/test/unit/templatize-elements.js +++ b/test/unit/templatize-elements.js @@ -1,4 +1,4 @@ - - - - + +`, - + created: function() { + this.handleTap = sinon.spy(); + }, + outerObjChanged: function() {}, + objAChanged: function() {}, + objBChanged: function() {}, + computeFromLiteral: function(literal, prop) { return literal + '-' + prop; } +}); diff --git a/test/unit/templatize.html b/test/unit/templatize.html index d825839a9b..735839cf23 100644 --- a/test/unit/templatize.html +++ b/test/unit/templatize.html @@ -11,361 +11,363 @@ - - - - + + + + -