30/09/2018, 23:12

Hỏi cách dùng DOM API khi dev chrome extension

Xin chào các bác ở forum ạ. Hiện tại em đang tự dev một cái extension nhỏ cho chrome, tuy nhiên gặp một số vấn đề. Extension tạo 1 context menu khi người dùng bôi đên 1 đoạn text. Khi người dùng click Keep … in box thì đoạn text sẽ được lưu vào localStorage và hiển thị nó trên tab popup của extension.

manifest.json
{
“name”: “Easy Vocab”,
“description”: “Easily learning new vocab”,
“version”: “0.6”,
“permissions”: [“contextMenus”,“tabs”,“storage”, “activeTab”],
“background”: {
“scripts”: [“background.js”]
},
“browser_action”: {
“default_popup”: “popup.html”
},
“manifest_version”: 2
}

background.js

//Context Menu
function genericOnClick(info, tab){
console.log(“User choose '” + info.selectionText + “’”);
chrome.storage.local.set({‘selectedText’: info.selectionText}, function(){
console.log(‘Text saved’);
})
}
chrome.contextMenus.create({“title”: “Keep ‘%s’ in your box”, “contexts”: [“selection”], “onclick”: genericOnClick});
//Inject content into popup tab
chrome.storage.onChanged.addListener(function(changes,namespace){
for (key in changes) {
if (key == ‘selectedText’) {
document.getElementById(‘content’).innerHTML = chrome.storage.local.get(‘selectedText’, function(){
console.log(‘Text Injected’);
})
}
}
});

Có file popup.html nhưng em ngại up :3
Tuy nhiên, trình debug báo lỗi Error in event handler for storage.onChanged: TypeError: Cannot set property ‘innerHTML’ of null…
Xin các bác chỉ giáo.

Bài liên quan
0