added filter for rt-repeat

[sensone]

Hi everyone, I think the filter in rt-repeat is a very good functionality. I propose to use the same syntax as in AngularJS with less count of options.

<el rt-repeat="el in collection | filter: expresstion">

For example:

<div>
    <ul>
        <li rt-repeat="item in this.state.items | filter: item === 'One' ">{item}</li>
    </ul>
</div>

It will be transformed to:

var repeatRT = function () {
    function repeatItem1(item, itemIndex) {
        return React.createElement('li', {}, item);
    }
    return React.createElement('div', {}, React.createElement.apply(this, [
        'ul',
        {},
        _.map(this.state.items.filter(function (item) {
            return item === 'One';
        }.bind(this), repeatItem1.bind(this))
    ]));
};

But I need help with unit tests. Could you help me? And please review my code.

[nippur72]

Some comments:

• the | is also a valid JavaScript operator, so collection | something might still be meaningful (though no so meaningful since it's a bitwise operator)
• can | be chained in your implementation? e.g. el in collection | sort | first
• by looking at the code, there's no need to create a new template and a new attribute, I suggest you to simply do an in-site replacement of the collection argument, so that it's transformed into the equivalent "map" expression. E.g. instead of

...
data.collection = arr[1].trim();
...

something like this:

...
data.collection = filterOperator(arr[1].trim());
...
function filterOperator(collection) {
  if(collection.indexOf("|")<0) return collection;
  // parse "|" here
  return `_.map(${collection}, ... , .... )`;
}

• the | syntax could be extended to all other template expressions, eg { someText | upperCase } but I don't know if maintainers will accept this syntax extension.

As regards unit testing, write a test/repeat-filter.rt file and its compiled version test/repeat-filter.js. Then modify test/src/rt.valid.spec.js simply adding your file name in the function that tests repeat.rt.

Run tests with npm run test or npm run all.