Disqus 2012 "Uncaught TypeError: Cannot call method 'getPropertyValue' of null" on Safari and Chrome

Question

Here at my company we are working hard to deliver a nice comment experience using the amazing Disqus widget.

Our site is totally AJAX based, using requirejs, jquery and backbone for the most.

We've already added the Disqus widget on the pages where we need it. During a page change we of course destroy the div where Disqus widget lives and we instantiate again all the stuff.

Everything is fine with the old widget, on every browser. The problem occurs activating the Disqus 2012's widget, that do not appear with the error "Uncaught TypeError: Cannot call method 'postMessage' of null", on Safari and Chrome. Firefox works great.

Here is the code involved:

define([
  'underscore',
  'backbone',
  'models/config',
  'models/book'
], function(_, Backbone, config) {

    App.Models.Disqus = Backbone.Model.extend({
        bookObj: null,

        initialize: function(options){
            console.log("discus.initialize()");
            var _this=this;

            _this.bookObj= new App.Models.Book({id: options.id});
            _this.bookObj.fetch({
                dataType: 'jsonp',
                success: function(model,response){
                    (typeof DISQUS == 'undefined')?_this.initDisqus():_this.resetDisqus();              }
            });

        },

        initDisqus: function(){
            console.log("discus.init()");
            disqus_shortname=config.get('DISQUS_ID');
            disqus_title = this.bookObj.get('content').title; 
            disqus_config = function (){
                // this.page.identifier = _this.id;
                // this.page.url = document.URL;
                this.language = config.get('LANG');
            };
            require(['http://'+disqus_shortname+'.disqus.com/embed.js'], function(){});
        },

        resetDisqus: function(){
            console.log("discus.reset()");
            var _this=this;
            DISQUS.reset({
                reload: true,
                config: function(){
                    this.page.identifier = _this.id;
                    this.page.url = document.URL;
                    this.page.title = _this.bookObj.get('content').title;
                    this.language = config.get('LANG');
                }
            });
        }

    });

    return App.Models.Disqus;
});

If you need more information feel free to ask.

Thanks in advance, Giorgio

OK guys, solved in this way:

define([
  'underscore',
  'backbone',
  'models/config',
  'models/book'
], function(_, Backbone, config) {

    App.Models.Disqus = Backbone.Model.extend({
        bookObj: null,

        initialize: function(options){
            console.log("discus.initialize()");
            var _this=this;
            _this.bookObj= new App.Models.Book({id: options.id});
            _this.bookObj.fetch({
                dataType: 'jsonp',
                success: function(model,response){
                    //(typeof DISQUS == 'undefined')?_this.initDisqus():_this.resetDisqus();

                    delete DISQUS;

                    disqus_shortname = config.get('DISQUS_ID');
                    disqus_identifier = _this.id;
                    disqus_url = document.URL;         
                    disqus_title = _this.bookObj.get('content').title;

                    (function() {
                        var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
                        dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
                        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
                    })();

                }
            });
        },
    });

    return App.Models.Disqus;
});

Answer 1

As the DISQUS.reset documentation states, you need to reset the identifier and URL for the Disqus thread. This is done via two variables provided in the documentation: this.page.identifier and this.page.url. Right now you're resetting the page title and language in Disqus. Try resetting the identifier and URL instead.