Cannot read property 'filter' of null

[mmatecki]

Hi,
I'm really impressed by your component. However I've got small, random issue. Sometimes I've got such error in console and no data in table (but in the summary of pager there's the good amount of rows).

Exception caught during observer callback: TypeError: Cannot read property 'filter' of null
at sortable-table.Polymer.mixin.sortByKey (http://localhost:8080/bower_components/sortable-table/sortable-table.html:843:30)
at Object.Filter.transform (http://localhost:8080/bower_components/polymer/polymer.js:3417:17)
at Object.Expression.getValue (http://localhost:8080/bower_components/polymer/polymer.js:3663:33)
at Object.valueFn as getValueFn_
at Object.ObserverTransform.observedCallback_ (http://localhost:8080/bower_components/polymer/polymer.js:5348:20)
at Object.Observer.report_ (http://localhost:8080/bower_components/polymer/polymer.js:4912:24)
at Object.createObject.check_ (http://localhost:8080/bower_components/polymer/polymer.js:5318:12)
at callback (http://localhost:8080/bower_components/polymer/polymer.js:4810:20)

Regards,

[moderndeveloperllc]

@mmatecki I got that too when trying to just use the response object of an AJAX call and passing it into the sortable-table data attribute. I'm guessing it has something to do with the order that bindings are being executed. It was easier for me to just have a handler for the return and set the attribute there. I haven't had that 'filter' error since.

handleReturn: function (e, detail, sender) {
    this.$.sortedTable.data = detail.response;
}

[stevenrskelton]

@moderndeveloperllc Thanks for replying to this.

Someone else's use case brought this to my attention (setting data to null cases errors), I made 0.11.1 to include a fix but I must have missed something.

I've been a bit slow to respond lately, I've been trying to tackle setting up Mocha+Chai to test for these things but unit testing web components is a bit new to everyone so it's taking time 😓

[mmatecki]

Thank you very much.
So now I've got:
<core-ajax url="{{$.globals.apiLocation}}/api/languages/all" handleAs="json" id="ajaxCall" auto on-core-response="{{handleReturn}}"></core-ajax>
and then in Polymer block
handleReturn: function (e, detail) { this.$.langTable.data = detail.response; }
and it works pefectly.

[masonlouchart]

I updated the component (to 0.11.1) and it doesn't work anymore. But with this issue I found the trouble. The sortable-table data attribute equals data="{{ data | contains(value, columns) }}".

My filter returns an array who contains each row who has a value into one of their columns who contains a specific string (non case sensitive). My interface has a field "search" and when the user is typing, the table is refreshed.

If I remove my custom filter, the component works fine. But you know... I love my custom filter 😍

And if I keep the custom filter the following error occurs :

I use already a handler to fill the data attribute.
I added some logs into the filter but the error occurs before it's called.

(sorry for my poor english)

[masonlouchart]

I found my solution. The cause was Polymer 0.5.5. I came back to the version 0.5.4 and the sortable-table works like a charm. Maybe the Polymer's mixin behavior has little bit changed in the latest version.