openuispec 0.2.19 → 0.2.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/check/audit.js +392 -0
- package/dist/check/index.js +216 -0
- package/dist/cli/configure-target.js +391 -0
- package/dist/cli/index.js +510 -0
- package/dist/cli/init.js +1047 -0
- package/dist/drift/index.js +903 -0
- package/dist/mcp-server/index.js +886 -0
- package/dist/mcp-server/preview-render.js +1761 -0
- package/dist/mcp-server/preview.js +233 -0
- package/dist/mcp-server/screenshot-android.js +458 -0
- package/dist/mcp-server/screenshot-ios.js +639 -0
- package/dist/mcp-server/screenshot-shared.js +180 -0
- package/dist/mcp-server/screenshot.js +459 -0
- package/dist/prepare/index.js +1216 -0
- package/dist/runtime/package-paths.js +33 -0
- package/dist/schema/semantic-lint.js +564 -0
- package/dist/schema/validate.js +689 -0
- package/dist/status/index.js +194 -0
- package/package.json +12 -13
- package/check/audit.ts +0 -426
- package/check/index.ts +0 -320
- package/cli/configure-target.ts +0 -523
- package/cli/index.ts +0 -537
- package/cli/init.ts +0 -1253
- package/drift/index.ts +0 -1165
- package/mcp-server/index.ts +0 -1041
- package/mcp-server/preview-render.ts +0 -1922
- package/mcp-server/preview.ts +0 -292
- package/mcp-server/screenshot-android.ts +0 -621
- package/mcp-server/screenshot-ios.ts +0 -753
- package/mcp-server/screenshot-shared.ts +0 -237
- package/mcp-server/screenshot.ts +0 -563
- package/prepare/index.ts +0 -1530
- package/schema/semantic-lint.ts +0 -692
- package/schema/validate.ts +0 -870
- package/scripts/regenerate-previews.ts +0 -136
- package/scripts/take-all-screenshots.ts +0 -507
- package/status/index.ts +0 -275
|
@@ -1,136 +0,0 @@
|
|
|
1
|
-
#!/usr/bin/env npx tsx
|
|
2
|
-
/**
|
|
3
|
-
* Regenerates all preview PNGs for the 3 example projects using the
|
|
4
|
-
* preview renderer (preview-render.ts → preview.ts → Puppeteer).
|
|
5
|
-
*
|
|
6
|
-
* Outputs to examples/<project>/previews/<screen>_<sizeClass>[_<theme>].png
|
|
7
|
-
*
|
|
8
|
-
* Usage: npx tsx scripts/regenerate-previews.ts
|
|
9
|
-
*/
|
|
10
|
-
|
|
11
|
-
import { mkdirSync, writeFileSync } from "node:fs";
|
|
12
|
-
import { join, resolve } from "node:path";
|
|
13
|
-
import { renderPreview } from "../mcp-server/preview.js";
|
|
14
|
-
import { closeBrowser } from "../mcp-server/screenshot-shared.js";
|
|
15
|
-
|
|
16
|
-
const ROOT = resolve(import.meta.dirname!, "..");
|
|
17
|
-
|
|
18
|
-
interface Capture {
|
|
19
|
-
screen: string;
|
|
20
|
-
sizeClass: "compact" | "regular" | "expanded";
|
|
21
|
-
theme?: "light" | "dark";
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
interface ProjectDef {
|
|
25
|
-
name: string;
|
|
26
|
-
captures: Capture[];
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
function allSizes(screen: string): Capture[] {
|
|
30
|
-
return [
|
|
31
|
-
{ screen, sizeClass: "compact" },
|
|
32
|
-
{ screen, sizeClass: "expanded" },
|
|
33
|
-
];
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
function allSizesWithThemes(screen: string): Capture[] {
|
|
37
|
-
return [
|
|
38
|
-
{ screen, sizeClass: "compact" },
|
|
39
|
-
{ screen, sizeClass: "expanded" },
|
|
40
|
-
{ screen, sizeClass: "compact", theme: "light" },
|
|
41
|
-
{ screen, sizeClass: "compact", theme: "dark" },
|
|
42
|
-
{ screen, sizeClass: "expanded", theme: "light" },
|
|
43
|
-
{ screen, sizeClass: "expanded", theme: "dark" },
|
|
44
|
-
];
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
const PROJECTS: ProjectDef[] = [
|
|
48
|
-
{
|
|
49
|
-
name: "social-app",
|
|
50
|
-
captures: [
|
|
51
|
-
...allSizes("home_feed"),
|
|
52
|
-
...allSizes("discover"),
|
|
53
|
-
...allSizes("notifications"),
|
|
54
|
-
...allSizes("messages_inbox"),
|
|
55
|
-
...allSizes("profile_self"),
|
|
56
|
-
...allSizes("profile_user"),
|
|
57
|
-
...allSizes("settings"),
|
|
58
|
-
...allSizes("post_detail"),
|
|
59
|
-
...allSizes("chat_detail"),
|
|
60
|
-
...allSizes("search_results"),
|
|
61
|
-
...allSizes("edit_profile"),
|
|
62
|
-
],
|
|
63
|
-
},
|
|
64
|
-
{
|
|
65
|
-
name: "taskflow",
|
|
66
|
-
captures: [
|
|
67
|
-
...allSizesWithThemes("home"),
|
|
68
|
-
...allSizes("projects"),
|
|
69
|
-
...allSizes("calendar"),
|
|
70
|
-
...allSizesWithThemes("settings"),
|
|
71
|
-
...allSizesWithThemes("task_detail"),
|
|
72
|
-
...allSizes("project_detail"),
|
|
73
|
-
...allSizes("profile_edit"),
|
|
74
|
-
],
|
|
75
|
-
},
|
|
76
|
-
{
|
|
77
|
-
name: "todo-orbit",
|
|
78
|
-
captures: [
|
|
79
|
-
...allSizes("home"),
|
|
80
|
-
...allSizes("analytics"),
|
|
81
|
-
...allSizes("settings"),
|
|
82
|
-
...allSizes("task_detail"),
|
|
83
|
-
],
|
|
84
|
-
},
|
|
85
|
-
];
|
|
86
|
-
|
|
87
|
-
function log(msg: string) { console.log(`\x1b[36m▸\x1b[0m ${msg}`); }
|
|
88
|
-
function logOk(msg: string) { console.log(`\x1b[32m✔\x1b[0m ${msg}`); }
|
|
89
|
-
function logErr(msg: string) { console.error(`\x1b[31m✖\x1b[0m ${msg}`); }
|
|
90
|
-
|
|
91
|
-
async function main() {
|
|
92
|
-
let total = 0;
|
|
93
|
-
let failures = 0;
|
|
94
|
-
|
|
95
|
-
for (const project of PROJECTS) {
|
|
96
|
-
console.log(`\n\x1b[1m=== ${project.name} ===\x1b[0m\n`);
|
|
97
|
-
const projectCwd = join(ROOT, "examples", project.name);
|
|
98
|
-
const outDir = join(projectCwd, "previews");
|
|
99
|
-
mkdirSync(outDir, { recursive: true });
|
|
100
|
-
|
|
101
|
-
for (const cap of project.captures) {
|
|
102
|
-
const theme = cap.theme ?? "light";
|
|
103
|
-
const suffix = cap.theme ? `_${cap.theme}` : "";
|
|
104
|
-
const filename = `${cap.screen}_${cap.sizeClass}${suffix}.png`;
|
|
105
|
-
log(`${filename}...`);
|
|
106
|
-
total++;
|
|
107
|
-
|
|
108
|
-
try {
|
|
109
|
-
const result = await renderPreview(projectCwd, {
|
|
110
|
-
screen: cap.screen,
|
|
111
|
-
size_class: cap.sizeClass,
|
|
112
|
-
theme,
|
|
113
|
-
});
|
|
114
|
-
|
|
115
|
-
for (const item of result.content) {
|
|
116
|
-
if (item.type === "image" && "data" in item) {
|
|
117
|
-
writeFileSync(join(outDir, filename), Buffer.from(item.data, "base64"));
|
|
118
|
-
logOk(filename);
|
|
119
|
-
}
|
|
120
|
-
}
|
|
121
|
-
} catch (err: any) {
|
|
122
|
-
logErr(`${filename}: ${err.message}`);
|
|
123
|
-
failures++;
|
|
124
|
-
}
|
|
125
|
-
}
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
await closeBrowser();
|
|
129
|
-
console.log(`\n\x1b[${failures ? "31" : "32"}m${total - failures}/${total} previews generated, ${failures} failures\x1b[0m\n`);
|
|
130
|
-
process.exit(failures > 0 ? 1 : 0);
|
|
131
|
-
}
|
|
132
|
-
|
|
133
|
-
main().catch((err) => {
|
|
134
|
-
console.error(err);
|
|
135
|
-
process.exit(1);
|
|
136
|
-
});
|
|
@@ -1,507 +0,0 @@
|
|
|
1
|
-
#!/usr/bin/env npx tsx
|
|
2
|
-
/**
|
|
3
|
-
* Takes screenshots of all generated targets across all example projects.
|
|
4
|
-
* Outputs to artifacts/<project>/screenshots/<platform>-<screen>.png
|
|
5
|
-
*
|
|
6
|
-
* Usage:
|
|
7
|
-
* npx tsx scripts/take-all-screenshots.ts # per-screen mode (manual nav)
|
|
8
|
-
* npx tsx scripts/take-all-screenshots.ts --batch # batch mode (build once, capture many)
|
|
9
|
-
*
|
|
10
|
-
* Requires: puppeteer, running Android emulator, booted iOS simulator.
|
|
11
|
-
*/
|
|
12
|
-
|
|
13
|
-
import { spawn } from "node:child_process";
|
|
14
|
-
import { exec as execCb } from "node:child_process";
|
|
15
|
-
import { promisify } from "node:util";
|
|
16
|
-
import { mkdirSync, existsSync, readFileSync, writeFileSync, readdirSync } from "node:fs";
|
|
17
|
-
import { join, resolve } from "node:path";
|
|
18
|
-
import type { ChildProcess } from "node:child_process";
|
|
19
|
-
|
|
20
|
-
// Import helpers from mcp-server modules (per-screen mode)
|
|
21
|
-
import {
|
|
22
|
-
findAdb,
|
|
23
|
-
getConnectedEmulator,
|
|
24
|
-
adbShell,
|
|
25
|
-
extractAppInfo as extractAndroidAppInfo,
|
|
26
|
-
buildApk,
|
|
27
|
-
navigateByTaps,
|
|
28
|
-
captureScreenshot as captureAndroidScreenshot,
|
|
29
|
-
cleanEmulatorStorage,
|
|
30
|
-
} from "../mcp-server/screenshot-android.js";
|
|
31
|
-
import {
|
|
32
|
-
type IOSAppInfo,
|
|
33
|
-
extractAppInfo as extractIOSAppInfo,
|
|
34
|
-
findSimulator,
|
|
35
|
-
buildApp as buildIOSApp,
|
|
36
|
-
findAppBundle,
|
|
37
|
-
installAndLaunch as installAndLaunchIOS,
|
|
38
|
-
captureScreenshot as captureIOSScreenshot,
|
|
39
|
-
generateUITestTargetYml,
|
|
40
|
-
insertUITestTarget,
|
|
41
|
-
ensureInfoPlistFlag,
|
|
42
|
-
} from "../mcp-server/screenshot-ios.js";
|
|
43
|
-
|
|
44
|
-
// Import batch functions
|
|
45
|
-
import { takeScreenshotBatch } from "../mcp-server/screenshot.js";
|
|
46
|
-
import { takeAndroidScreenshotBatch } from "../mcp-server/screenshot-android.js";
|
|
47
|
-
import { takeIOSScreenshotBatch } from "../mcp-server/screenshot-ios.js";
|
|
48
|
-
|
|
49
|
-
const exec = promisify(execCb);
|
|
50
|
-
|
|
51
|
-
const ROOT = resolve(import.meta.dirname!, "..");
|
|
52
|
-
const ARTIFACTS = join(ROOT, "artifacts");
|
|
53
|
-
const BATCH_MODE = process.argv.includes("--batch");
|
|
54
|
-
const PLATFORM_FILTER = (() => {
|
|
55
|
-
const idx = process.argv.indexOf("--platform");
|
|
56
|
-
return idx >= 0 ? process.argv[idx + 1]?.toLowerCase() : null;
|
|
57
|
-
})();
|
|
58
|
-
|
|
59
|
-
// ── Project definitions ──────────────────────────────────────────────
|
|
60
|
-
|
|
61
|
-
interface WebScreen { name: string; route: string }
|
|
62
|
-
interface NativeScreen { name: string; route?: string; nav?: string[] }
|
|
63
|
-
|
|
64
|
-
interface ProjectDef {
|
|
65
|
-
name: string;
|
|
66
|
-
web?: { dir: string; screens: WebScreen[] };
|
|
67
|
-
android?: { dir: string; screens: NativeScreen[] };
|
|
68
|
-
ios?: { dir: string; screens: NativeScreen[] };
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
const PROJECTS: ProjectDef[] = [
|
|
72
|
-
{
|
|
73
|
-
name: "social-app",
|
|
74
|
-
web: {
|
|
75
|
-
dir: "examples/social-app/generated/web/social-app",
|
|
76
|
-
screens: [
|
|
77
|
-
{ name: "home", route: "/home" },
|
|
78
|
-
{ name: "discover", route: "/discover" },
|
|
79
|
-
{ name: "notifications", route: "/notifications" },
|
|
80
|
-
{ name: "messages", route: "/messages" },
|
|
81
|
-
{ name: "profile", route: "/profile" },
|
|
82
|
-
{ name: "settings", route: "/settings" },
|
|
83
|
-
],
|
|
84
|
-
},
|
|
85
|
-
android: {
|
|
86
|
-
dir: "examples/social-app/generated/android/social-app",
|
|
87
|
-
screens: [
|
|
88
|
-
{ name: "home", route: "socialapp://home" },
|
|
89
|
-
{ name: "discover", route: "socialapp://discover" },
|
|
90
|
-
{ name: "notifications", route: "socialapp://notifications" },
|
|
91
|
-
{ name: "messages", route: "socialapp://messages" },
|
|
92
|
-
{ name: "profile", route: "socialapp://profile" },
|
|
93
|
-
],
|
|
94
|
-
},
|
|
95
|
-
},
|
|
96
|
-
{
|
|
97
|
-
name: "todo-orbit",
|
|
98
|
-
web: {
|
|
99
|
-
dir: "examples/todo-orbit/generated/web/Todo Orbit",
|
|
100
|
-
screens: [
|
|
101
|
-
{ name: "home", route: "/" },
|
|
102
|
-
{ name: "analytics", route: "/analytics" },
|
|
103
|
-
{ name: "settings", route: "/settings" },
|
|
104
|
-
],
|
|
105
|
-
},
|
|
106
|
-
android: {
|
|
107
|
-
dir: "examples/todo-orbit/generated/android/Todo Orbit",
|
|
108
|
-
screens: [
|
|
109
|
-
{ name: "home" },
|
|
110
|
-
{ name: "analytics", nav: ["Analytics"] },
|
|
111
|
-
{ name: "settings", nav: ["Settings"] },
|
|
112
|
-
],
|
|
113
|
-
},
|
|
114
|
-
ios: {
|
|
115
|
-
dir: "examples/todo-orbit/generated/ios/Todo Orbit",
|
|
116
|
-
screens: [
|
|
117
|
-
{ name: "home" },
|
|
118
|
-
{ name: "analytics", nav: ["Analytics"] },
|
|
119
|
-
{ name: "settings", nav: ["Settings"] },
|
|
120
|
-
],
|
|
121
|
-
},
|
|
122
|
-
},
|
|
123
|
-
{
|
|
124
|
-
name: "taskflow",
|
|
125
|
-
web: {
|
|
126
|
-
dir: "examples/taskflow/generated/web/TaskFlow",
|
|
127
|
-
screens: [
|
|
128
|
-
{ name: "home", route: "/tasks" },
|
|
129
|
-
{ name: "projects", route: "/projects" },
|
|
130
|
-
{ name: "calendar", route: "/calendar" },
|
|
131
|
-
{ name: "settings", route: "/settings" },
|
|
132
|
-
{ name: "profile", route: "/profile" },
|
|
133
|
-
],
|
|
134
|
-
},
|
|
135
|
-
android: {
|
|
136
|
-
dir: "examples/taskflow/generated/android/TaskFlow",
|
|
137
|
-
screens: [
|
|
138
|
-
{ name: "home" },
|
|
139
|
-
{ name: "projects", nav: ["Projects"] },
|
|
140
|
-
{ name: "settings", nav: ["Settings"] },
|
|
141
|
-
],
|
|
142
|
-
},
|
|
143
|
-
ios: {
|
|
144
|
-
dir: "examples/taskflow/generated/ios/TaskFlow",
|
|
145
|
-
screens: [
|
|
146
|
-
{ name: "home" },
|
|
147
|
-
{ name: "projects", nav: ["Projects"] },
|
|
148
|
-
{ name: "calendar", nav: ["Calendar"] },
|
|
149
|
-
{ name: "settings", nav: ["Settings"] },
|
|
150
|
-
],
|
|
151
|
-
},
|
|
152
|
-
},
|
|
153
|
-
];
|
|
154
|
-
|
|
155
|
-
// ── Utilities ────────────────────────────────────────────────────────
|
|
156
|
-
|
|
157
|
-
function log(msg: string) { console.log(`\x1b[36m▸\x1b[0m ${msg}`); }
|
|
158
|
-
function logOk(msg: string) { console.log(`\x1b[32m✔\x1b[0m ${msg}`); }
|
|
159
|
-
function logErr(msg: string) { console.error(`\x1b[31m✖\x1b[0m ${msg}`); }
|
|
160
|
-
function sleep(ms: number) { return new Promise((r) => setTimeout(r, ms)); }
|
|
161
|
-
|
|
162
|
-
function saveResultScreenshots(result: any, outDir: string, platform: string) {
|
|
163
|
-
mkdirSync(outDir, { recursive: true });
|
|
164
|
-
if (result.isError) {
|
|
165
|
-
logErr(` ${platform}: ${result.content?.[0]?.text ?? "unknown error"}`);
|
|
166
|
-
return;
|
|
167
|
-
}
|
|
168
|
-
for (const item of result.content) {
|
|
169
|
-
if (item.type === "image" && item.data) {
|
|
170
|
-
// Next text item has metadata with screen name
|
|
171
|
-
const idx = result.content.indexOf(item);
|
|
172
|
-
const meta = result.content[idx + 1];
|
|
173
|
-
let screenName = "unknown";
|
|
174
|
-
if (meta?.type === "text") {
|
|
175
|
-
try { screenName = JSON.parse(meta.text).screen; } catch { /* ignore */ }
|
|
176
|
-
}
|
|
177
|
-
const outPath = join(outDir, `${platform}-${screenName}.png`);
|
|
178
|
-
writeFileSync(outPath, Buffer.from(item.data, "base64"));
|
|
179
|
-
logOk(` ${platform}-${screenName}.png`);
|
|
180
|
-
}
|
|
181
|
-
}
|
|
182
|
-
}
|
|
183
|
-
|
|
184
|
-
// ══════════════════════════════════════════════════════════════════════
|
|
185
|
-
// BATCH MODE — uses takeScreenshotBatch / takeAndroidScreenshotBatch / takeIOSScreenshotBatch
|
|
186
|
-
// ══════════════════════════════════════════════════════════════════════
|
|
187
|
-
|
|
188
|
-
async function runBatchMode() {
|
|
189
|
-
for (const project of PROJECTS) {
|
|
190
|
-
console.log(`\n\x1b[1m=== ${project.name} (batch) ===\x1b[0m\n`);
|
|
191
|
-
const outDir = join(ARTIFACTS, project.name, "screenshots");
|
|
192
|
-
|
|
193
|
-
if (project.ios && (!PLATFORM_FILTER || PLATFORM_FILTER === "ios")) {
|
|
194
|
-
try {
|
|
195
|
-
log(`iOS batch: ${project.ios.screens.length} screens...`);
|
|
196
|
-
const result = await takeIOSScreenshotBatch(join(ROOT, "examples", project.name), {
|
|
197
|
-
captures: project.ios.screens.map((s) => ({ screen: s.name, nav: s.nav, wait_for: 5000 })),
|
|
198
|
-
project_dir: join(ROOT, project.ios.dir),
|
|
199
|
-
});
|
|
200
|
-
saveResultScreenshots(result, outDir, "ios");
|
|
201
|
-
} catch (err: any) { logErr(`iOS batch failed for ${project.name}: ${err.message}`); }
|
|
202
|
-
}
|
|
203
|
-
|
|
204
|
-
if (project.android && (!PLATFORM_FILTER || PLATFORM_FILTER === "android")) {
|
|
205
|
-
try {
|
|
206
|
-
log(`Android batch: ${project.android.screens.length} screens...`);
|
|
207
|
-
const result = await takeAndroidScreenshotBatch(join(ROOT, "examples", project.name), {
|
|
208
|
-
captures: project.android.screens.map((s) => ({ screen: s.name, route: s.route, nav: s.nav, wait_for: 8000 })),
|
|
209
|
-
project_dir: join(ROOT, project.android.dir),
|
|
210
|
-
});
|
|
211
|
-
saveResultScreenshots(result, outDir, "android");
|
|
212
|
-
} catch (err: any) { logErr(`Android batch failed for ${project.name}: ${err.message}`); }
|
|
213
|
-
}
|
|
214
|
-
|
|
215
|
-
if (project.web && (!PLATFORM_FILTER || PLATFORM_FILTER === "web")) {
|
|
216
|
-
try {
|
|
217
|
-
const openuispecDir = join(ROOT, "examples", project.name);
|
|
218
|
-
log(`Web batch: ${project.web.screens.length} screens...`);
|
|
219
|
-
const result = await takeScreenshotBatch(openuispecDir, {
|
|
220
|
-
captures: project.web.screens.map((s) => ({ screen: s.name, route: s.route, wait_for: 3000 })),
|
|
221
|
-
});
|
|
222
|
-
saveResultScreenshots(result, outDir, "web");
|
|
223
|
-
} catch (err: any) { logErr(`Web batch failed for ${project.name}: ${err.message}`); }
|
|
224
|
-
}
|
|
225
|
-
}
|
|
226
|
-
}
|
|
227
|
-
|
|
228
|
-
// ══════════════════════════════════════════════════════════════════════
|
|
229
|
-
// PER-SCREEN MODE — manual vite + puppeteer for web, adb for android, simctl + XCUITest for iOS
|
|
230
|
-
// ══════════════════════════════════════════════════════════════════════
|
|
231
|
-
|
|
232
|
-
async function startViteServer(dir: string): Promise<{ proc: ChildProcess; url: string }> {
|
|
233
|
-
return new Promise((resolve, reject) => {
|
|
234
|
-
const proc = spawn("npx", ["vite", "--port", "0"], {
|
|
235
|
-
cwd: dir,
|
|
236
|
-
stdio: ["pipe", "pipe", "pipe"],
|
|
237
|
-
env: { ...process.env, BROWSER: "none" },
|
|
238
|
-
});
|
|
239
|
-
|
|
240
|
-
let output = "";
|
|
241
|
-
const timeout = setTimeout(() => {
|
|
242
|
-
proc.kill();
|
|
243
|
-
reject(new Error(`Vite server timed out. Output: ${output}`));
|
|
244
|
-
}, 30_000);
|
|
245
|
-
|
|
246
|
-
const onData = (data: Buffer) => {
|
|
247
|
-
output += data.toString();
|
|
248
|
-
const match = output.match(/Local:\s+(https?:\/\/[^\s]+)/);
|
|
249
|
-
if (match) {
|
|
250
|
-
clearTimeout(timeout);
|
|
251
|
-
proc.stdout?.removeListener("data", onData);
|
|
252
|
-
proc.stderr?.removeListener("data", onData);
|
|
253
|
-
resolve({ proc, url: match[1].replace(/\/+$/, "") });
|
|
254
|
-
}
|
|
255
|
-
};
|
|
256
|
-
|
|
257
|
-
proc.stdout?.on("data", onData);
|
|
258
|
-
proc.stderr?.on("data", onData);
|
|
259
|
-
proc.on("error", (err) => { clearTimeout(timeout); reject(err); });
|
|
260
|
-
});
|
|
261
|
-
}
|
|
262
|
-
|
|
263
|
-
async function takeWebScreenshots(project: string, def: NonNullable<ProjectDef["web"]>) {
|
|
264
|
-
const outDir = join(ARTIFACTS, project, "screenshots");
|
|
265
|
-
mkdirSync(outDir, { recursive: true });
|
|
266
|
-
|
|
267
|
-
log(`Starting web server for ${project}...`);
|
|
268
|
-
const { proc, url } = await startViteServer(join(ROOT, def.dir));
|
|
269
|
-
|
|
270
|
-
try {
|
|
271
|
-
const puppeteer = await import("puppeteer");
|
|
272
|
-
const browser = await puppeteer.default.launch({ headless: "shell" });
|
|
273
|
-
try {
|
|
274
|
-
const page = await browser.newPage();
|
|
275
|
-
await page.setViewport({ width: 1280, height: 800 });
|
|
276
|
-
for (const screen of def.screens) {
|
|
277
|
-
const fullUrl = `${url}${screen.route}`;
|
|
278
|
-
log(` web/${screen.name}: ${fullUrl}`);
|
|
279
|
-
await page.goto(fullUrl, { waitUntil: "networkidle0", timeout: 15_000 });
|
|
280
|
-
try {
|
|
281
|
-
await page.waitForFunction(
|
|
282
|
-
() => (document.getElementById("root")?.children.length ?? 0) > 0,
|
|
283
|
-
{ timeout: 8_000 },
|
|
284
|
-
);
|
|
285
|
-
} catch { /* app may not use #root */ }
|
|
286
|
-
await sleep(3000);
|
|
287
|
-
await page.screenshot({ path: join(outDir, `web-${screen.name}.png`), fullPage: false });
|
|
288
|
-
logOk(` web-${screen.name}.png`);
|
|
289
|
-
}
|
|
290
|
-
} finally {
|
|
291
|
-
await browser.close();
|
|
292
|
-
}
|
|
293
|
-
} finally {
|
|
294
|
-
proc.kill();
|
|
295
|
-
}
|
|
296
|
-
}
|
|
297
|
-
|
|
298
|
-
async function takeAndroidScreenshots(project: string, def: NonNullable<ProjectDef["android"]>) {
|
|
299
|
-
const outDir = join(ARTIFACTS, project, "screenshots");
|
|
300
|
-
mkdirSync(outDir, { recursive: true });
|
|
301
|
-
|
|
302
|
-
const androidDir = join(ROOT, def.dir);
|
|
303
|
-
const adb = findAdb();
|
|
304
|
-
const serial = await getConnectedEmulator(adb);
|
|
305
|
-
|
|
306
|
-
log(`Cleaning emulator storage...`);
|
|
307
|
-
await cleanEmulatorStorage(adb, serial);
|
|
308
|
-
|
|
309
|
-
const appInfo = extractAndroidAppInfo(androidDir);
|
|
310
|
-
log(`Building Android APK for ${project}...`);
|
|
311
|
-
const apkPath = await buildApk(androidDir, appInfo.moduleName);
|
|
312
|
-
|
|
313
|
-
log(`Installing on emulator ${serial}...`);
|
|
314
|
-
await exec(`${adb} -s ${serial} install -r "${apkPath}"`, { timeout: 60_000 });
|
|
315
|
-
|
|
316
|
-
for (const screen of def.screens) {
|
|
317
|
-
log(` android/${screen.name}...`);
|
|
318
|
-
|
|
319
|
-
await adbShell(adb, serial, `am force-stop ${appInfo.applicationId}`);
|
|
320
|
-
try { await adbShell(adb, serial, `pm clear ${appInfo.applicationId}`); } catch { /* ignore */ }
|
|
321
|
-
await sleep(500);
|
|
322
|
-
|
|
323
|
-
if (screen.route) {
|
|
324
|
-
// Deep link launch
|
|
325
|
-
await adbShell(adb, serial,
|
|
326
|
-
`am start -W -a android.intent.action.VIEW -d '${screen.route}' ` +
|
|
327
|
-
`${appInfo.applicationId}/${appInfo.launchActivity}`);
|
|
328
|
-
} else {
|
|
329
|
-
// Normal launch + optional nav taps
|
|
330
|
-
await adbShell(adb, serial,
|
|
331
|
-
`am start -W -n ${appInfo.applicationId}/${appInfo.launchActivity}`);
|
|
332
|
-
}
|
|
333
|
-
await sleep(5000);
|
|
334
|
-
|
|
335
|
-
if (!screen.route && screen.nav && screen.nav.length > 0) {
|
|
336
|
-
try {
|
|
337
|
-
await navigateByTaps(adb, serial, screen.nav);
|
|
338
|
-
} catch (err: any) {
|
|
339
|
-
logErr(` Nav failed: ${err.message}`);
|
|
340
|
-
}
|
|
341
|
-
}
|
|
342
|
-
|
|
343
|
-
const outPath = join(outDir, `android-${screen.name}.png`);
|
|
344
|
-
await captureAndroidScreenshot(adb, serial, outPath);
|
|
345
|
-
logOk(` android-${screen.name}.png`);
|
|
346
|
-
}
|
|
347
|
-
}
|
|
348
|
-
|
|
349
|
-
async function takeIOSScreenshots(project: string, def: NonNullable<ProjectDef["ios"]>) {
|
|
350
|
-
const outDir = join(ARTIFACTS, project, "screenshots");
|
|
351
|
-
mkdirSync(outDir, { recursive: true });
|
|
352
|
-
|
|
353
|
-
const iosDir = join(ROOT, def.dir);
|
|
354
|
-
const appInfo = extractIOSAppInfo(iosDir);
|
|
355
|
-
const sim = findSimulator();
|
|
356
|
-
const simUdid = sim.udid;
|
|
357
|
-
|
|
358
|
-
log(`Building iOS app for ${project} (scheme: ${appInfo.schemeName})...`);
|
|
359
|
-
const appBundlePath = await buildIOSApp(iosDir, appInfo, simUdid);
|
|
360
|
-
log(`Installing on simulator...`);
|
|
361
|
-
await installAndLaunchIOS(simUdid, appBundlePath, appInfo.bundleId);
|
|
362
|
-
|
|
363
|
-
const homeScreen = def.screens.find((s) => !s.nav || s.nav.length === 0);
|
|
364
|
-
if (homeScreen) {
|
|
365
|
-
log(` ios/${homeScreen.name} (launch screenshot)...`);
|
|
366
|
-
await sleep(5000);
|
|
367
|
-
await captureIOSScreenshot(simUdid, join(outDir, `ios-${homeScreen.name}.png`));
|
|
368
|
-
logOk(` ios-${homeScreen.name}.png`);
|
|
369
|
-
}
|
|
370
|
-
|
|
371
|
-
const navScreens = def.screens.filter((s) => s.nav && s.nav.length > 0);
|
|
372
|
-
if (navScreens.length === 0) return;
|
|
373
|
-
|
|
374
|
-
log(` Generating XCUITest for ${navScreens.length} nav screens...`);
|
|
375
|
-
|
|
376
|
-
const uitestDir = join(iosDir, ".screenshot-uitest");
|
|
377
|
-
const sourcesDir = join(uitestDir, "Sources");
|
|
378
|
-
mkdirSync(sourcesDir, { recursive: true });
|
|
379
|
-
|
|
380
|
-
const testCases = navScreens.map((screen, i) => {
|
|
381
|
-
const taps = (screen.nav ?? []).map((step, j) => {
|
|
382
|
-
const escaped = step.replace(/\\/g, "\\\\").replace(/"/g, '\\"');
|
|
383
|
-
return `
|
|
384
|
-
let target_${i}_${j} = app.descendants(matching: .any).matching(NSPredicate(format: "label ==[c] %@ OR title ==[c] %@", "${escaped}", "${escaped}")).firstMatch
|
|
385
|
-
if target_${i}_${j}.waitForExistence(timeout: 5) {
|
|
386
|
-
target_${i}_${j}.tap()
|
|
387
|
-
Thread.sleep(forTimeInterval: 0.8)
|
|
388
|
-
}`;
|
|
389
|
-
}).join("\n");
|
|
390
|
-
|
|
391
|
-
const outputPath = join(outDir, `ios-${screen.name}.png`).replace(/"/g, '\\"');
|
|
392
|
-
return `
|
|
393
|
-
func test_${String(i + 1).padStart(2, "0")}_${screen.name}() {
|
|
394
|
-
let app = XCUIApplication()
|
|
395
|
-
app.launchArguments = ["-AppleLanguages", "(en)"]
|
|
396
|
-
app.launch()
|
|
397
|
-
Thread.sleep(forTimeInterval: 2.0)
|
|
398
|
-
${taps}
|
|
399
|
-
Thread.sleep(forTimeInterval: 0.5)
|
|
400
|
-
let screenshot = XCUIScreen.main.screenshot()
|
|
401
|
-
try! screenshot.pngRepresentation.write(to: URL(fileURLWithPath: "${outputPath}"))
|
|
402
|
-
}`;
|
|
403
|
-
}).join("\n");
|
|
404
|
-
|
|
405
|
-
writeFileSync(join(sourcesDir, "ScreenshotUITest.swift"),
|
|
406
|
-
`import XCTest\n\nfinal class ScreenshotUITest: XCTestCase {\n${testCases}\n}\n`);
|
|
407
|
-
|
|
408
|
-
const UITEST_TARGET = "ScreenshotUITests";
|
|
409
|
-
const hasXcodegen = existsSync(join(iosDir, "project.yml"));
|
|
410
|
-
const projectYmlPath = join(iosDir, "project.yml");
|
|
411
|
-
let originalProjectYml: string | null = null;
|
|
412
|
-
const buildDir = join(iosDir, ".build", "screenshot");
|
|
413
|
-
|
|
414
|
-
if (hasXcodegen) {
|
|
415
|
-
originalProjectYml = readFileSync(projectYmlPath, "utf-8");
|
|
416
|
-
let modifiedYml = ensureInfoPlistFlag(originalProjectYml);
|
|
417
|
-
modifiedYml = insertUITestTarget(modifiedYml, generateUITestTargetYml(appInfo, ".screenshot-uitest/Sources", true));
|
|
418
|
-
writeFileSync(projectYmlPath, modifiedYml);
|
|
419
|
-
await exec(`xcodegen generate`, { cwd: iosDir, timeout: 30_000 });
|
|
420
|
-
} else {
|
|
421
|
-
writeFileSync(join(uitestDir, "project.yml"), `name: ${UITEST_TARGET}
|
|
422
|
-
targets:
|
|
423
|
-
${UITEST_TARGET}:
|
|
424
|
-
type: bundle.ui-testing
|
|
425
|
-
platform: iOS
|
|
426
|
-
deploymentTarget: "${appInfo.deploymentTarget}"
|
|
427
|
-
sources:
|
|
428
|
-
- path: Sources
|
|
429
|
-
settings:
|
|
430
|
-
base:
|
|
431
|
-
TEST_TARGET_NAME: ${appInfo.schemeName}
|
|
432
|
-
PRODUCT_BUNDLE_IDENTIFIER: ${appInfo.bundleId}.uitests
|
|
433
|
-
GENERATE_INFOPLIST_FILE: YES
|
|
434
|
-
`);
|
|
435
|
-
await exec(`xcodegen generate`, { cwd: uitestDir, timeout: 30_000 });
|
|
436
|
-
}
|
|
437
|
-
|
|
438
|
-
const testProjectFlag = hasXcodegen
|
|
439
|
-
? (appInfo.xcodeproj ? `-project "${join(iosDir, appInfo.xcodeproj)}"` : "")
|
|
440
|
-
: `-project "${join(uitestDir, `${UITEST_TARGET}.xcodeproj`)}"`;
|
|
441
|
-
const testCwd = hasXcodegen ? iosDir : uitestDir;
|
|
442
|
-
|
|
443
|
-
try {
|
|
444
|
-
log(` Running XCUITest to capture ${navScreens.length} screens...`);
|
|
445
|
-
await exec(
|
|
446
|
-
`xcodebuild test ${testProjectFlag} -scheme "${UITEST_TARGET}" -destination "id=${simUdid}" -derivedDataPath "${buildDir}" -only-testing:${UITEST_TARGET}/ScreenshotUITest 2>&1`,
|
|
447
|
-
{ cwd: testCwd, timeout: 300_000 },
|
|
448
|
-
);
|
|
449
|
-
} catch {
|
|
450
|
-
const missing = navScreens.filter((s) => !existsSync(join(outDir, `ios-${s.name}.png`)));
|
|
451
|
-
if (missing.length > 0) {
|
|
452
|
-
logErr(` XCUITest failed for: ${missing.map((s) => s.name).join(", ")}`);
|
|
453
|
-
}
|
|
454
|
-
} finally {
|
|
455
|
-
if (originalProjectYml) {
|
|
456
|
-
writeFileSync(projectYmlPath, originalProjectYml);
|
|
457
|
-
try { await exec(`xcodegen generate`, { cwd: iosDir, timeout: 30_000 }); } catch { /* best effort */ }
|
|
458
|
-
}
|
|
459
|
-
}
|
|
460
|
-
|
|
461
|
-
for (const screen of navScreens) {
|
|
462
|
-
if (existsSync(join(outDir, `ios-${screen.name}.png`))) {
|
|
463
|
-
logOk(` ios-${screen.name}.png`);
|
|
464
|
-
}
|
|
465
|
-
}
|
|
466
|
-
}
|
|
467
|
-
|
|
468
|
-
async function runPerScreenMode() {
|
|
469
|
-
for (const project of PROJECTS) {
|
|
470
|
-
console.log(`\n\x1b[1m=== ${project.name} ===\x1b[0m\n`);
|
|
471
|
-
|
|
472
|
-
if (project.ios && (!PLATFORM_FILTER || PLATFORM_FILTER === "ios")) {
|
|
473
|
-
try { await takeIOSScreenshots(project.name, project.ios); }
|
|
474
|
-
catch (err: any) { logErr(`iOS screenshots failed for ${project.name}: ${err.message}`); }
|
|
475
|
-
}
|
|
476
|
-
|
|
477
|
-
if (project.android && (!PLATFORM_FILTER || PLATFORM_FILTER === "android")) {
|
|
478
|
-
try { await takeAndroidScreenshots(project.name, project.android); }
|
|
479
|
-
catch (err: any) { logErr(`Android screenshots failed for ${project.name}: ${err.message}`); }
|
|
480
|
-
}
|
|
481
|
-
|
|
482
|
-
if (project.web && (!PLATFORM_FILTER || PLATFORM_FILTER === "web")) {
|
|
483
|
-
try { await takeWebScreenshots(project.name, project.web); }
|
|
484
|
-
catch (err: any) { logErr(`Web screenshots failed for ${project.name}: ${err.message}`); }
|
|
485
|
-
}
|
|
486
|
-
}
|
|
487
|
-
}
|
|
488
|
-
|
|
489
|
-
// ── Main ─────────────────────────────────────────────────────────────
|
|
490
|
-
|
|
491
|
-
async function main() {
|
|
492
|
-
const mode = BATCH_MODE ? "batch" : "per-screen";
|
|
493
|
-
console.log(`\nTaking screenshots of all generated targets (${mode} mode)\n`);
|
|
494
|
-
|
|
495
|
-
if (BATCH_MODE) {
|
|
496
|
-
await runBatchMode();
|
|
497
|
-
} else {
|
|
498
|
-
await runPerScreenMode();
|
|
499
|
-
}
|
|
500
|
-
|
|
501
|
-
console.log("\n\x1b[32mDone! Screenshots saved to artifacts/\x1b[0m\n");
|
|
502
|
-
}
|
|
503
|
-
|
|
504
|
-
main().catch((err) => {
|
|
505
|
-
console.error(err);
|
|
506
|
-
process.exit(1);
|
|
507
|
-
});
|