archivalo-oss/replayweb.page
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add initial set of Playwright integration tests, for testing embeds (#254)

Browse Source 
* add first pass on playwright integration tests!
- test embed loading via localhost:9990/embed.html as well as cross-domain with embed on localhost:8020/
while RWP + data on localhost:9990/
- add --ignore-optional to most ci runs
- add playwright ci test
- add playwright and playwright-test to dev dependencies
- add 'test-start-embed' to start test harness for localhost:8020/ embed
- add 'test-start-sandbox' to start test harndess for localhost:8030/ sandbox
- add additional tests for loading with sandbox + requiresubdomainiframe, ensure 'requiresubdomainiframe' works, doesn't allow loading directly
This commit is contained in:
Ilya Kreymer
2023-11-29 15:54:42 -05:00
committed by emma
parent c7b2fd74fb
commit 7d013f194d
11 changed files with 182 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.github/workflows/integration.yaml
+28
View File
@@ -0,0 +1,28 @@
name: Playwright Integration
on:
push:
pull_request:
jobs:
playwright:
runs-on: ubuntu-latest
steps:
- name: Check out Git repository
uses: actions/checkout@v2
- name: Install Node.js, NPM and Yarn
uses: actions/setup-node@v3
with:
node-version: 18
cache: 'yarn'
- name: Yarn Install
run: yarn install --frozen-lockfile
- name: Playwright Install Browsers
run: yarn playwright install
- name: Playwright Run Tests
run: yarn run playwright test
.github/workflows/lint.yaml
+1 -1
View File
@@ -17,7 +17,7 @@ jobs:
cache: 'yarn'
- name: Yarn Install
run: yarn install --frozen-lockfile
run: yarn install --frozen-lockfile --ignore-optional
- name: Yarn Lint
run: yarn run lint
.github/workflows/npm-release.yaml
+1 -1
View File
@@ -15,7 +15,7 @@ jobs:
cache: 'yarn'
- name: Yarn Install
run: yarn install --frozen-lockfile
run: yarn install --frozen-lockfile --ignore-optional
- name: Yarn Build
run: yarn run build
package.json
+5 -1
View File
@@ -32,6 +32,7 @@
"@types/flexsearch": "^0.7.3",
"@typescript-eslint/eslint-plugin": "^6.9.1",
"@typescript-eslint/parser": "^6.9.1",
"@playwright/test": "^1.38.1",
"copy-webpack-plugin": "^9.0.1",
"css-loader": "^6.2.0",
"electron": "^25.1.1",
@@ -45,6 +46,7 @@
"lint-staged": "^14.0.0",
"mini-css-extract-plugin": "^2.3.0",
"node-sass": "^9.0.0",
"playwright": "^1.38.1",
"prettier": "^3.0.1",
"raw-loader": "^4.0.2",
"sass-loader": "^13.3.2",
@@ -72,7 +74,9 @@
"build-dev": "webpack --mode development",
"build-docs": "bundle install; bundle exec jekyll build",
"start-dev": "webpack serve --mode development",
"start-prod": "http-server -p 9990",
"start-prod": "http-server -p 9990 --cors",
"test-start-embed": "cd tests/embed; http-server -p 8020",
"test-start-sandbox": "cd tests/embed/sandbox; http-server -p 8030",
"pack": "CSC_IDENTITY_AUTO_DISCOVERY=false electron-builder --publish never",
"pack-signed": "electron-builder",
"start-electron": "NODE_ENV=development electron ./dist/electron.js $1",
playwright.config.js
+24
View File
@@ -0,0 +1,24 @@
import { defineConfig } from '@playwright/test';
export default defineConfig({
reporter: process.env.CI ? 'github' : 'list',
webServer: [
{
command: 'yarn run start-prod',
url: 'http://127.0.0.1:9990',
timeout: 120 * 1000,
reuseExistingServer: !process.env.CI,
},
{
command: 'yarn run test-start-embed',
url: 'http://127.0.0.1:8020',
timeout: 120 * 1000,
reuseExistingServer: !process.env.CI,
},
{
command: 'yarn run test-start-sandbox',
url: 'http://127.0.0.1:8030',
timeout: 120 * 1000,
reuseExistingServer: !process.env.CI,
}
]
});
tests/embed/index-sandbox.html
+19
View File
@@ -0,0 +1,19 @@
<!doctype html>
<html>
<head>
<script src="http://localhost:9990/ui.js"></script>
<style>
html, body {
background-color: lightgrey;
height: 100%;
width: 100%;
overflow: hidden;
}
</style>
</head>
<body>
<replay-web-page embed="replay" src="http://localhost:9990/docs/assets/tweet-example.wacz" url="page:0" sandbox requiresubdomainiframe></replay-web-page>
</body>
</html>
tests/embed/index.html
+17
View File
@@ -0,0 +1,17 @@
<!doctype html>
<html>
<head>
<script src="http://localhost:9990/ui.js"></script>
<style>
body {
background-color: lightgrey;
height: 600px;
}
</style>
</head>
<body>
<replay-web-page embed="replay-with-info" src="http://localhost:9990/docs/assets/tweet-example.wacz" url="page:0"></replay-web-page>
</body>
</html>
tests/embed/replay/sw.js
+1
View File
@@ -0,0 +1 @@
importScripts("http://localhost:9990/sw.js");
tests/embed/sandbox/index.html
+22
View File
@@ -0,0 +1,22 @@
<!doctype html>
<html>
<head>
<style>
html, body {
width: 100%;
height: 100%;
}
iframe {
border: 1px black solid;
display: flex;
width: 90%;
height: 600px;
}
</style>
</head>
<body>
<iframe src="http://localhost:8020/index-sandbox.html" sandbox="allow-scripts allow-modals allow-forms allow-same-origin allow-downloads"></iframe>
</body>
</html>
tests/embeds.spec.js
+42
View File
@@ -0,0 +1,42 @@
import { test, expect } from '@playwright/test';
import { createServer } from "http-server";
test("same-domain embed is loading", async ({ page }) => {
await page.goto("http://localhost:9990/embed.html");
const res = page.locator("replay-web-page").frameLocator("iframe").locator("replay-app-main wr-coll wr-coll-replay").frameLocator("iframe").frameLocator("iframe#twitter-widget-0").locator("body");
await expect(res).toContainText("Want to help");
});
test("cross-domain embed is loading", async ({ page }) => {
await page.goto("http://localhost:8020/");
const res = page.locator("replay-web-page").frameLocator("iframe").locator("replay-app-main wr-coll wr-coll-replay").frameLocator("iframe").frameLocator("iframe#twitter-widget-0").locator("body");
await expect(res).toContainText("Want to help");
});
test("sandbox + cross-domain embed is loading", async ({ page }) => {
await page.goto("http://localhost:8030/");
const sandboxFrame = page.locator("iframe");
await expect(await sandboxFrame.getAttribute("src")).toBe("http://localhost:8020/index-sandbox.html");
const res = page.frameLocator("iframe").locator("replay-web-page").frameLocator("iframe").locator("replay-app-main wr-coll wr-coll-replay").frameLocator("iframe").frameLocator("iframe#twitter-widget-0").locator("body");
await expect(res).toContainText("Want to help");
});
test("require subdomain iframe", async ({ page }) => {
// load directly, should be blocked
await page.goto("http://localhost:8020/index-sandbox.html");
const res = page.locator("replay-web-page");
await expect(res).toContainText("Sorry, due to security settings, this ReplayWeb.page embed only be viewed within a subdomain iframe.");
});
yarn.lock
+22 -1
View File
@@ -388,6 +388,13 @@
tslib "^2.4.1"
tsyringe "^4.7.0"
"@playwright/test@^1.38.1":
version "1.38.1"
resolved "https://registry.yarnpkg.com/@playwright/test/-/test-1.38.1.tgz#8ef4263e355cd1d8ad7905d471d268e8acb82ed6"
integrity sha512-NqRp8XMwj3AK+zKLbZShl0r/9wKgzqI/527bkptKXomtuo+dOjU9NdMASQ8DNC9z9zLOMbG53T4eihYr3XR+BQ==
dependencies:
playwright "1.38.1"
"@shoelace-style/animations@^1.1.0":
version "1.1.0"
resolved "https://registry.yarnpkg.com/@shoelace-style/animations/-/animations-1.1.0.tgz#17539abafd6dcbf2a79e089e1593175e9f7835b5"
@@ -2970,7 +2977,7 @@ fs.realpath@^1.0.0:
resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
integrity sha1-FQStJSMVjKpA20onh8sBQRmU6k8=
fsevents@~2.3.2:
fsevents@2.3.2, fsevents@~2.3.2:
version "2.3.2"
resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==
@@ -4879,6 +4886,20 @@ pkg-dir@^4.2.0:
dependencies:
find-up "^4.0.0"
playwright-core@1.38.1:
version "1.38.1"
resolved "https://registry.yarnpkg.com/playwright-core/-/playwright-core-1.38.1.tgz#75a3c470aa9576b7d7c4e274de3d79977448ba08"
integrity sha512-tQqNFUKa3OfMf4b2jQ7aGLB8o9bS3bOY0yMEtldtC2+spf8QXG9zvXLTXUeRsoNuxEYMgLYR+NXfAa1rjKRcrg==
playwright@1.38.1, playwright@^1.38.1:
version "1.38.1"
resolved "https://registry.yarnpkg.com/playwright/-/playwright-1.38.1.tgz#82ecd9bc4f4f64dbeee8a11c31793748e2528130"
integrity sha512-oRMSJmZrOu1FP5iu3UrCx8JEFRIMxLDM0c/3o4bpzU5Tz97BypefWf7TuTNPWeCe279TPal5RtPPZ+9lW/Qkow==
dependencies:
playwright-core "1.38.1"
optionalDependencies:
fsevents "2.3.2"
plist@^3.0.1, plist@^3.0.4:
version "3.0.5"
resolved "https://registry.yarnpkg.com/plist/-/plist-3.0.5.tgz#2cbeb52d10e3cdccccf0c11a63a85d830970a987"