THE SITUATION:
In my Vue app I need to show ads using the Google IMA sdk.
However it seems that the AdDisplayContainer it's stuck in an endless update loop.
JSFIDDLE:
I have recreated the issue on JsFiddle with a bare minimum example. You can check the error in the console.
https://jsfiddle.net/fraMussi/53f6vbjh/7/
As you can see there isn't much going on:
- I import the google IMA sdk
- I have basic markup for the video and ad container
- I setup the
adDisplayContainer - I have added a watcher to detect the issue
THE CODE:
this.adDisplayContainer = new google.ima.AdDisplayContainer(
this.$refs.adContainer, this.videoContent);
THE ERROR:
It seems that it adDisplayContainer gets updated in a loop:
Error in nextTick: "RangeError: Maximum call stack size exceeded" <br>
RangeError: Maximum call stack size exceeded
In a production-like environment I get a similar error message:
InternalError: too much recursion
THE QUESTION:
Do you know why is this happening and how to fix it?
