Welcome guest, is this your first visit? Create Account now to join.
Results 1 to 6 of 6

This is a discussion on Get selected text from active tab to popup.html within the Plugins Development section, part of the Chrome Plugins category: Hi, I tried to write my first plugin but I have problem and I can't solve it. I wanna get ...


  1. #1
    Jawor is offline Junior Member
    Join Date
    Feb 2011
    Posts
    3

    Default Get selected text from active tab to popup.html

    Hi,

    I tried to write my first plugin but I have problem and I can't solve it.
    I wanna get selected text from active tab to default plugin file popup.html

    Could you give me some advice how to get access into document.getSelection (active tab) from popup.html ?

    PS: Sorry for my English

  2. #2
    devnull69 is offline Member
    Join Date
    Jul 2010
    Posts
    32

    Default

    Only content scripts can access tab/page content. So your popup.html needs to send/receive messages to/from a content script.

    1. Prepare the manifest to include a content script
    Code:
       "content_scripts": [ {
          "all_frames": true,
          "js": [ "content.js" ],
          "matches": [ "http://*/*", "https://*/*" ],
          "run_at": "document_end"
       } ],
    2. Create content.js and add a listener for messages coming from popup.html. This listener will then send the selection back with sendResponse
    Code:
    chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
        var data = window.getSelection().toString();
        sendResponse(data);
    });
    3. Send a message from popup.html and react on response
    Code:
    chrome.tabs.sendRequest(tab.id, 'getSelection', sendRequestCallbackHandler);
    
    function sendRequestCallbackHandler(response) {
       // response contains the selected text
    }

  3. #3
    Jawor is offline Junior Member
    Join Date
    Feb 2011
    Posts
    3

    Default

    devnull69 thank you for the answer.
    Now i understand it, but still i have one problem.
    How can i use "response.data" outside "sendRequestCallbackHandler" ?
    I've tried to save it in localstorage but it isn't visible in "sendRequestCallbackHandler" :/

  4. #4
    devnull69 is offline Member
    Join Date
    Jul 2010
    Posts
    32

    Default

    Ahem ... you can do anything you want with response (it's just "response" and not "response.data") inside sendRequestCallbackHandler. That's what callbacks are for. Either put it somewhere on the popup.html page, store it in some global variable or in localStorage (mind the upper case S!).

  5. #5
    Jawor is offline Junior Member
    Join Date
    Feb 2011
    Posts
    3

    Default

    Maybe I'll show the code to avoid misunderstand.

    My popup file:
    Code:
          var tid = 0;
          var text = "";
    
          chrome.tabs.getSelected(null, getSelectedCallbackHandler);
          
          function getSelectedCallbackHandler(tab) {
          
              tid = tab.id;
          }
          
          document.write(tid);
          
          chrome.tabs.sendRequest(tid, 'getSelection', sendRequestCallbackHandler);
    
          function sendRequestCallbackHandler(response) {
          
              text = response;
          }
    
          document.write(text);
    Let's focus on the first part i.e. getSelectedCallbackHandler().
    If I inside it write "document.write(tid)" I'll see a number of the tab.
    But if i try "document.write(tid)" after this function I'll see value "0".

    I'm sure that the reason of this problem is my very very low knowledge of javascript (uh... beginnings are hard ).

  6. #6
    devnull69 is offline Member
    Join Date
    Jul 2010
    Posts
    32

    Default

    First of all ... get rid off document.write. I know it is common in a lot of online tutorials and older books, but it's deprecated. You should really use DOM oriented methods or maybe innerHTML of an element to attach new elements to the existing DOM.

    Nevertheless, your problem is related to a general misunderstanding of asynchronous threads and callbacks in Javascript. If you start an asynchronous thread like sendRequest or getSelected, your normal program flow will continue without waiting for the asynchronous calls to end. That's why you don't get any results from their calls outside of the callbacks. Those callbacks are automatically being called right after the asynchronous call finished. So inside the callbacks you can react on the results of the original asynchronous calls. Any other action that depends on those results must either be done inside the callbacks or after the callbacks finished (maybe you can make visible an additional button from inside the callback. Clicking the button will then only be possible after the callback finished).

Similar Threads

  1. Access inner html of page of active tab
    By Gaurang033 in forum Plugins Development
    Replies: 15
    Last Post: 05-16-2011, 10:51 AM
  2. How to copy selected text to Bookmark title
    By Stronkie in forum Chrome Plugins
    Replies: 0
    Last Post: 11-06-2010, 05:48 PM
  3. How to know when popup.html loses focus ?
    By CoLoN3L in forum Chrome Plugins
    Replies: 3
    Last Post: 09-05-2010, 06:41 PM
  4. [New Ext] Context Search - Searching for selected text
    By andreyp123 in forum Chrome Plugins
    Replies: 5
    Last Post: 12-21-2009, 08:22 AM
  5. Access inner html of page of active tab
    By Gaurang033 in forum Chrome Plugins
    Replies: 12
    Last Post: 06-02-2009, 11:08 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •