I want to access current tab's HTML elements from chrome extension.
I have manifest.json like:
{
"manifest_version": 3,
"name": "Scrapper",
"description": "Scrapper extension.",
"version": "1.0.0",
"action": {
"default_popup": "index.html",
"default_title": "Scrapper",
"default_icon": "scrapper.png"
},
"permissions": ["tabs"]
}
index.html like this:
<!DOCTYPE html>
<html>
<head>
<title>Scrapper extension</title>
<meta charset="utf-8" />
</head>
<body>
<div class="container">
<div class="button_class">
<input class="fetch_button" type="submit" value="Fetch profile data" />
</div>
</div>
</body>
<script src="script.js"></script>
</html>
And script.js file like this:
async function fetchData() {
const tab = await chrome.tabs.query({active: true, lastFocusedWindow: true});
console.log(tab[0])
console.log(tab[0].title)
console.log(tab[0].url)
}
fetchData();
In the extension console I am getting output for tab[0], tab[0].title and tab[0].url like this:
Inside tab[0] there is no HTML as we can see here:
