Documenting library/mixin/behaviors elements in Polymer 1.0 -


i had polymer 0.5 element used library injected other elements using mixins. formatted followed , of jsdoc notation showed in index.html:

<polymer-element name="easy-search-lib" attributes="">    <template>      <content></content>    </template>    <script>      var easysearch = {        /**        * returns whether given domain matches search.        *        * @method matches        * @param {string} query string being searched for.        * @param {string} text text being searched within.        * @return {boolean} returns if there match.        */       matches: function(query, text){         query = this.getquery(query);         return query.test(text);       }        //...      };      polymer(polymer.mixin({        /**        * convenience function testing, binds easysearch polymer element.        *        * @attribute easysearch        * @type object        */       easysearch: easysearch      }, easysearch));    </script>  </polymer-element> 

polymer 1.0 replaced mixins behaviors , gives following example:

<script>     highlightbehavior = {        properties: {         ishighlighted: {           type: boolean,           value: false,           notify: true,           observer: '_highlightchanged'         }       },        listeners: {         click: '_togglehighlight'       },        created: function() {         console.log('highlighting ', this, + 'enabled!');       },        _togglehighlight: function() {         this.ishighlighted = !this.ishighlighted;       },        _highlightchanged: function(value) {         this.toggleclass('highlighted', value);       }      }; </script> 

note there no <dom-module id="highlight-behavior"> nor polymer({...}) element declaration.

i followed example exactly, nothing showed when visited index.html. tried emulating had done 0.5:

<script>    var easysearchlib = {      easysearch : {        /**        * returns whether given domain matches search.        *        * @method matches        * @param {string} query string being searched for.        * @param {string} text text being searched within.        * @return {boolean} returns if there match.        */       matches: function(query, text){         query = this.getquery(query);         return query.test(text);       }        //...      }   };    polymer({      is: 'easy-search-lib',      properties: {        /**        * `fancy` indicates element should don monocle , tophat,        * while checking pocket watch.        */       easysearchlib: easysearchlib     }    });  </script> 

i tried declaring variations of attribute assignment (easysearch: easysearchlib.easysearch) , throwing in behaviors: [easysearchlib] nothing shows in documentation.

what's best way of getting documentation behaviors/libraries show when visiting index.html?

put before behavior object definition:

/** @polymerbehavior */ var mybehavior = {}; 

if putting multiple behaviors in 1 object, want use this:

var easysearchlib = {    /** @polymerbehavior easysearchlib.easysearch */   easysearch: {} } 

alternatively, in similar situation define namespace object beforehand with:

var easysearchlib = easysearchlib || {}; 

at head of document, define behavior with:

/** @polymerbehavior */ easysearchlib.easysearch = {}; 

this lets parser infer name of behavior pretty easily. allows split individual behaviors separate files , attach them in order.

additional documentation: http://polymerelements.github.io/style-guide/#behaviors


Comments

Popular posts from this blog

python - TypeError: start must be a integer -

c# - DevExpress RepositoryItemComboBox BackColor property ignored -

django - Creating multiple model instances in DRF3 -