Uncaught TypeError: Cannot read property 'vdata1410859035575' of null

[pperliti]

I'm trying to use videojs-vast-plugin (https://github.com/theonion/videojs-vast-plugin) to play a preroll video (mp4 over HTML5) before the actual content (rtmp over Flash).

VideoJS version is 4.8 (hosted locally). Tech order is ["html5","flash"].

The original video is a rtmp stream so the videojs Flash version is instanced during setup.
Then videojs-vast-plugin downloads a VAST file that tells the plugin to start a simple video download (linear mode), so the plugin updates player's sources accordingly (the initial Flash player is then disposed), the player switches to HTML5 mode and then mp4 adv video is played.
At then end of the preroll the videojs-vast-plugin restores an initial snapshot of the player (the HTML5 player is then disposed, as well as a new Flash player instance is finally created) and tries to play the (original) rtmp stream.

<video id="video-1" class="video-js vjs-default-skin vjs-big-play-centered">
  <source src="rtmp://myserver/video.mp4" type="rtmp/mp4"/>   
</video>

<script>
  var v1 = videojs("video-1",
                    { // options
                      controls: true,
                      preload: "none",
                      width: "640",
                      height: "360",
                      techOrder: ["html5","flash"],
                      plugins: {
                        ads: {
                          debug: true
                        },
                        vast: {
                          url: "http://vast-server/ad/sid=49&bt=n&fmt=fmt_testvideo_smtv"
                        }
                      }
                    },
                    function() {
                      console.log("The video " + this + " is ready");
                    });
</script>

The problem lies at the end of the preroll. When the HTML5 player is disposed (after the adv video successfully finished playing) and a new Flash player instance is created, it seems that some event handler is still alive for the very first Flash player instance created during the initial setup (and then an error is thrown):

Uncaught TypeError: Cannot read property 'vdata1410859035575' of null.

The error is throwed by the vjs.getData() function (see [1] in the following code) since is el[vjs.expando](vjs.expando value is) is null:

vjs.getData = function(el){
  var id = el[vjs.expando];  // <-- /* [1] */
  ...
};

Debugging the scripts I ended to face a strange behaviour. When the videojs-vast-plugin tries to restore the initial Flash Player (see [2] in the following code)

video-vast.js (videojs-vast-plugin)

player.vast.tearDown = function() {
  ...
  player.off('timeupdate', player.vast.timeupdate);
  player.off('ended', player.vast.tearDown);
  player.ads.endLinearAdMode();
  if (player.vast.showControls ) {
    player.controls(true); // <-- /* [2] */
  }
};

then VideoJS breaks at tech.addControlsListeners() (see [3] in the following code) since tech.el_ is null. The oddity here is that that player refers to the very first Flash Player version (already disposed) so el_ is obviously null.

video.dev.js (videojs)

vjs.MediaTechController.prototype.initControlsListeners = function(){
  var player, tech, activateControls, deactivateControls;

  tech = this;
  player = this.player();

  var activateControls = function(){
    if (player.controls() && !player.usingNativeControls()) {
      tech.addControlsListeners(); // <-- /* [3] */
    }
  };
  ...
};

After searching through the code I suspect this is not a videojs-vast-plugin issue: it seems that videojs does not clear all the stuff related to the player/tech when disposing the player.
Btw, changing the tech order from ["html5","flash"] to ["flash","html5"] does not generate the error (probably because in that case there is no need to switch from HTML5 player to Flash player and viceversa).

Anyway, you can reproduce the problem here: http://bit.ly/1Deb1S2 (if you have some AD blockers installed on your browser you may want to temporarily disable them).

[mmcc]

