925436 - Clarify documentation on tab.attach

Status: RESOLVED FIXED

(Add-on SDK Graveyard :: General, defect, P2)

Description

[johannes]

User Agent: Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:23.0) Gecko/20100101 Firefox/23.0 (Beta/Release)
Build ID: 20130803193142

Steps to reproduce:

// data/issue.js

$(document).ready(function() {
  function createModal() {
    var passphrase = $(
        '<div class="modal fade" id="md-request-pgppass"> '+
         '<div class="modal-dialog">'+
          '<div class="modal-content">'+
           '<div class="modal-body">'+
            '<h5>For Key: <span class="label label-default"></span></h5>'+
            '<div class="form-group">'+
             '<label class="control-label" for="md-request-pgppass-passphrase">Passphrase</label>'+
             '<input type="password" class="form-control" id="md-request-pgppass-passphrase" placeholder="Enter passphrase">'+
            '</div>'+
           '</div>'+
          '</div><!-- /.modal-content -->'+
         '</div><!-- /.modal-dialog -->'+
        '</div>');

    return passphrase;
  }

  var passphrase = createModal();
  $('body').append(passphrase);
}); // data/issue.js



// main.js
'use strict';

const data      = require('sdk/self').data;

exports.main = function() {
    require('sdk/tabs').open({
        url:  'about:blank',
        onReady: function(tab) {
            var worker = tab.attach({
                contentScriptFile:  [data.url('vendor/jquery.min.js'),
                                     data.url('vendor/bootstrap.min.js'),
                                     data.url('issue.js'),
                                     ],
            }); // worker
        }, // onReady
    }); // tabs.open
} // main.js


Navigated to a new URL in the same, opened tab.




Actual results:

The content of above modal dialog was displayed at the bottom of the new URL.
Some addon bootstrap code was still visible in the resources of the new URL.


Expected results:

I expected the injected code to go out of context when entering a new URL.

I also tried:
      worker.on('detach', function() {
        worker.destroy();
      });
but without any effect.

Is there a way to unload injected code, or to inject code only for one URL?

Comment 1

[Jordan Santell [:jsantell] [@jsantell]]

Issue confirmed! Looking into it.

Comment 2

[Jordan Santell [:jsantell] [@jsantell]]

Johannes,
Looking into it more, this is the intended behaviour of tab.attach -- It attaches a worker to every document loaded within that tab, as it is tab-centric. On every page, the scripts get rerun, putting the content fresh on the page (if you change the DOM when you first load a new tab, you can see it gets reinjected cleanly on a new URL).

Depending on your use case, a pagemod may make more sense, as also, this will attach the tab worker to every new tab. So something like a PageMod, or check for tab load for about:home URL for example, and attach if necessary, and detach when done.

That being said, I'll update the documentation as its not clear on how this works. Does that clear up the issue?

Comment 3

[Jordan Santell [:jsantell] [@jsantell]]

Attachment: GH PR 1264

Comment 4

[johannes]

Jordan,

yes, thank you for your response.
I feel a bit silly for reporting this as an issue, when it was more my misconception.
Yes, I understand that this would be the expected behavior.

I do support your suggestion for expanding the documentation on this, as I have so far been unable to attach to local URL only for one use. For having a config page, I am currently injecting code into an addon URL and this does not seem to work with page-mod. I have also had issues communicating non-injected local scripts.

Therefore, I have a bit of a conundrum:
- Page-Mod does not seem to work for local files (non-HTTP). 
- tab.attach works, but I have not found a way (particularly not a nice way) to inject scripts for a local URL and then detach those scripts when the tab is loaded with a different URL.
- with tab.attach I don't seem to get a 'detach' event, as that is page-mod behavior. Do I therefore have to manually track all tab changes, filter for the attached tab and then destroy the worker myself?

Thank you.

Johannes

Comment 5

[Will Bamberg [:wbamberg]]

You shouldn't feel silly, the behaviour wasn't obvious to me either, and making it clear in the docs is totally worth doing.

I don't know if you follow the Jetpack mailing list/Google group (https://groups.google.com/forum/#!forum/mozilla-labs-jetpack), but as a result of this bug Jordan suggested an attachOnce variant of tab.attach (https://groups.google.com/forum/#!topic/mozilla-labs-jetpack/oOqWjiz2RGg), which I think would be useful.

> Page-Mod does not seem to work for local files (non-HTTP). 

page-mod should work for local files, but some of the wild card variants of match-pattern require HTTP. See https://addons.mozilla.org/en-US/developers/docs/sdk/latest/modules/sdk/page-mod/match-pattern.html for some gory details. Something like this should work fine:


var url = require("self").data.url("my-file.html")

require("sdk/page-mod").PageMod({
  include: url,
  contentScript: 'alert("hi!")'
});

require("sdk/tabs").open(url);

Comment 6

[[github robot]]

Commits pushed to master at https://github.com/mozilla/addon-sdk

https://github.com/mozilla/addon-sdk/commit/fa3bb1240be6b1df6b6dae0a368262da5cbb9298
Bug 925436 Clarify tab.attach in docs that worker is on every document in that tab

https://github.com/mozilla/addon-sdk/commit/76c3e752be668fa9f7f5b8a11b99ba018fdb3888
Merge pull request #1264 from jsantell/925436-tab-attach-doc

Bug 925436 Clarify tab.attach in docs that worker is on every doc in that tab - r=@wbamberg

Comment 7

[Jordan Santell [:jsantell] [@jsantell]]

Merged