I am trying to debug an app which I don't own which uses HTML5 and JS, which displays a video stream. The issue is that the video stutters when viewed in high resolution.
Note that the code is obfuscated, but has been prettyfied which helps a little. So far using Chrome developer tools and by injecting listeners I have determined that the video is being displayed in a <canvas>
element. From my research, I have determined that displaying video content in <canvas>
requires the use of <video>
, where the data taken from the video element is manipulated and written on to the <canvas>
.
My problem is that I want to get a reference to the <video>
element, which apparently is not a part of the DOM. The use of Chrome developer tools reveals no such element, nor does getElementsByTagName()
. I find clues in the code which indicate a <video>
element most likely exists, so my conclusion is that it is just used in memory as a tool and is not added to the DOM.
Does anyone have any suggestions as to how I can get a reference to this element?