Chrome Extension Creation - Get Element's Src Attribute And Open A New Tab

Question

manifest.json:

{
"manifest_version": 2,

"name": "Secure Video Downloader",
"description": "Download Videos Virus Free",
"version": "1.0",
"content_scripts": [
                     {
                         "matches": ["https://gostream.is/*", "http://gostream.is/*"],
                         "js": ["content.js", "jquery-3.2.1.min.js"],
                         "run_at": "document_end"
                     }
              ],
"browser_action": {
    "default_icon": "secure_16.png",
    "default_popup": "popup.html"
},
"permissions": [
    "tabs", "http://*/*"
]
}

content.js:

function showpanel() {     
    var video = document.getElementsByClassName("jw-video").src;
    console.log(video);
    window.open(video, '_blank');
}

setTimeout(showpanel, 10000);

Element:

<video class="jw-video jw-reset" disableremoteplayback="" webkit-playsinline="" playsinline="" jw-loaded="data" src="https://3.bp.blogspot.com/_SxCDsop4y3m5AuPGDOuDZ-y7MhCneqxOCGqVmWO9evlbvZ1yM4GuI9fBtYriE6ImR1LQiSrSUWcS6g9rv_jeJj5-f5HyJO0pod5elOGpwhxZIoix4cth9b6dNUWdMJMPETq1ds_8A=m37" jw-played=""></video>

Description:
When I load the page, which loads content.js and wait 10s for the setTimeout to finish a new tab opens with the url of about:blank. I also tested to see what the console shows as the element's src and it prints out undefined in console. If I right click on the link in the dev console and press Open In New Tab the element src opens up like it should. Also I tried changing the window.open(showpanel, 10000) to window.open('http://www.sethjfreeman.com', 10000) and it opened my web portfolio. So the problem must be with getting the element's src attribute.

Answer 1

This could be your issue:

 var video = document.getElementsByClassName("jw-video").src;

.getElementsByClassName() returns an HTMLCollection of elements which doesn't have a property src

Try this:

var video = document.getElementsByClassName("jw-video")[0].src;