Skip to content

Commit dd79df6

Browse files
authored
FB video fix + UI tweaks + deps update (0.15.2) (#301)
ui: auto-save prefs checkboxes on click, remember last tab ui: add 'disable MSE' option to disable media-source extensions for potentially improved video capture (disable by default) downloads: serialize pdf, screenshots as 'resource' records fidelity: fix issues with facebook video, #295, via webrecorder/wabac.js#258 further padding for rewriting deps: update to wabac.js 2.23.2, rwp 2.3.12 deps: update electron + builder to latest (36.3.2) bump to 0.15.2
1 parent 059ce69 commit dd79df6

File tree

10 files changed

+934
-328
lines changed

10 files changed

+934
-328
lines changed

package.json

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "@webrecorder/archivewebpage",
33
"productName": "ArchiveWeb.page",
4-
"version": "0.15.1",
4+
"version": "0.15.2",
55
"main": "index.js",
66
"description": "Create Web Archives directly in your browser",
77
"repository": {
@@ -14,7 +14,7 @@
1414
"@fortawesome/fontawesome-free": "^5.13.0",
1515
"@ipld/car": "^5.3.2",
1616
"@ipld/unixfs": "^3.0.0",
17-
"@webrecorder/wabac": "^2.22.17",
17+
"@webrecorder/wabac": "^2.23.2",
1818
"auto-js-ipfs": "^2.3.0",
1919
"browsertrix-behaviors": "^0.8.5",
2020
"btoa": "^1.2.1",
@@ -28,21 +28,23 @@
2828
"p-queue": "^8.0.1",
2929
"pdfjs-dist": "2.2.228",
3030
"pretty-bytes": "^5.6.0",
31-
"replaywebpage": "^2.3.8",
31+
"replaywebpage": "^2.3.12",
3232
"stream-browserify": "^3.0.0",
3333
"tsconfig-paths-webpack-plugin": "^4.1.0",
3434
"unused-filename": "^4.0.1",
3535
"uuid": "^9.0.0",
3636
"warcio": "^2.4.4"
3737
},
3838
"devDependencies": {
39+
"@types/mime-types": "^3.0.0",
40+
"@types/minimist": "^1.2.5",
3941
"@types/uuid": "^10.0.0",
4042
"@typescript-eslint/eslint-plugin": "^6.15.0",
4143
"@typescript-eslint/parser": "^6.15.0",
4244
"copy-webpack-plugin": "^9.0.1",
4345
"css-loader": "^6.2.0",
44-
"electron": "^32.2.0",
45-
"electron-builder": "^24.13.3",
46+
"electron": "^36.3.2",
47+
"electron-builder": "^26.0.12",
4648
"electron-notarize": "^1.2.2",
4749
"eslint": "^8.28.0",
4850
"eslint-config-prettier": "^9.1.0",
@@ -67,7 +69,7 @@
6769
"webpack-extension-reloader": "^1.1.4"
6870
},
6971
"resolutions": {
70-
"@webrecorder/wabac": "^2.22.17"
72+
"@webrecorder/wabac": "^2.23.2"
7173
},
7274
"files": [
7375
"src/",

src/electron/electron-recorder.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ import { Recorder } from "../recorder";
44

55
import path from "path";
66
import fs from "fs";
7-
// @ts-expect-error - TS7016 - Could not find a declaration file for module 'mime-types'. '/Users/emma/Work/Webrecorder/archiveweb.page/node_modules/mime-types/index.js' implicitly has an 'any' type.
87
import mime from "mime-types";
98

109
const DEBUG = false;

src/recorder.ts

Lines changed: 51 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import {
55
rewriteDASH,
66
rewriteHLS,
77
removeRangeAsQuery,
8+
DISABLE_MEDIASOURCE_SCRIPT,
89
} from "@webrecorder/wabac";
910

1011
import { Buffer } from "buffer";
@@ -60,6 +61,7 @@ class Recorder {
6061
archiveFlash = false;
6162
archiveScreenshots = false;
6263
archivePDF = false;
64+
disableMSE = false;
6365

6466
_fetchQueue: FetchEntry[] = [];
6567

@@ -160,8 +162,10 @@ class Recorder {
160162
this.archiveCookies = (await getLocalOption("archiveCookies")) === "1";
161163
this.archiveStorage = (await getLocalOption("archiveStorage")) === "1";
162164
this.archiveFlash = (await getLocalOption("archiveFlash")) === "1";
163-
this.archiveScreenshots = (await getLocalOption("archiveScreenshots")) === "1";
165+
this.archiveScreenshots =
166+
(await getLocalOption("archiveScreenshots")) === "1";
164167
this.archivePDF = (await getLocalOption("archivePDF")) === "1";
168+
this.disableMSE = (await getLocalOption("disableMSE")) === "1";
165169
}
166170

167171
// @ts-expect-error - TS7006 - Parameter 'autorun' implicitly has an 'any' type.
@@ -196,7 +200,8 @@ class Recorder {
196200
});
197201
198202
window.addEventListener("beforeunload", () => {});\n` +
199-
(this.archiveFlash ? this.getFlashInjectScript() : "")
203+
(this.archiveFlash ? this.getFlashInjectScript() : "") +
204+
(this.disableMSE ? DISABLE_MEDIASOURCE_SCRIPT : "")
200205
);
201206
}
202207

@@ -937,13 +942,13 @@ class Recorder {
937942
// eslint-disable-next-line @typescript-eslint/no-explicit-any
938943
async savePDF(pageInfo: any) {
939944
// @ts-expect-error: ignore param
940-
await this.send("Emulation.setEmulatedMedia", {type: "screen"});
945+
await this.send("Emulation.setEmulatedMedia", { type: "screen" });
941946

942947
// @ts-expect-error: ignore param
943-
const resp = await this.send("Page.printToPDF", {printBackground: true});
948+
const resp = await this.send("Page.printToPDF", { printBackground: true });
944949

945950
// @ts-expect-error: ignore param
946-
await this.send("Emulation.setEmulatedMedia", {type: ""});
951+
await this.send("Emulation.setEmulatedMedia", { type: "" });
947952

948953
const payload = Buffer.from(resp.data, "base64");
949954
const mime = "application/pdf";
@@ -955,35 +960,40 @@ class Recorder {
955960
statusText: "OK",
956961
pageId: pageInfo.id,
957962
mime,
958-
respHeaders: {"Content-Type": mime, "Content-Length": payload.length + ""},
963+
respHeaders: {
964+
"Content-Type": mime,
965+
"Content-Length": payload.length + "",
966+
},
959967
reqHeaders: {},
960968
payload,
961-
extraOpts: {resource: true},
969+
extraOpts: { resource: true },
962970
};
963971

964-
console.log("pdf", payload.length);
965-
966972
// @ts-expect-error - TS2339 - Property '_doAddResource' does not exist on type 'Recorder'.
967973
await this._doAddResource(fullData);
968974
}
969975

970976
// eslint-disable-next-line @typescript-eslint/no-explicit-any
971977
async saveScreenshot(pageInfo: any) {
972-
973978
// View Screenshot
974979
const width = 1920;
975980
const height = 1080;
976981

977982
// @ts-expect-error: ignore param
978-
await this.send("Emulation.setDeviceMetricsOverride", {width, height, deviceScaleFactor: 0, mobile: false});
983+
await this.send("Emulation.setDeviceMetricsOverride", {
984+
width,
985+
height,
986+
deviceScaleFactor: 0,
987+
mobile: false,
988+
});
979989
// @ts-expect-error: ignore param
980-
const resp = await this.send("Page.captureScreenshot", {format: "png"});
990+
const resp = await this.send("Page.captureScreenshot", { format: "png" });
981991

982992
const payload = Buffer.from(resp.data, "base64");
983-
const blob = new Blob([payload], {type: "image/png"});
993+
const blob = new Blob([payload], { type: "image/png" });
984994

985995
await this.send("Emulation.clearDeviceMetricsOverride");
986-
996+
987997
const mime = "image/png";
988998

989999
const fullData = {
@@ -993,35 +1003,44 @@ class Recorder {
9931003
statusText: "OK",
9941004
pageId: pageInfo.id,
9951005
mime,
996-
respHeaders: {"Content-Type": mime, "Content-Length": payload.length + ""},
1006+
respHeaders: {
1007+
"Content-Type": mime,
1008+
"Content-Length": payload.length + "",
1009+
},
9971010
reqHeaders: {},
9981011
payload,
999-
extraOpts: {resource: true},
1012+
extraOpts: { resource: true },
10001013
};
10011014

10021015
const thumbWidth = 640;
10031016
const thumbHeight = 360;
10041017

1005-
const bitmap = await self.createImageBitmap(blob, {resizeWidth: thumbWidth, resizeHeight: thumbHeight});
1006-
1018+
const bitmap = await self.createImageBitmap(blob, {
1019+
resizeWidth: thumbWidth,
1020+
resizeHeight: thumbHeight,
1021+
});
1022+
10071023
const canvas = new OffscreenCanvas(thumbWidth, thumbWidth);
10081024
const context = canvas.getContext("bitmaprenderer")!;
10091025
context.transferFromImageBitmap(bitmap);
10101026

1011-
const resizedBlob = await canvas.convertToBlob({type: "image/png"});
1027+
const resizedBlob = await canvas.convertToBlob({ type: "image/png" });
10121028

10131029
const thumbPayload = new Uint8Array(await resizedBlob.arrayBuffer());
10141030

1015-
const thumbData = {...fullData,
1031+
const thumbData = {
1032+
...fullData,
10161033
url: "urn:thumbnail:" + pageInfo.url,
1017-
respHeaders: {"Content-Type": mime, "Content-Length": thumbPayload.length + ""},
1018-
payload: thumbPayload
1034+
respHeaders: {
1035+
"Content-Type": mime,
1036+
"Content-Length": thumbPayload.length + "",
1037+
},
1038+
payload: thumbPayload,
10191039
};
1020-
1040+
10211041
// @ts-expect-error - TS2339 - Property '_doAddResource' does not exist on type 'Recorder'.
10221042
await this._doAddResource(fullData);
10231043

1024-
10251044
// @ts-expect-error - TS2339 - Property '_doAddResource' does not exist on type 'Recorder'.
10261045
await this._doAddResource(thumbData);
10271046
}
@@ -1470,12 +1489,19 @@ class Recorder {
14701489
case "text/javascript":
14711490
case "application/javascript":
14721491
case "application/x-javascript": {
1473-
const rw = getCustomRewriter(url, ct === "text/html");
1492+
const rw = getCustomRewriter(
1493+
url,
1494+
ct === "text/html" && this.disableMSE,
1495+
);
14741496

14751497
if (rw) {
14761498
string = payload.toString();
14771499
newString = rw.rewrite(string, { save: extraOpts });
14781500
}
1501+
1502+
if (this.disableMSE) {
1503+
extraOpts.disableMSE = 1;
1504+
}
14791505
}
14801506
}
14811507

src/requestresponseinfo.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { getCustomRewriter, getStatusText } from "@webrecorder/wabac";
2+
import { type ExtraOpts } from "@webrecorder/wabac/swlib";
23

34
import { postToGetUrl } from "warcio";
45

@@ -16,7 +17,7 @@ const encoder = new TextEncoder();
1617

1718
// ===========================================================================
1819
class RequestResponseInfo {
19-
extraOpts: Record<string, string>;
20+
extraOpts: ExtraOpts;
2021

2122
// @ts-expect-error - TS7006 - Parameter 'requestId' implicitly has an 'any' type.
2223
constructor(requestId) {
@@ -197,7 +198,6 @@ class RequestResponseInfo {
197198
"compliant"
198199
? "1"
199200
: "0";
200-
// @ts-expect-error - TS2339 - Property 'extraOpts' does not exist on type 'RequestResponseInfo'.
201201
this.extraOpts.cert = { issuer, ctc };
202202
}
203203
}

0 commit comments

Comments
 (0)