Chrome Extension - Get entire text content of the current tab - html

Question

I'm developing an extension where I need to get the entire text content on the current tab. Now I've a plugin which retrieves selected text from the current tab. So, in essence I'm looking for the ctrl-A version of it :). This is what I've done so far taking the hint from #Derek.
This is in my event handler(this is just one, there are other listeners too for onUpdated etc):
chrome.tabs.onSelectionChanged.addListener(function(tabId,changeInfo,tab) {
chrome.tabs.getSelected(null,function(tab) {
chrome.tabs.sendRequest(tab.id, {method: "getSelection"}, function (response) {
selectedtext = response.data;
});
chrome.tabs.sendRequest(tab.id, {method: "getText"}, function (response) {
alltext = response.data;
});
});
});
This is what I've written in the content script:
chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
if (request.method == "getSelection")
sendResponse({data: window.getSelection().toString()});
else if (request.method == "getText")
sendResponse({data: document.body.innerText});
else
sendResponse({});
});
However the document.body.innerText is returning undefined. I need the entire text of the current tab in alltext. Can someone help me out on this?
Thanks.

Answer 1

You can use document.body.innerText or document.all[0].innerText to do it in the content script.
It will get all the text content in the page, without any HTML code.
Or you can use document.all[0].outerHTML to get the HTML of the whole page.
Example
In the Content Script
function getText(){
return document.body.innerText
}
function getHTML(){
return document.body.outerHTML
}
console.log(getText()); //Gives you all the text on the page
console.log(getHTML()); //Gives you the whole HTML of the page
Added
So you want the content script to return the text to the popup. You can use:
chrome.tabs.getSelected to get the tab selected,
chrome.tabs.sendRequest to send request to the content script,
and chrome.extension.onRequest.addListener to listen to requests.
Popup page
chrome.tabs.getSelected(null, function(tab) {
chrome.tabs.sendRequest(tab.id, {method: "getText"}, function(response) {
if(response.method=="getText"){
alltext = response.data;
}
});
});
Content Script
chrome.extension.onRequest.addListener(
function(request, sender, sendResponse) {
if(request.method == "getText"){
sendResponse({data: document.all[0].innerText, method: "getText"}); //same as innerText
}
}
);
This should work.

Answer 2

Use executeScript: (requires permission activeTab)
chrome.tabs.executeScript(null, {
code: `document.all[0].innerText`,
allFrames: false, // this is the default
runAt: 'document_start', // default is document_idle. See https://stackoverflow.com/q/42509273 for more details.
}, function(results) {
// results.length must be 1
var result = results[0];
process_result(result);
});
In case the code is complex, it's possible to define a function in the content script and call that function in the code (or use file).