Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Chrome Extension - Get entire text content of the current tab

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.

like image 714
ananthv Avatar asked Dec 14 '11 04:12

ananthv


People also ask

How do I extract text from Chrome?

Step 1: Visit the OCR – Image Reader Extension page. Click on Add to Chrome. Step 2: Open the image from which you need to extract the text. Click on the extensions icon -> OCR – Image Reader.

Is there a way to do text search across all open tabs Chrome?

Using the keyboard shortcut Cmd + Shift + A (Mac) or Ctrl + Shift + A (Windows), you can pull up a sidebar of your recent Chrome tabs and search all of them at once.


2 Answers

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).

like image 20
user202729 Avatar answered Oct 09 '22 05:10

user202729


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.

like image 106
Derek 朕會功夫 Avatar answered Oct 09 '22 06:10

Derek 朕會功夫