polymer Polymer Cheat Sheet Defining an element


Docs: 1.x -> 2.x upgrade guide, registering an element, shared style modules.

<link rel="import" href="bower_components/polymer/polymer-element.html">
<dom-module id="element-name">
    <!-- Use one of these style declarations, but not both -->
    <!-- Use this if you don’t want to include a shared style -->
    <!-- Use this if you want to include a shared style -->
    <style include="some-style-module-name"></style>
    class MyElement extends Polymer.Element {
      static get is() { return 'element-name'; }
      // All of these are optional. Only keep the ones you need.
      static get properties() { ... }
      static get observers() { ... }

    // Associate the new class with an element name
    customElements.define(MyElement.is, MyElement);

To get the class definition for a particular custom tag, you can use customElements.get('element-name').