Skip to content

Commit 69983af

Browse files
authored
Add multi browser tests + wabac.js update (#420)
Fidelity: Fix CSP issue with iframes in Firefox (via wabac.js 2.23.0) Loading: Avoid unnecessary reloads of multiWACZ JSON, prune expired multiWACZ collections Testing improvements: - add playwright multi browser tests with firefox and webkit - add test of iframe replay with iframetest.wacz deps: update to wabac.js 2.23.0 bump to 2.3.9
1 parent 62c30e7 commit 69983af

File tree

11 files changed

+139
-27
lines changed

11 files changed

+139
-27
lines changed

.github/workflows/integration.yaml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ jobs:
2727
run: yarn build
2828

2929
- name: Playwright Install Browsers
30-
run: yarn playwright install
30+
run: yarn playwright install --with-deps
3131

3232
- uses: actions/setup-python@v4
3333
with:

CHANGES.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,11 @@
22

33
## CHANGES
44

5+
v2.3.9
6+
- Loading: Avoid unnecessary reloads of multiWACZ JSON, prune expired (via wabac.js 2.23.0)
7+
- Fidelity: Fix CSP issue with iframes in Firefox (via wabac.js 2.23.0)
8+
- Testing: Add testing for CSP handling and embeds in Firefox and Webkit
9+
510
v2.3.8
611

712
- Library: disable GDrive integration in library (for AWP use)
6 KB
Binary file not shown.

package.json

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "replaywebpage",
33
"productName": "ReplayWeb.page",
4-
"version": "2.3.8",
4+
"version": "2.3.9",
55
"description": "Serverless Web Archive Replay",
66
"repository": "https://github.com/webrecorder/replayweb.page",
77
"homepage": "https://replayweb.page/",
@@ -22,7 +22,7 @@
2222
"dependencies": {
2323
"@fortawesome/fontawesome-free": "^5.15.4",
2424
"@shoelace-style/shoelace": "~2.15.1",
25-
"@webrecorder/wabac": "^2.22.17",
25+
"@webrecorder/wabac": "^2.23.0",
2626
"bulma": "^0.9.3",
2727
"electron-log": "^4.4.1",
2828
"electron-updater": "^6.3.9",
@@ -44,7 +44,7 @@
4444
"tsconfig-paths-webpack-plugin": "^4.1.0"
4545
},
4646
"devDependencies": {
47-
"@playwright/test": "^1.38.1",
47+
"@playwright/test": "^1.52.0",
4848
"@types/flexsearch": "^0.7.3",
4949
"@types/lodash": "^4.17.5",
5050
"@typescript-eslint/eslint-plugin": "^6.12.0",
@@ -62,7 +62,7 @@
6262
"husky": "^8.0.0",
6363
"lint-staged": "^14.0.0",
6464
"mini-css-extract-plugin": "^2.3.0",
65-
"playwright": "^1.38.1",
65+
"playwright": "^1.52.0",
6666
"prettier": "^3.0.1",
6767
"raw-loader": "^4.0.2",
6868
"sass-embedded": "^1.70.0",
@@ -97,7 +97,7 @@
9797
"start-dev": "webpack serve --mode development",
9898
"start-docs": "yarn run build-dev && cd mkdocs && ./copy-site.sh && mkdocs serve",
9999
"start-electron": "NODE_ENV=development electron ./dist/electron.js $1",
100-
"test-start-embed": "cd tests/embed; http-server -p 8020",
100+
"test-start-embed": "cp tests/embed/iframe-test.html mkdocs/_genhtml/; cd tests/embed; http-server -p 8020",
101101
"test-start-sandbox": "cd tests/embed/sandbox; http-server -p 8030",
102102
"update-ruffle": "./ruffle/download-latest-ruffle.sh",
103103
"pack": "CSC_IDENTITY_AUTO_DISCOVERY=false electron-builder --publish never",

playwright.config.js

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,22 @@
11
/* eslint-env node */
2-
import { defineConfig } from "@playwright/test";
2+
import { defineConfig, devices } from "@playwright/test";
33
export default defineConfig({
44
reporter: process.env.CI ? "github" : "list",
5+
expect: { timeout: 30_000 },
6+
projects: [
7+
{
8+
name: "chrome",
9+
use: { ...devices['Desktop Chrome'], channel: "chrome" },
10+
},
11+
{
12+
name: 'firefox',
13+
use: { ...devices['Desktop Firefox'] },
14+
},
15+
{
16+
name: 'webkit',
17+
use: { ...devices['Desktop Safari'] },
18+
},
19+
],
520
webServer: [
621
{
722
command: "yarn run start-docs-prod",

tests/embed/iframe-test-cross.html

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<script src="http://localhost:9990/ui.js"></script>
5+
<style>
6+
body {
7+
background-color: lightgrey;
8+
height: 600px;
9+
}
10+
</style>
11+
</head>
12+
<body>
13+
<replay-web-page
14+
noWebWorker
15+
src="http://localhost:9990/docs/examples/iframetest.wacz"
16+
url="page:0"
17+
></replay-web-page>
18+
</body>
19+
</html>

tests/embed/iframe-test.html

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<script src="./ui.js"></script>
5+
<style>
6+
body {
7+
background-color: lightgrey;
8+
height: 600px;
9+
}
10+
</style>
11+
</head>
12+
<body>
13+
<replay-web-page
14+
replaybase="./"
15+
src="./docs/examples/iframetest.wacz"
16+
url="page:0"
17+
></replay-web-page>
18+
</body>
19+
</html>

tests/embed/index-sandbox.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414
</head>
1515
<body>
1616
<replay-web-page
17+
noWebWorker
1718
embed="replay"
1819
src="http://localhost:9990/docs/examples/tweet-example.wacz"
1920
url="page:0"

tests/embed/index.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
</head>
1212
<body>
1313
<replay-web-page
14+
noWebWorker
1415
embed="replay-with-info"
1516
src="http://localhost:9990/docs/examples/tweet-example.wacz"
1617
url="page:0"

tests/embeds.spec.js

Lines changed: 54 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,42 @@ test("cross-domain embed is loading", async ({ page }) => {
4242
await expect(res).toContainText("Want to help");
4343
});
4444

45+
test("same-domain iframe embed is loading", async ({ page }) => {
46+
await page.goto("http://localhost:9990/iframe-test.html");
47+
48+
const res = page
49+
.locator("replay-web-page")
50+
.frameLocator("iframe")
51+
.locator("replay-app-main wr-item wr-coll-replay")
52+
.frameLocator("iframe")
53+
.locator("body");
54+
55+
await expect(res).toContainText("Outside iframe");
56+
57+
const inside = res.frameLocator("iframe").locator("body");
58+
59+
await expect(inside).toContainText("Inside iframe");
60+
61+
});
62+
63+
test("cross-domain iframe embed is loading", async ({ page }) => {
64+
await page.goto("http://localhost:8020/iframe-test-cross.html");
65+
66+
const res = page
67+
.locator("replay-web-page")
68+
.frameLocator("iframe")
69+
.locator("replay-app-main wr-item wr-coll-replay")
70+
.frameLocator("iframe")
71+
.locator("body");
72+
73+
await expect(res).toContainText("Outside iframe");
74+
75+
const inside = res.frameLocator("iframe").locator("body");
76+
77+
await expect(inside).toContainText("Inside iframe");
78+
79+
});
80+
4581
test("sandbox + cross-domain embed is loading", async ({ page }) => {
4682
await page.goto("http://localhost:8030/");
4783

@@ -73,7 +109,7 @@ test("require subdomain iframe", async ({ page }) => {
73109
);
74110
});
75111

76-
test("csp blocking in place", async ({ page }) => {
112+
test("csp blocking in place", async ({ page }, workerInfo) => {
77113
await page.goto("http://localhost:9990/embed.html");
78114

79115
const frame = page
@@ -114,6 +150,8 @@ test("csp blocking in place", async ({ page }) => {
114150

115151
// (5-6) blocked by csp policy, even though local
116152
block += await blocked(iframe.contentWindow, "http://localhost:9990/sw.js");
153+
154+
// not blocked in FF
117155
block += await blocked(
118156
iframe.contentWindow,
119157
"http://localhost:9990/static/wombat.js",
@@ -122,5 +160,19 @@ test("csp blocking in place", async ({ page }) => {
122160
return block;
123161
});
124162

125-
expect(didNotFetch).toBe(6);
163+
const name = workerInfo.project.name;
164+
165+
switch (name) {
166+
case "chrome":
167+
expect(didNotFetch).toBe(6);
168+
break;
169+
170+
case "firefox":
171+
expect(didNotFetch).toBe(5);
172+
break;
173+
174+
case "webkit":
175+
expect(didNotFetch).toBe(4);
176+
break;
177+
}
126178
});

0 commit comments

Comments
 (0)