Skip to content

Commit b802da9

Browse files
Merge pull request #1 from DeDuckProject/feat/e2e-action-workflow
feat: bundle action with ncc and add E2E workflow
2 parents 2d0ac6a + 8962c24 commit b802da9

16 files changed

Lines changed: 125507 additions & 25 deletions

File tree

.github/workflows/demo.yml

Lines changed: 23 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,18 @@
1-
# GitGlimpse Demo Workflow
1+
# GitGlimpse E2E Demo Workflow
2+
# Runs the action against a local example app on every PR.
23
# Safe: no untrusted user input (PR titles/bodies) is used in run: commands.
3-
# All PR context is passed via the GITHUB_TOKEN to the action itself.
44
name: GitGlimpse Demo
55

66
on:
77
pull_request:
88
types: [opened, synchronize]
9-
paths:
10-
- 'packages/**'
11-
- 'frameworks/**'
129

1310
jobs:
1411
demo:
1512
runs-on: ubuntu-latest
1613
permissions:
1714
pull-requests: write
18-
contents: read
15+
contents: write
1916

2017
steps:
2118
- uses: actions/checkout@v4
@@ -27,14 +24,29 @@ jobs:
2724
node-version: '20'
2825

2926
- uses: pnpm/action-setup@v4
30-
with:
31-
version: 9
3227

33-
- run: pnpm install
28+
- name: Install dependencies
29+
run: pnpm install
30+
31+
- name: Install Playwright Chromium
32+
run: pnpm --filter @git-glimpse/core exec playwright install chromium --with-deps
33+
34+
- name: Start example app
35+
run: node examples/simple-app/server.js &
36+
37+
- name: Wait for app to be ready
38+
run: |
39+
for i in $(seq 1 15); do
40+
curl -sf http://localhost:3000 && echo "App ready" && exit 0
41+
echo "Waiting... ($i)"
42+
sleep 1
43+
done
44+
echo "App did not become ready" && exit 1
3445
35-
- uses: git-glimpse/action@v1
46+
- uses: ./packages/action
3647
with:
37-
config-path: git-glimpse.config.ts
48+
preview-url: 'http://localhost:3000'
49+
config-path: examples/simple-app/git-glimpse.config.ts
3850
env:
3951
ANTHROPIC_API_KEY: ${{ secrets.ANTHROPIC_API_KEY }}
4052
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.gitignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
node_modules/
22
dist/
3+
!packages/action/dist/
4+
!packages/action/dist/**
5+
!examples/**/*.js
36
*.js
47
*.d.ts
58
*.d.ts.map
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import type { GitGlimpseConfig } from '@git-glimpse/core';
2+
3+
const config: GitGlimpseConfig = {
4+
app: {
5+
previewUrl: 'http://localhost:3000',
6+
},
7+
record: {
8+
format: 'gif',
9+
maxDuration: 20,
10+
viewport: { width: 960, height: 600 },
11+
},
12+
};
13+
14+
export default config;

examples/simple-app/package.json

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"name": "git-glimpse-simple-app",
3+
"version": "1.0.0",
4+
"description": "Minimal example app for git-glimpse E2E testing",
5+
"type": "module",
6+
"scripts": {
7+
"start": "node server.js"
8+
}
9+
}

examples/simple-app/server.js

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
import { createServer } from 'node:http';
2+
3+
const HTML = `<!DOCTYPE html>
4+
<html lang="en">
5+
<head>
6+
<meta charset="UTF-8">
7+
<title>Test App</title>
8+
<style>
9+
body { font-family: sans-serif; padding: 2rem; background: #f5f5f5; }
10+
h1 { color: #333; }
11+
.card { background: white; border-radius: 8px; padding: 1.5rem; margin: 1rem 0; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
12+
button { background: #6366f1; color: white; border: none; padding: 0.75rem 1.5rem; border-radius: 6px; cursor: pointer; font-size: 1rem; }
13+
button:hover { background: #4f46e5; }
14+
.modal { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.5); align-items: center; justify-content: center; }
15+
.modal.open { display: flex; }
16+
.modal-content { background: white; border-radius: 12px; padding: 2rem; max-width: 400px; width: 90%; }
17+
.close-btn { float: right; background: none; border: none; font-size: 1.5rem; cursor: pointer; color: #666; }
18+
#counter { font-size: 2rem; font-weight: bold; color: #6366f1; margin: 1rem 0; }
19+
</style>
20+
</head>
21+
<body>
22+
<h1>Product Page</h1>
23+
24+
<div class="card">
25+
<h2>Wireless Headphones</h2>
26+
<p>Premium noise-cancelling headphones with 30-hour battery life.</p>
27+
<p id="counter">0</p>
28+
<button id="add-to-cart">Add to Cart</button>
29+
<button id="try-on-btn" style="margin-left:0.5rem; background:#10b981">Virtual Try-On</button>
30+
</div>
31+
32+
<div class="modal" id="modal">
33+
<div class="modal-content">
34+
<button class="close-btn" id="close-modal" aria-label="Close">&times;</button>
35+
<h2>Virtual Try-On</h2>
36+
<p>See how these headphones look on you using your camera.</p>
37+
<button id="start-tryon">Start Try-On</button>
38+
</div>
39+
</div>
40+
41+
<script>
42+
let count = 0;
43+
document.getElementById('add-to-cart').addEventListener('click', () => {
44+
count++;
45+
document.getElementById('counter').textContent = count;
46+
});
47+
document.getElementById('try-on-btn').addEventListener('click', () => {
48+
document.getElementById('modal').classList.add('open');
49+
});
50+
document.getElementById('close-modal').addEventListener('click', () => {
51+
document.getElementById('modal').classList.remove('open');
52+
});
53+
</script>
54+
</body>
55+
</html>`;
56+
57+
const PORT = process.env.PORT ? Number(process.env.PORT) : 3000;
58+
59+
const server = createServer((_req, res) => {
60+
res.writeHead(200, { 'Content-Type': 'text/html' });
61+
res.end(HTML);
62+
});
63+
64+
server.listen(PORT, '0.0.0.0', () => {
65+
console.log(`Simple app running at http://localhost:${PORT}`);
66+
});

packages/action/dist/index.d.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export {};

packages/action/dist/index.d.ts.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)