title: self.port is undefined error [on mozilla add-on SDK 1.8]
body: <p>Following <a href="https://addons.mozilla.org/en-US/developers/docs/sdk/latest/dev-guide/guides/content-scripts/using-port.html" rel="nofollow">this</a> guide, I did a little variation and I keep receiving <strong>this error</strong>:</p>
  
  <blockquote>
    <p>self.port is undefined
    at base.js[my content code]</p>
  </blockquote>
  
  <p>here my <strong>add-on code</strong>:</p>
  
  <pre class="lang-js prettyprint-override"><code>PageMod({
      include: [data.url('base.html')],
      contentScriptWhen: 'start',
      contentScriptFile: [data.url('jquery-1.7.2.min.js'),data.url('jquery-ui-1.8.21.custom.min.js'),data.url('base.js')],
      contentStyleFile: [data.url('css/mint-choc/jquery-ui-1.8.21.custom.css'),data.url('css/base.css')],
      onAttach: function(worker) {
              worker.port.on("request", function(txt) {
                  console.log(txt);
                  worker.port.emit("response","response for "+txt);
              });
      }
  });
  </code></pre>
  
  <p>and my <strong>content code</strong>:</p>
  
  <pre class="lang-js prettyprint-override"><code>// initialized by jQuery
  $(function() {
      self.port.on("response",function(txt){console.log("response "+txt);}) //this line is where the error point to.
      $('#tabs').tabs();
      testLoadLinks();
  });
  
  function testReceiveRequest(request) {
      console.log('received:',request);
      self.port.emit("request",request);
  }
  </code></pre>
  
  <p>I'm using the browser editor with the SDK version 1.8, can someone please help me fix this?</p>