356 行
12 KiB
TypeScript
356 行
12 KiB
TypeScript
import { expect, test, type Page, type Route, type TestInfo } from "@playwright/test";
|
|
|
|
import { ADMIN } from "./helpers/auth";
|
|
import { TEST_IDS } from "./helpers/testIds";
|
|
|
|
function envelope(data: unknown) {
|
|
return { requestId: "r92-mock", data };
|
|
}
|
|
|
|
async function fulfillJson(route: Route, data: unknown) {
|
|
await route.fulfill({
|
|
status: 200,
|
|
contentType: "application/json",
|
|
body: JSON.stringify(envelope(data)),
|
|
});
|
|
}
|
|
|
|
async function attachScreenshot(page: Page, testInfo: TestInfo, name: string) {
|
|
await testInfo.attach(name, {
|
|
body: await page.screenshot({ fullPage: true }),
|
|
contentType: "image/png",
|
|
});
|
|
}
|
|
|
|
async function mockAuthenticatedShell(page: Page) {
|
|
await page.route((url) => url.pathname === "/api/auth/sso/providers", (route) => fulfillJson(route, []));
|
|
await page.route((url) => url.pathname === "/api/auth/wecom/config", (route) =>
|
|
fulfillJson(route, {
|
|
enabled: false,
|
|
entryEnabled: false,
|
|
oauthEnabled: false,
|
|
corpId: "",
|
|
agentId: "",
|
|
loginUrl: null,
|
|
bindEnabled: false,
|
|
defaultReturnTo: "/mobile",
|
|
status: "disabled",
|
|
statusReasons: ["disabled"],
|
|
}),
|
|
);
|
|
await page.route((url) => url.pathname === "/api/auth/login", async (route) => {
|
|
await route.fulfill({
|
|
status: 200,
|
|
contentType: "application/json",
|
|
headers: { "set-cookie": "has_session=1; Path=/; SameSite=Lax" },
|
|
body: JSON.stringify(envelope({
|
|
accessToken: "r92-access-token",
|
|
expiresIn: 900,
|
|
mustChangePassword: false,
|
|
})),
|
|
});
|
|
});
|
|
await page.route((url) => url.pathname === "/api/auth/refresh", (route) =>
|
|
fulfillJson(route, {
|
|
accessToken: "r92-access-token",
|
|
expiresIn: 900,
|
|
mustChangePassword: false,
|
|
}),
|
|
);
|
|
await page.route((url) => url.pathname === "/api/me", (route) =>
|
|
fulfillJson(route, {
|
|
id: "employee-mock-1",
|
|
employeeNo: "E001",
|
|
name: "Smoke Employee",
|
|
phone: "13800000000",
|
|
email: "[email protected]",
|
|
departmentId: "dept-1",
|
|
directManagerId: null,
|
|
status: "active",
|
|
notificationPushEnabled: true,
|
|
roleCodes: ["admin"],
|
|
profileCompleteness: {
|
|
hasEmergencyContact: true,
|
|
hasBankAccount: true,
|
|
hasAvatar: false,
|
|
hasIdNumber: false,
|
|
score: 50,
|
|
},
|
|
wecomBinding: null,
|
|
}),
|
|
);
|
|
await page.route((url) => url.pathname === "/api/system/navigation", (route) =>
|
|
fulfillJson(route, {
|
|
workspace: {
|
|
id: "workspace-1",
|
|
persisted: true,
|
|
profile: "small_team_internal",
|
|
orgMode: "single_company",
|
|
primaryEntryMode: "password",
|
|
notificationStrategy: "in_app",
|
|
devicePriority: "mobile",
|
|
moduleVisibility: {},
|
|
createdAt: null,
|
|
updatedAt: null,
|
|
updatedBy: null,
|
|
},
|
|
sections: {
|
|
main: [
|
|
{ key: "portal", href: "/portal", label: "Portal", icon: "home_app_logo", placement: "main", permissionCodes: [], featureFlagKey: null },
|
|
{ key: "mobile", href: "/mobile", label: "移动工作台", icon: "phone_iphone", placement: "main", permissionCodes: [], featureFlagKey: null },
|
|
{ key: "expense", href: "/reimbursements", label: "我的报销", icon: "request_quote", placement: "main", permissionCodes: [], featureFlagKey: null },
|
|
{ key: "invoice", href: "/invoice-pool", label: "票据中心", icon: "receipt_long", placement: "main", permissionCodes: [], featureFlagKey: null },
|
|
],
|
|
admin: [],
|
|
backup: [],
|
|
},
|
|
recommendedRolePresets: [],
|
|
}),
|
|
);
|
|
await page.route((url) => url.pathname === "/api/notifications", (route) =>
|
|
fulfillJson(route, { page: 1, pageSize: 20, total: 0, unreadOnly: true, unreadCount: 0, items: [] }),
|
|
);
|
|
await page.route((url) => url.pathname === "/api/portal/home", (route) =>
|
|
fulfillJson(route, {
|
|
workspace: { id: "workspace-1", persisted: true, profile: "small_team_internal" },
|
|
greeting: { name: "Smoke Employee" },
|
|
cards: [],
|
|
pendingTasks: { count: 0, href: "/todos" },
|
|
myApplications: [],
|
|
riskSummary: null,
|
|
announcements: [],
|
|
quickLinks: [],
|
|
todayPresence: null,
|
|
teamPresence: null,
|
|
weeklyReport: null,
|
|
weeklySummary: null,
|
|
todoSummary: null,
|
|
projectSummary: null,
|
|
peopleLifecycle: null,
|
|
adoptionSummary: null,
|
|
recentActivities: [],
|
|
teamStatusBoard: [],
|
|
}),
|
|
);
|
|
}
|
|
|
|
function reimbursementListItem() {
|
|
return {
|
|
id: "19439274-66ff-4301-964d-fcb43c304454",
|
|
formNumber: null,
|
|
status: "draft",
|
|
reimbursementDate: "2026-05-05",
|
|
totalAmount: "0.00",
|
|
description: null,
|
|
payment: {
|
|
paymentVoucherNo: null,
|
|
paymentDate: null,
|
|
paymentChannel: null,
|
|
paidAt: null,
|
|
paidBy: null,
|
|
},
|
|
owner: { id: "employee-mock-1", employeeNo: "E001", name: "Smoke Employee" },
|
|
submitter: { id: "employee-mock-1", employeeNo: "E001", name: "Smoke Employee" },
|
|
project: null,
|
|
pendingWorkflow: null,
|
|
createdAt: null,
|
|
updatedAt: null,
|
|
};
|
|
}
|
|
|
|
async function mockReimbursements(page: Page) {
|
|
await page.route((url) => url.pathname === "/api/reimbursement-templates", (route) =>
|
|
fulfillJson(route, { page: 1, pageSize: 20, total: 0, items: [] }),
|
|
);
|
|
await page.route((url) => url.pathname === "/api/reimbursements/linkable-travel-requests", (route) =>
|
|
fulfillJson(route, { items: [] }),
|
|
);
|
|
await page.route((url) => url.pathname === "/api/reimbursements", (route) =>
|
|
fulfillJson(route, {
|
|
page: 1,
|
|
pageSize: 20,
|
|
total: 1,
|
|
scope: "own",
|
|
items: [reimbursementListItem()],
|
|
}),
|
|
);
|
|
}
|
|
|
|
const invoiceListItem = {
|
|
id: "invoice-pending-1",
|
|
status: "pending_ocr",
|
|
ocrType: "vat",
|
|
ocrProvider: "mock",
|
|
ocrAttempts: 0,
|
|
ocrLastError: null,
|
|
ocrCompletedAt: null,
|
|
invoiceCode: null,
|
|
invoiceNumber: null,
|
|
invoiceDate: null,
|
|
amount: null,
|
|
taxAmount: null,
|
|
totalAmount: null,
|
|
linkedReimbursementId: null,
|
|
linkedItemId: null,
|
|
linkedTravelOrderId: null,
|
|
originalName: "pending.pdf",
|
|
mimeType: "application/pdf",
|
|
fileSize: 128,
|
|
verification: null,
|
|
owner: { id: "employee-mock-1", employeeNo: "E001", name: "Smoke Employee" },
|
|
uploadedBy: { id: "employee-mock-1", employeeNo: "E001", name: "Smoke Employee" },
|
|
createdAt: null,
|
|
updatedAt: null,
|
|
};
|
|
|
|
function invoiceDetail(id: string, status: "pending_ocr" | "available" = "available") {
|
|
return {
|
|
id,
|
|
status,
|
|
archivedReason: null,
|
|
archivedAt: null,
|
|
ownerEmployeeId: "employee-mock-1",
|
|
uploadedByEmployeeId: "employee-mock-1",
|
|
originalName: `${id}.pdf`,
|
|
mimeType: "application/pdf",
|
|
fileSize: 128,
|
|
fileSha256: `sha-${id}`,
|
|
remarks: null,
|
|
ocrType: "vat",
|
|
ocrProvider: "mock",
|
|
ocrAttempts: status === "pending_ocr" ? 0 : 1,
|
|
ocrLastRequestedAt: null,
|
|
ocrLastError: null,
|
|
ocrCompletedAt: status === "pending_ocr" ? null : "2026-05-05T13:00:00.000Z",
|
|
invoiceCode: status === "available" ? "MOCKCODE" : null,
|
|
invoiceNumber: status === "available" ? "MOCKNO" : null,
|
|
invoiceDate: status === "available" ? "2026-05-05" : null,
|
|
sellerName: status === "available" ? "Mock Seller" : null,
|
|
buyerName: status === "available" ? "Mock Buyer" : null,
|
|
amount: status === "available" ? "100.00" : null,
|
|
taxAmount: status === "available" ? "10.00" : null,
|
|
totalAmount: status === "available" ? "110.00" : null,
|
|
linkedReimbursementId: null,
|
|
linkedItemId: null,
|
|
linkedTravelOrderId: null,
|
|
verification: null,
|
|
isDuplicateOverride: false,
|
|
overrideRefFormNumber: null,
|
|
overrideReason: null,
|
|
overriddenBy: null,
|
|
createdAt: null,
|
|
updatedAt: null,
|
|
};
|
|
}
|
|
|
|
async function mockInvoicePool(page: Page, uploadCounter: { value: number }) {
|
|
await page.route((url) => url.pathname === "/api/travel-requests", (route) =>
|
|
fulfillJson(route, { page: 1, pageSize: 50, total: 0, items: [] }),
|
|
);
|
|
await page.route((url) => url.pathname.startsWith("/api/invoice-pool"), (route) => {
|
|
const pathname = new URL(route.request().url()).pathname;
|
|
if (route.request().method() === "POST" && pathname === "/api/invoice-pool/upload") {
|
|
uploadCounter.value += 1;
|
|
return fulfillJson(route, {
|
|
invoicePoolId: `invoice-upload-${uploadCounter.value}`,
|
|
status: uploadCounter.value === 1 ? "pending_ocr" : "available",
|
|
fileSha256: `sha-upload-${uploadCounter.value}`,
|
|
});
|
|
}
|
|
|
|
if (pathname.endsWith("/verification")) {
|
|
return fulfillJson(route, { invoiceId: "invoice-pending-1", items: [] });
|
|
}
|
|
|
|
if (pathname === "/api/invoice-pool") {
|
|
return fulfillJson(route, {
|
|
page: 1,
|
|
pageSize: 20,
|
|
total: 1,
|
|
ownerScope: "own",
|
|
items: [invoiceListItem],
|
|
});
|
|
}
|
|
|
|
const id = pathname.split("/").at(-1) ?? "invoice-pending-1";
|
|
return fulfillJson(
|
|
route,
|
|
invoiceDetail(id, id === "invoice-pending-1" || id === "invoice-upload-1" ? "pending_ocr" : "available"),
|
|
);
|
|
});
|
|
}
|
|
|
|
async function loginThenUseMobileViewport(page: Page) {
|
|
await page.setViewportSize({ width: 1280, height: 800 });
|
|
await page.goto("/login");
|
|
await page.getByTestId(TEST_IDS.login.identifier).fill(ADMIN.identifier);
|
|
await page.getByTestId(TEST_IDS.login.password).fill(ADMIN.password);
|
|
await page.getByTestId(TEST_IDS.login.submit).click();
|
|
await expect(page).toHaveURL(/\/portal/);
|
|
await page.setViewportSize({ width: 390, height: 844 });
|
|
}
|
|
|
|
test.describe("R92 手机端票据与报销可用性", () => {
|
|
test.beforeEach(async ({ page }) => {
|
|
await mockAuthenticatedShell(page);
|
|
await mockReimbursements(page);
|
|
});
|
|
|
|
test("报销草稿在手机视口使用卡片并暴露继续编辑入口", async ({ page }, testInfo) => {
|
|
await loginThenUseMobileViewport(page);
|
|
await page.goto("/reimbursements?status=draft&scope=own");
|
|
|
|
await expect(page.getByTestId("reimbursement-mobile-card")).toBeVisible();
|
|
await expect(page.getByTestId("reimbursements-table")).toBeHidden();
|
|
|
|
const editLink = page.getByTestId("reimbursement-mobile-detail-link");
|
|
await expect(editLink).toHaveText("继续编辑");
|
|
|
|
const box = await editLink.boundingBox();
|
|
expect(box).not.toBeNull();
|
|
expect((box?.x ?? 0) + (box?.width ?? 0)).toBeLessThanOrEqual(390);
|
|
|
|
await attachScreenshot(page, testInfo, "r97-reimbursements-mobile-draft.png");
|
|
});
|
|
|
|
test("票据中心手机视口可批量选择并顺序上传", async ({ page }, testInfo) => {
|
|
const uploadCounter = { value: 0 };
|
|
await mockInvoicePool(page, uploadCounter);
|
|
await loginThenUseMobileViewport(page);
|
|
await page.goto("/invoice-pool");
|
|
|
|
await expect(page.getByTestId("invoice-mobile-row")).toBeVisible();
|
|
await expect(page.getByTestId("invoice-pool-table")).toBeHidden();
|
|
await page.getByTestId("invoice-mobile-detail-button").click();
|
|
await expect(page.getByTestId("invoice-detail-panel")).toBeVisible();
|
|
await expect(page.getByText("票据详情")).toBeVisible();
|
|
await attachScreenshot(page, testInfo, "r97-invoice-pool-mobile.png");
|
|
|
|
await page.getByTestId("invoice-upload-file").setInputFiles([
|
|
{ name: "invoice-a.pdf", mimeType: "application/pdf", buffer: Buffer.from("%PDF-a") },
|
|
{ name: "invoice-b.pdf", mimeType: "application/pdf", buffer: Buffer.from("%PDF-b") },
|
|
]);
|
|
await expect(page.getByText("已选择 2 个文件")).toBeVisible();
|
|
await page.getByTestId("invoice-upload-submit").click();
|
|
|
|
await expect.poll(() => uploadCounter.value).toBe(2);
|
|
});
|
|
|
|
test("手机票据上传页支持一次选择多张并逐张上传", async ({ page }, testInfo) => {
|
|
const uploadCounter = { value: 0 };
|
|
await mockInvoicePool(page, uploadCounter);
|
|
await loginThenUseMobileViewport(page);
|
|
await page.goto("/mobile/capture");
|
|
|
|
await page.getByTestId("mobile-capture-pdf-file").setInputFiles([
|
|
{ name: "mobile-a.pdf", mimeType: "application/pdf", buffer: Buffer.from("%PDF-a") },
|
|
{ name: "mobile-b.pdf", mimeType: "application/pdf", buffer: Buffer.from("%PDF-b") },
|
|
]);
|
|
await expect(page.getByText("已选择 2 个")).toBeVisible();
|
|
await attachScreenshot(page, testInfo, "r97-mobile-capture-multi-upload.png");
|
|
await page.getByTestId("mobile-capture-upload").click();
|
|
|
|
await expect.poll(() => uploadCounter.value).toBe(2);
|
|
});
|
|
});
|