Кажется, об этом уже спрашивали, но я не могу заставить его работать.У меня вопрос
Я хочу создать всплывающее диалоговое окно, содержащее IFrame (или что-то подобное, если есть лучшая идея).Что произойдет, если пользователь щелкнет правой кнопкой мыши и вызовет «Сделать заявителя», я хочу взять страницу, на которой находится пользователь, и отправить ее в iframe, где iframe выполнит анализ, отобразит результаты и пользователь выберетотредактировать и \ или сохранить заявителя.
В этой ситуации я получаю следующую ошибку:
Ошибка в обработчике события для runtime.onMessage: DataCloneError: Не удалось выполнить 'postMessage' в 'Window': объект HTMLBodyElement не смогбыть клонированным.at chrome.runtime.onMessage.addListener.request (расширение chrome: //ljkbppmibpdchehdfdhijcoaenhnblhm/content.js: 16: 30)
Я не уверен, как этого добиться: передать innerHTML вiframe для анализа и отображения.
background.js
chrome.contextMenus.create({
contexts: ['all'],
id: 'applicantParser',
title: 'Make Applicant'
});
chrome.contextMenus.onClicked.addListener(() => {
chrome.tabs.query({active: true, currentWindow: true}, tabs => {
chrome.tabs.sendMessage(tabs[0].id, {type: 'requestParseApplicant'});
});
});
manifest.json
{
"name": "TW Extension",
"description" : "TW Extension",
"icons": {
"16": "icon-16.png"
},
"version": "1.0",
"manifest_version": 2,
"browser_action" :
{
"default_icon" : "icon-16.png",
"default_popup": "index.html"
},
"content_scripts": [{
"js": [ "content.js"],
"matches": [ "<all_urls>"],
"all_frames": true
}],
"background": {
"scripts": ["background.js"]
},
"permissions": ["contextMenus", "storage", "activeTab", "debugger"],
"web_accessible_resources" : ["index.html", "x.js"]
}
content.js
chrome.runtime.onMessage.addListener(request => {
console.log( request );
console.log(document.body.innerHTML);
if (request.type === 'requestParseApplicant') {
var bodyHtml = "<dialog style='height:70%; width:50%;'>";
bodyHtml += "<iframe id='parseApplicant' style='height:100%'></iframe>";
bodyHtml += "<div style='position:absolute; top:0px; left:5px;'><button>x</button></div>";
bodyHtml += "</dialog>";
document.body.innerHTML += bodyHtml;
const dialog = document.querySelector("dialog");
dialog.showModal();
const iframe = document.getElementById("parseApplicant");
//iframe.src = chrome.extension.getURL("index.html");
iframe.src = chrome.runtime.getURL("index.html");
iframe.contentWindow.postMessage({call:'sendValue', value: document.body});
iframe.frameBorder = 0;
dialog.querySelector("button").addEventListener("click", () => {
dialog.close();
});
}
});