implement `open saved pages in a new tab`

for self-extracting pages (fix #1255)

src/core/bg/autosave.js

@@ -202,17 +202,17 @@ async function saveContent(message, tab) {
 						}
 						pageData.url = URL.createObjectURL(content);
 						await downloads.downloadPage(pageData, options);
-						if (options.openSavedPage && !options.compressContent) {
-							const createTabProperties = { active: true, url: URL.createObjectURL(content), windowId: tab.windowId };
-							const index = tab.index;
-							try {
-								await browser.tabs.get(tabId);
-								createTabProperties.index = index + 1;
-							} catch (error) {
-								createTabProperties.index = index;
-							}
-							browser.tabs.create(createTabProperties);
+					}
+					if (options.openSavedPage) {
+						const createTabProperties = { active: true, url: "/src/ui/pages/viewer.html?compressed=true&blobURI=" + URL.createObjectURL(content), windowId: tab.windowId };
+						const index = tab.index;
+						try {
+							await browser.tabs.get(tabId);
+							createTabProperties.index = index + 1;
+						} catch (error) {
+							createTabProperties.index = index;
 						}
+						browser.tabs.create(createTabProperties);
 					}
 					if (pageData.hash) {
 						await woleet.anchor(pageData.hash, options.woleetKey);

src/core/bg/config.js

@@ -38,7 +38,6 @@ const BADGE_COLOR_SUPPORTED = IS_NOT_SAFARI;
 const AUTO_SAVE_SUPPORTED = IS_NOT_SAFARI;
 const SELECTABLE_TABS_SUPPORTED = IS_NOT_SAFARI;
 const AUTO_OPEN_EDITOR_SUPPORTED = IS_NOT_SAFARI;
-const OPEN_SAVED_PAGE_SUPPORTED = IS_NOT_SAFARI;
 const INFOBAR_SUPPORTED = IS_NOT_SAFARI;
 const BOOKMARKS_API_SUPPORTED = IS_NOT_SAFARI;
 const IDENTITY_API_SUPPORTED = IS_NOT_SAFARI;
@@ -176,7 +175,6 @@ export {
 	BADGE_COLOR_SUPPORTED,
 	AUTO_SAVE_SUPPORTED,
 	SELECTABLE_TABS_SUPPORTED,
-	OPEN_SAVED_PAGE_SUPPORTED,
 	AUTO_OPEN_EDITOR_SUPPORTED,
 	INFOBAR_SUPPORTED,
 	BOOKMARKS_API_SUPPORTED,
@@ -307,7 +305,6 @@ async function onMessage(message) {
 			BADGE_COLOR_SUPPORTED,
 			AUTO_SAVE_SUPPORTED,
 			SELECTABLE_TABS_SUPPORTED,
-			OPEN_SAVED_PAGE_SUPPORTED,
 			AUTO_OPEN_EDITOR_SUPPORTED,
 			INFOBAR_SUPPORTED,
 			BOOKMARKS_API_SUPPORTED,

src/core/bg/downloads.js

@@ -146,170 +146,171 @@ async function downloadTabPage(message, tab) {
 
 async function downloadContent(contents, tab, incognito, message) {
 	const tabId = tab.id;
-	let skipped;
-	if (message.backgroundSave && !message.saveToGDrive && !message.saveWithWebDAV && !message.saveToGitHub) {
-		const testSkip = await testSkipSave(message.filename, message);
-		message.filenameConflictAction = testSkip.filenameConflictAction;
-		skipped = testSkip.skipped;
-	}
-	if (skipped) {
-		ui.onEnd(tabId);
-	} else {
-		if (message.openEditor) {
-			ui.onEdit(tabId);
-			await editor.open({ tabIndex: tab.index + 1, filename: message.filename, content: contents.join("") });
+	try {
+		let skipped;
+		if (message.backgroundSave && !message.saveToGDrive && !message.saveWithWebDAV && !message.saveToGitHub) {
+			const testSkip = await testSkipSave(message.filename, message);
+			message.filenameConflictAction = testSkip.filenameConflictAction;
+			skipped = testSkip.skipped;
+		}
+		if (skipped) {
+			ui.onEnd(tabId);
 		} else {
-			if (message.saveToClipboard) {
+			const prompt = filename => promptFilename(tabId, filename);
+			let response;
+			if (message.openEditor) {
+				ui.onEdit(tabId);
+				await editor.open({ tabIndex: tab.index + 1, filename: message.filename, content: contents.join("") });
+			} else if (message.saveToClipboard) {
 				message.content = contents.join("");
 				saveToClipboard(message);
-				ui.onEnd(tabId);
+			} else if (message.saveWithWebDAV) {
+				response = await saveWithWebDAV(message.taskId, encodeSharpCharacter(message.filename), contents.join(""), message.webDAVURL, message.webDAVUser, message.webDAVPassword, { filenameConflictAction: message.filenameConflictAction, prompt });
+			} else if (message.saveToGDrive) {
+				await saveToGDrive(message.taskId, encodeSharpCharacter(message.filename), new Blob(contents, { type: MIMETYPE_HTML }), {
+					forceWebAuthFlow: message.forceWebAuthFlow
+				}, {
+					onProgress: (offset, size) => ui.onUploadProgress(tabId, offset, size),
+					filenameConflictAction: message.filenameConflictAction,
+					prompt
+				});
+			} else if (message.saveToGitHub) {
+				response = await saveToGitHub(message.taskId, encodeSharpCharacter(message.filename), contents.join(""), message.githubToken, message.githubUser, message.githubRepository, message.githubBranch, {
+					filenameConflictAction: message.filenameConflictAction,
+					prompt
+				});
+				await response.pushPromise;
+			} else if (message.saveWithCompanion) {
+				await companion.save({
+					filename: message.filename,
+					content: message.content,
+					filenameConflictAction: message.filenameConflictAction
+				});
 			} else {
-				try {
-					const prompt = filename => promptFilename(tabId, filename);
-					let response;
-					if (message.saveWithWebDAV) {
-						response = await saveWithWebDAV(message.taskId, encodeSharpCharacter(message.filename), contents.join(""), message.webDAVURL, message.webDAVUser, message.webDAVPassword, { filenameConflictAction: message.filenameConflictAction, prompt });
-					} else if (message.saveToGDrive) {
-						await saveToGDrive(message.taskId, encodeSharpCharacter(message.filename), new Blob(contents, { type: MIMETYPE_HTML }), {
-							forceWebAuthFlow: message.forceWebAuthFlow
-						}, {
-							onProgress: (offset, size) => ui.onUploadProgress(tabId, offset, size),
-							filenameConflictAction: message.filenameConflictAction,
-							prompt
-						});
-					} else if (message.saveToGitHub) {
-						response = await saveToGitHub(message.taskId, encodeSharpCharacter(message.filename), contents.join(""), message.githubToken, message.githubUser, message.githubRepository, message.githubBranch, {
-							filenameConflictAction: message.filenameConflictAction,
-							prompt
-						});
-						await response.pushPromise;
-					} else if (message.saveWithCompanion) {
-						await companion.save({
-							filename: message.filename,
-							content: message.content,
-							filenameConflictAction: message.filenameConflictAction
-						});
-					} else {
-						message.url = URL.createObjectURL(new Blob(contents, { type: MIMETYPE_HTML }));
-						response = await downloadPage(message, {
-							confirmFilename: message.confirmFilename,
-							incognito,
-							filenameConflictAction: message.filenameConflictAction,
-							filenameReplacementCharacter: message.filenameReplacementCharacter,
-							includeInfobar: message.includeInfobar
-						});
-					}
-					if (message.replaceBookmarkURL && response && response.url) {
-						await bookmarks.update(message.bookmarkId, { url: response.url });
-					}
-					ui.onEnd(tabId);
-					if (message.openSavedPage) {
-						const createTabProperties = { active: true, url: URL.createObjectURL(new Blob(contents, { type: MIMETYPE_HTML })) };
-						if (tab.index != null) {
-							createTabProperties.index = tab.index + 1;
-						}
-						browser.tabs.create(createTabProperties);
-					}
-				} catch (error) {
-					if (!error.message || error.message != "upload_cancelled") {
-						console.error(error); // eslint-disable-line no-console
-						ui.onError(tabId, error.message, error.link);
-					}
-				} finally {
-					if (message.url) {
-						URL.revokeObjectURL(message.url);
-					}
+				message.url = URL.createObjectURL(new Blob(contents, { type: MIMETYPE_HTML }));
+				response = await downloadPage(message, {
+					confirmFilename: message.confirmFilename,
+					incognito,
+					filenameConflictAction: message.filenameConflictAction,
+					filenameReplacementCharacter: message.filenameReplacementCharacter,
+					includeInfobar: message.includeInfobar
+				});
+			}
+			if (message.replaceBookmarkURL && response && response.url) {
+				await bookmarks.update(message.bookmarkId, { url: response.url });
+			}
+			ui.onEnd(tabId);
+			if (message.openSavedPage) {
+				const createTabProperties = { active: true, url: "/src/ui/pages/viewer.html?blobURI=" + URL.createObjectURL(new Blob(contents, { type: MIMETYPE_HTML })), windowId: tab.windowId };
+				if (tab.index != null) {
+					createTabProperties.index = tab.index + 1;
 				}
+				browser.tabs.create(createTabProperties);
 			}
 		}
+	} catch (error) {
+		if (!error.message || error.message != "upload_cancelled") {
+			console.error(error); // eslint-disable-line no-console
+			ui.onError(tabId, error.message, error.link);
+		}
+	} finally {
+		if (message.url) {
+			URL.revokeObjectURL(message.url);
+		}
 	}
 }
 
 async function downloadCompressedContent(message, tab) {
 	const tabId = tab.id;
-	let skipped;
-	if (message.backgroundSave && !message.saveToGDrive && !message.saveWithWebDAV && !message.saveToGitHub) {
-		const testSkip = await testSkipSave(message.filename, message);
-		message.filenameConflictAction = testSkip.filenameConflictAction;
-		skipped = testSkip.skipped;
-	}
-	if (skipped) {
-		ui.onEnd(tabId);
-	} else {
-		const pageData = message.pageData;
-		const blob = await singlefile.processors.compression.process(pageData, {
-			insertTextBody: message.insertTextBody,
-			url: pageData.url || tab.url,
-			createRootDirectory: message.createRootDirectory,
-			tabId,
-			selfExtractingArchive: message.selfExtractingArchive,
-			extractDataFromPage: message.extractDataFromPage,
-			insertCanonicalLink: message.insertCanonicalLink,
-			insertMetaNoIndex: message.insertMetaNoIndex,
-			password: message.password
-		});
-		if (message.openEditor) {
-			ui.onEdit(tabId);
-			await editor.open({
-				tabIndex: tab.index + 1,
-				filename: message.filename,
-				content: Array.from(new Uint8Array(await blob.arrayBuffer())),
-				compressContent: message.compressContent,
+	try {
+		let skipped;
+		if (message.backgroundSave && !message.saveToGDrive && !message.saveWithWebDAV && !message.saveToGitHub) {
+			const testSkip = await testSkipSave(message.filename, message);
+			message.filenameConflictAction = testSkip.filenameConflictAction;
+			skipped = testSkip.skipped;
+		}
+		if (skipped) {
+			ui.onEnd(tabId);
+		} else {
+			const pageData = message.pageData;
+			const prompt = filename => promptFilename(tabId, filename);
+			const blob = await singlefile.processors.compression.process(pageData, {
+				insertTextBody: message.insertTextBody,
+				url: pageData.url || tab.url,
+				createRootDirectory: message.createRootDirectory,
+				tabId,
 				selfExtractingArchive: message.selfExtractingArchive,
 				extractDataFromPage: message.extractDataFromPage,
-				insertTextBody: message.insertTextBody
+				insertCanonicalLink: message.insertCanonicalLink,
+				insertMetaNoIndex: message.insertMetaNoIndex,
+				password: message.password
 			});
-		} else if (message.foregroundSave) {
-			await downloadPageForeground(message.taskId, message.filename, blob, tabId, message.foregroundSave);
-		} else {
-			try {
-				const prompt = filename => promptFilename(tabId, filename);
-				let response;
-				if (message.saveWithWebDAV) {
-					response = await saveWithWebDAV(message.taskId, encodeSharpCharacter(message.filename), blob, message.webDAVURL, message.webDAVUser, message.webDAVPassword, { filenameConflictAction: message.filenameConflictAction, prompt });
-				} else if (message.saveToGDrive) {
-					await saveToGDrive(message.taskId, encodeSharpCharacter(message.filename), blob, {
-						forceWebAuthFlow: message.forceWebAuthFlow
-					}, {
-						onProgress: (offset, size) => ui.onUploadProgress(tabId, offset, size),
-						filenameConflictAction: message.filenameConflictAction,
-						prompt
-					});
-				} else if (message.saveToGitHub) {
-					response = await saveToGitHub(message.taskId, encodeSharpCharacter(message.filename), blob, message.githubToken, message.githubUser, message.githubRepository, message.githubBranch, {
+			let response;
+			if (message.openEditor) {
+				ui.onEdit(tabId);
+				await editor.open({
+					tabIndex: tab.index + 1,
+					filename: message.filename,
+					content: Array.from(new Uint8Array(await blob.arrayBuffer())),
+					compressContent: message.compressContent,
+					selfExtractingArchive: message.selfExtractingArchive,
+					extractDataFromPage: message.extractDataFromPage,
+					insertTextBody: message.insertTextBody
+				});
+			} else if (message.foregroundSave) {
+				await downloadPageForeground(message.taskId, message.filename, blob, tabId, message.foregroundSave);
+			} else if (message.saveWithWebDAV) {
+				response = await saveWithWebDAV(message.taskId, encodeSharpCharacter(message.filename), blob, message.webDAVURL, message.webDAVUser, message.webDAVPassword, { filenameConflictAction: message.filenameConflictAction, prompt });
+			} else if (message.saveToGDrive) {
+				await saveToGDrive(message.taskId, encodeSharpCharacter(message.filename), blob, {
+					forceWebAuthFlow: message.forceWebAuthFlow
+				}, {
+					onProgress: (offset, size) => ui.onUploadProgress(tabId, offset, size),
+					filenameConflictAction: message.filenameConflictAction,
+					prompt
+				});
+			} else if (message.saveToGitHub) {
+				response = await saveToGitHub(message.taskId, encodeSharpCharacter(message.filename), blob, message.githubToken, message.githubUser, message.githubRepository, message.githubBranch, {
+					filenameConflictAction: message.filenameConflictAction,
+					prompt
+				});
+				await response.pushPromise;
+			} else {
+				if (message.backgroundSave) {
+					message.url = URL.createObjectURL(blob);
+					response = await downloadPage(message, {
+						confirmFilename: message.confirmFilename,
+						incognito: tab.incognito,
 						filenameConflictAction: message.filenameConflictAction,
-						prompt
+						filenameReplacementCharacter: message.filenameReplacementCharacter,
+						bookmarkId: message.bookmarkId,
+						replaceBookmarkURL: message.replaceBookmarkURL
 					});
-					await response.pushPromise;
 				} else {
-					if (message.backgroundSave) {
-						message.url = URL.createObjectURL(blob);
-						response = await downloadPage(message, {
-							confirmFilename: message.confirmFilename,
-							incognito: tab.incognito,
-							filenameConflictAction: message.filenameConflictAction,
-							filenameReplacementCharacter: message.filenameReplacementCharacter,
-							bookmarkId: message.bookmarkId,
-							replaceBookmarkURL: message.replaceBookmarkURL
-						});
-					} else {
-						await downloadPageForeground(message.taskId, message.filename, blob, tabId);
-					}
-				}
-				if (message.bookmarkId && message.replaceBookmarkURL && response && response.url) {
-					await bookmarks.update(message.bookmarkId, { url: response.url });
-				}
-				ui.onEnd(tabId);
-			} catch (error) {
-				if (!error.message || error.message != "upload_cancelled") {
-					console.error(error); // eslint-disable-line no-console
-					ui.onError(tabId, error.message);
+					await downloadPageForeground(message.taskId, message.filename, blob, tabId);
 				}
-			} finally {
-				if (message.url) {
-					URL.revokeObjectURL(message.url);
+			}
+			if (message.bookmarkId && message.replaceBookmarkURL && response && response.url) {
+				await bookmarks.update(message.bookmarkId, { url: response.url });
+			}
+			ui.onEnd(tabId);
+			if (message.openSavedPage) {
+				const createTabProperties = { active: true, url: "/src/ui/pages/viewer.html?compressed&blobURI=" + URL.createObjectURL(blob), windowId: tab.windowId };
+				if (tab.index != null) {
+					createTabProperties.index = tab.index + 1;
 				}
+				browser.tabs.create(createTabProperties);
 			}
+
+		}
+	} catch (error) {
+		if (!error.message || error.message != "upload_cancelled") {
+			console.error(error); // eslint-disable-line no-console
+			ui.onError(tabId, error.message);
+		}
+	} finally {
+		if (message.url) {
+			URL.revokeObjectURL(message.url);
 		}
 	}
 }

src/ui/bg/ui-help.js

@@ -25,7 +25,6 @@
 
 let BACKGROUND_SAVE_SUPPORTED,
 	AUTO_SAVE_SUPPORTED,
-	OPEN_SAVED_PAGE_SUPPORTED,
 	AUTO_OPEN_EDITOR_SUPPORTED,
 	INFOBAR_SUPPORTED,
 	BOOKMARKS_API_SUPPORTED,
@@ -38,7 +37,6 @@ browser.runtime.sendMessage({ method: "config.getConstants" }).then(data => {
 	({
 		BACKGROUND_SAVE_SUPPORTED,
 		AUTO_SAVE_SUPPORTED,
-		OPEN_SAVED_PAGE_SUPPORTED,
 		AUTO_OPEN_EDITOR_SUPPORTED,
 		INFOBAR_SUPPORTED,
 		BOOKMARKS_API_SUPPORTED,
@@ -67,9 +65,6 @@ function init() {
 		document.getElementById("bookmarksSection").hidden = true;
 		document.getElementById("bookmarksOptions").hidden = true;
 	}
-	if (!OPEN_SAVED_PAGE_SUPPORTED) {
-		document.getElementById("openSavedPageOption").hidden = true;
-	}
 	if (!AUTO_OPEN_EDITOR_SUPPORTED) {
 		document.getElementById("autoOpenEditorOption").hidden = true;
 	}

src/ui/bg/ui-options.js

@@ -30,7 +30,6 @@ let DEFAULT_PROFILE_NAME,
 	CURRENT_PROFILE_NAME,
 	BACKGROUND_SAVE_SUPPORTED,
 	AUTO_SAVE_SUPPORTED,
-	OPEN_SAVED_PAGE_SUPPORTED,
 	AUTO_OPEN_EDITOR_SUPPORTED,
 	INFOBAR_SUPPORTED,
 	BOOKMARKS_API_SUPPORTED,
@@ -45,7 +44,6 @@ browser.runtime.sendMessage({ method: "config.getConstants" }).then(data => {
 		CURRENT_PROFILE_NAME,
 		BACKGROUND_SAVE_SUPPORTED,
 		AUTO_SAVE_SUPPORTED,
-		OPEN_SAVED_PAGE_SUPPORTED,
 		AUTO_OPEN_EDITOR_SUPPORTED,
 		INFOBAR_SUPPORTED,
 		BOOKMARKS_API_SUPPORTED,
@@ -745,9 +743,6 @@ function init() {
 	if (!BOOKMARKS_API_SUPPORTED) {
 		document.getElementById("bookmarksOptions").hidden = true;
 	}
-	if (!OPEN_SAVED_PAGE_SUPPORTED) {
-		document.getElementById("openSavedPageOption").hidden = true;
-	}
 	if (!AUTO_OPEN_EDITOR_SUPPORTED) {
 		document.getElementById("autoOpenEditorOption").hidden = true;
 	}

src/ui/bg/ui-viewer.js

@@ -0,0 +1,45 @@
+/*
+ * Copyright 2010-2020 Gildas Lormeau
+ * contact : gildas.lormeau <at> gmail.com
+ * 
+ * This file is part of SingleFile.
+ *
+ *   The code in this file is free software: you can redistribute it and/or 
+ *   modify it under the terms of the GNU Affero General Public License 
+ *   (GNU AGPL) as published by the Free Software Foundation, either version 3
+ *   of the License, or (at your option) any later version.
+ * 
+ *   The code in this file is distributed in the hope that it will be useful, 
+ *   but WITHOUT ANY WARRANTY; without even the implied warranty of 
+ *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero 
+ *   General Public License for more details.
+ *
+ *   As additional permission under GNU AGPL version 3 section 7, you may 
+ *   distribute UNMODIFIED VERSIONS OF THIS file without the copy of the GNU 
+ *   AGPL normally required by section 4, provided you include this license 
+ *   notice and a URL through which recipients can access the Corresponding 
+ *   Source.
+ */
+
+/* global document, globalThis, location, singlefile, fetch, URLSearchParams, prompt */
+
+import * as zip from "../../../lib/single-file-zip.js";
+
+globalThis.zip = zip;
+globalThis.onload = async () => {
+	const params = new URLSearchParams(location.search);
+	const blobURI = params.get("blobURI");
+	if (blobURI.startsWith("blob:")) {
+		const compressed = params.has("compressed");
+		const response = await fetch(blobURI);
+		if (compressed) {
+			const blob = await response.blob();
+			const { docContent } = await singlefile.helper.extract(blob, { prompt });
+			await singlefile.helper.display(document, docContent);
+		} else {
+			const text = await response.text();
+			document.write(text);
+			document.close();
+		}
+	}
+};

src/ui/pages/help.html

@@ -115,8 +115,7 @@
 					<li data-options-label="openSavedPageLabel" id="openSavedPageOption"> <span class="option">Option:
 							open saved pages in a new tab</span>
 						<p>Check this option to display the saved page in a new tab. This option can be useful, for
-							example, in order to check the page is properly saved. This option does not work with
-							archive formats based on ZIP files.</p>
+							example, in order to check the page is properly saved.</p>
 					</li>
 					<li data-options-label="autoCloseLabel"> <span class="option">Option: auto-close the tab after the
 							page is saved</span>

src/ui/pages/viewer.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <title>Page viewer</title>
+</head>
+
+<body></body>
+<script src="/lib/single-file-extension-editor-helper.js"></script>
+<script src="../bg/ui-viewer.js" type="module"></script>
+
+</html>