Windows 10
Firefox 128.0
I’m trying to create a Firefox extension that handles custom file format (XPX) drop on Firefox.
The file is zlib compressed binary data. As per the extension guide here are the contents of
“xpx.zip”
- icon.png
- manifest.json
- pako.min.js
- content.js
- background.js
manifest.json
{
"manifest_version": 2,
"name": "XPX File Opener",
"version": "1.0",
"description": "Open xpx, a zlib compressed binary image file.",
"background": {
"scripts": ["background.js"]
},
"permissions": [
"tabs",
"activeTab",
"webNavigation"
],
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["content.js"]
}
],
"web_accessible_resources": [
"pako.min.js"
],
"browser_action": {
"default_icon": {
"48": "icon.png"
},
"default_title": "XPX File Opener"
}
}
content.js
// Prevent default drag behaviors
['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => {
document.addEventListener(eventName, preventDefaults, false)
});
function preventDefaults(e) {
e.preventDefault();
e.stopPropagation();
}
// Handle dropped files
document.addEventListener('drop', handleDrop, false);
function handleDrop(e) {
const dt = e.dataTransfer;
const files = dt.files;
if (files.length > 0) {
const file = files[0];
const fileExtension = file.name.split('.').pop().toLowerCase();
if (fileExtension === 'xpx') {
console.log(fileExtension);
handleCustomFile(file);
}
}
}
function handleCustomFile(file) {
const reader = new FileReader();
reader.onload = async (event) => {
const compressedData = new Uint8Array(event.target.result);
const decompressedData = await decompressZlib(compressedData);
const htmlContent = new TextDecoder().decode(decompressedData);
const newTab = window.open('', '_blank');
newTab.document.write(htmlContent);
newTab.document.close();
};
reader.readAsArrayBuffer(file);
}
function decompressZlib(compressedData) {
return new Promise((resolve, reject) => {
const script = document.createElement('script');
script.src = browser.runtime.getURL('pako.min.js');
script.onload = () => {
const decompressed = pako.inflate(compressedData);
resolve(decompressed);
};
script.onerror = reject;
document.head.appendChild(script);
});
}
background.js
browser.browserAction.onClicked.addListener((tab) => {
browser.tabs.executeScript(tab.id, {
file: 'content.js'
});
});
Once the extension (xpx.zip) is loaded and a .xpx file is dropped on an empty tab, instead of opening the file it shows file “Open” & “Save As” dialog.
Because the extension is not working right now, I have no idea about the way I have handled “pako.min.js”. Plesae suggest me if I handled it incorrectly.
Cheers.