How to get the document object of a website?

Question

I have spent the last hour looking for a solution to this but couldn't figure it out. I am working on a chrome extension project and trying to use the mozilla/readability library which requires a document object as a parameter, but no matter what I try I get:

Error: First argument to Readability constructor should be a document object.

I have tried so many different things I have no idea:

window.document.documentElement.innerHTML (and outerHTML and just documentElement)
document.documentElement (and .innerHTML, outerHTML)
document

EDIT This is how I get my document from the content script (since I am working with Chrome extensions)

Pupup.js

const bgPage = chrome.extension.getBackgroundPage();
const dom = bgPage.dom;
console.log(dom);
let curArticle = new Readability(dom).parse();
console.log(curArticle);
setArticle(curArticle);

background.js

chrome.runtime.onMessage.addListener(receiver);

function receiver(request, sender, sendResponse) {
console.log(request);
dom = request.dom;
}

content.js

const message = {
type: "content",
dom: document,
};
chrome.runtime.sendMessage(message);

@CertainPerformance I'm using chrome extensions so I had to fetch the document from content script (where I did return document but I still get the same error) — Ken, Jan 17 '21 at 03:16
try const dom = bgPage.document instead of const dom = bgPage.dom; — sonali, Jan 17 '21 at 03:28
There is a similar question answered on StackOverflow https://stackoverflow.com/questions/4532236/how-to-access-the-webpage-dom-rather-than-the-extension-page-dom — sonali, Jan 17 '21 at 03:34
@sonali thanks that link was useful, does the person mean you cannot send DOM from content script to my popup? — Ken, Jan 17 '21 at 03:37

How to get the document object of a website?

0 Answers0