a.indexOf is not a function on loading image

[Bitneko]

When running $(img).load(function() {... on line 153, social feed throw back a Uncaught TypeError: a.indexOf is not a function error and stop rendering after reading the first entry of the feed. I have to comment out this particular block of code to get social feed running without a hitch but I would like to know why do I encounter this error and what does this block of code does.

[HartLarsson]

without show your plugin configuration is clear that is impossible to everyone to give you a solution. For sure your javascript plugin initialization parameters could be the cause.

[Bitneko]

My bad, this is the configuration I'm using

$('#displayUpdates').socialfeed({
    facebook: {
        accounts: ['@codesignio'],  
        limit: 2,                    
        access_token: 'my_access_token'
    },
    show_media: true
});

[HartLarsson]

well "@codesignio" is not a fb page but a twitter account. "@codesign.io" is the correct fb page. Please use YOUR OWN Facebook page NOT any fb profile.

You can test your twitter, fb page etc etc here: http://pavelk2.github.io/social-feed/

[Bitneko]

"codesignio" is a fb page. I can grab the feed without problem after commenting out the block of code that thrown the error.

Anyway, after couple hours of stackoverflow and googling, it turns out that the jQuery .load() method is deprecated from jQuery 1.8 onward and the recommend way to load an image is through the on() method to delegate the event handler.

So the following block

 $(img).load(function() {

                        if (img.width < options.media_min_width) {
                            image.hide();
                        }
                        // garbage collect img
                        delete img;

                    }).error(function() {
                        // image couldnt be loaded
                        image.hide();

                    }).attr({
                        src: imgSrc
                    });

should be updated to

$(img).on('load',function() {

                        if (img.width < options.media_min_width) {
                            image.hide();
                        }
                        // garbage collect img
                        delete img;

                    }).on('error', function() {
                        // image couldnt be loaded
                        image.hide();

                    }).attr({
                        src: imgSrc
                    });