Accessing fully developed dom through plugin in Firefox

I need to see the fully loaded and devloped dom of a page, i.e after my client loads up my page I want them to be able to click a button on fire fox and then fire fox will send me the fully developed dom so I can look t开发者_StackOverflow中文版hrough and see what happened there. Can anyone help point me to the right direction?

First you need a function to know whether DOM is ready. A functionality provided by many Javascript frameworks, but refer this if you need a pure js implementation.
When the DOM is ready the button is enabled for the user to click.
Then you may have a function to serialize the DOM tree to a string. As Load and Save DOM is not yet implemented in Mozilla, read this MDN article to get to know what you want.
Now you can send the Saved DOM to your Web Service.

//Code grabbed mostly from MDN article linked
var req = new XMLHttpRequest();
req.open("GET", "chrome://passwdmaker/content/people.xml", false); 
req.send(null);
var dom = req.responseXML;

var serializer = new XMLSerializer();
var foStream = Components.classes["@mozilla.org/network/file-output-stream;1"]
              .createInstance(Components.interfaces.nsIFileOutputStream);   
var file = Components.classes["@mozilla.org/file/directory_service;1"]
         .getService(Components.interfaces.nsIProperties)
         .get("ProfD", Components.interfaces.nsILocalFile);//get profile folder  
file.append("extensions");   // extensions sub-directory
file.append("{5872365E-67D1-4AFD-9480-FD293BEBD20D}");//GUID of your extension
file.append("myXMLFile.xml");   // filename
foStream.init(file, 0x02 | 0x08 | 0x20, 0664, 0);//write, create, truncate
serializer.serializeToStream(dom, foStream, "");//remember, dom is the DOM tree
foStream.close();

Hope this would help!