So sorry for the delay in getting back to this one. I think the issue I just referenced (#1541) should take care of any errors like this.

[onecib]

I am using the videojs-vast-vpaid plugin and after playing an Ad on videojs i am calling the dispose() function on the player like this :
player.on('vast.adEnd', function () { player.dispose(); });
Everything is working but after the Ad is done i a getting this Error on the console :

• "TypeError:el is null" on firefox
• "Uncaught TypeError: Cannot read property 'vdata1456151276351' of null" on chrome.

So I tried to make to set a minimum Timeout like mensionned . It is working without errors but the timeout that i Set worked for firefox and not for Chrome .

Is there any explanation for this ? Is there any common result woring for both(or for all) Browsers?
Thanks.

[skulden13]

Hi guys,

I use Brightcove player, that based on VideoJS and get the same error:
"ERROR: TypeError: Cannot read property 'vdata1524058428887' of null"
(the value after "vdata" is changeable)

Browser: Chrome 65
VideoJS version: 6.7.4
Brightcove script version: 6.17.5
Brightcove plugin: ima3 2.22.3

Error traceback:

    at hasData (index.js:1771)
    at off (index.js:2121)
    at t.off$$1 [as off] (index.js:3032)
    at t.off$$1 [as off] (index.js:3049)
    at t.wrapper (index.js:2997)
    at t.func (index.js:2261)
    at t.data.dispatcher (index.js:2082)
    at trigger (index.js:2214)
    at t.EventTarget.trigger (index.js:2699)
    at handleHlsMediaChange (index.js:50670)```

Looks like it happens here:
`handleHlsMediaChange(qualityLevels, hls.playlists);`

My init code is:
```player = window.bc(`video${videoProps.videoID}`);

    if (typeof player.ima3 === 'function') {
      player.ima3({
        adTechOrder: [
          'html5',
        ],
        requestMode: 'onload',
        serverUrl: videoProps.adServerUrl,
        timeout: 4000,
        vpaidMode: 'ENABLED',
      });
    }

    player.ready(function () {
    ...
    });

Here is my Brightcove script:
http://players.brightcove.net/104403126001/rJ7Yd3vGf_default/index.js

I've debugged a bit this Brightcove index.js. Looks like the issue related to the Quality Control.
Any suggestions?

Thanks, Denis

[ankit18singh]

Hi guys,

I use Brightcove player, that based on VideoJS and get the same error:
"ERROR: TypeError: Cannot read property 'vdata1524058428887' of null"
(the value after "vdata" is changeable)

Browser: Chrome 65
VideoJS version: 6.7.4
Brightcove script version: 6.17.5
Brightcove plugin: ima3 2.22.3

Error traceback:

    at hasData (index.js:1771)
    at off (index.js:2121)
    at t.off$$1 [as off] (index.js:3032)
    at t.off$$1 [as off] (index.js:3049)
    at t.wrapper (index.js:2997)
    at t.func (index.js:2261)
    at t.data.dispatcher (index.js:2082)
    at trigger (index.js:2214)
    at t.EventTarget.trigger (index.js:2699)
    at handleHlsMediaChange (index.js:50670)```

Looks like it happens here:
`handleHlsMediaChange(qualityLevels, hls.playlists);`

My init code is:
```player = window.bc(`video${videoProps.videoID}`);

    if (typeof player.ima3 === 'function') {
      player.ima3({
        adTechOrder: [
          'html5',
        ],
        requestMode: 'onload',
        serverUrl: videoProps.adServerUrl,
        timeout: 4000,
        vpaidMode: 'ENABLED',
      });
    }

    player.ready(function () {
    ...
    });

Here is my Brightcove script:
http://players.brightcove.net/104403126001/rJ7Yd3vGf_default/index.js

I've debugged a bit this Brightcove index.js. Looks like the issue related to the Quality Control.
Any suggestions?

Thanks, Denis

Hi, I am facing a similar issue with Brightcove player. Did you find any solution?

[skulden13]

Hi @ankit18singh,

Actually no.
I've just filtered errors from Brightcove in my Error Tracker. Maybe other people have better suggestions.

Thanks,
Denis

[gkatsev]

We have some info about it on our troubleshooting doc: https://docs.videojs.com/tutorial-troubleshooting.html#vdata123456-errors

[ankit18singh]

HI @gkatsev , thanks for the doc. It is still not working.