kate522/wordpress-theme-aksrt
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(admin): replace ticket dialogs with in-page views

Browse Source 
Ticket handling on users.php?page=aksrt_tickets no longer uses dialogs.
The list, the workspace (?id=N) and the assisted create form (?view=new)
are server-rendered page views that carry the list filters and page
for going back. Writes still go through the ticket REST routes; on
success the page reloads with a native notice, and unsent drafts in
other forms survive the reload via sessionStorage. Uncertain or
conflicting writes lock every form and only offer a reload.

Remove dead code: UsersMenusTicketsDialogs, the aksrt_ticket_view AJAX
read and its nonce, dialog CSS/JS (backdrop, scroll lock, focus return,
read races) and the dialog runtime test. Fix the create link carrying
an unclamped page number on out-of-range list pages.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
kate522andClaude Fable 5 committed 2026-10-31 14:45:27 +08:00
1 parent 48e54dc115
commit d86a85e6a6
13 files changed
+720 -1264
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

tests/admin/ticket-native-render.test.cjs
+55 -42
View File
@@ -13,82 +13,94 @@ function rendered() {
return fixture;
}
test('page renders header creation action and one of each dialog, without eagerly reading conversations', () => {
const { html, initial } = rendered();
assert.equal((html.match(/<dialog /g) || []).length, 2);
assert.match(html, /aksrt-native-header__actions[^]*data-aksrt-dialog-open="aksrt-ticket-create-dialog"/);
assert.match(html, /aria-controls="aksrt-ticket-detail-dialog"/);
assert.doesNotMatch(html, /aksrt-ticket-detail-description/);
assert.match(html, /id="aksrt-ticket-create-description"/);
assert.doesNotMatch(html, /<details|detail-row|data-aksrt-ticket-detail="/);
test('list view links to page views and renders no dialogs or eager conversations', () => {
const { list, initial } = rendered();
assert.doesNotMatch(list, /<dialog|data-aksrt-dialog-open|aria-haspopup="dialog"/);
assert.match(list, /aksrt-native-header__actions[^]*href="[^"]*page=aksrt_tickets&amp;view=new&amp;status=handling&amp;ticket_type_id=1&amp;s=needle&amp;paged=2"/);
assert.match(list, /<a class="row-title" href="[^"]*page=aksrt_tickets&amp;id=21&amp;status=handling&amp;ticket_type_id=1&amp;s=needle&amp;paged=2"/);
assert.doesNotMatch(list, /data-aksrt-ticket-detail=|data-aksrt-ticket-form=/);
assert.equal(initial.detail_reads, 0);
assert.equal(initial.reply_reads, 0);
assert.equal(initial.queries.at(-1).offset, 20);
assert.equal(initial.queries.at(-1).limit, 20);
assert.deepEqual(initial.counts[0], { status: ['pending', 'handling', 'closed', 'archived'], ticket_type_id: 1, keywords: 'needle' });
assert.match(html, /status=closed&amp;ticket_type_id=1&amp;s=needle/);
assert.match(list, /status=closed&amp;ticket_type_id=1&amp;s=needle/);
});
test('detail is independently loaded even for a closed ticket outside current filters', () => {
const { closed, open } = rendered();
assert.equal(closed.status, 200);
assert.equal(closed.data.page, 2);
assert.match(closed.data.panel, /data-aksrt-ticket-detail="99"/);
assert.match(closed.data.panel, /aksrt-ticket-detail__closed/);
assert.match(closed.data.panel, /data-aksrt-ticket-form="note"/);
assert.doesNotMatch(closed.data.panel, /data-aksrt-ticket-form="(?:reply|status)"/);
assert.match(closed.data.list, /data-aksrt-ticket-view="21"/);
for (const action of ['reply', 'status', 'note']) assert.ok(open.data.panel.includes(`data-aksrt-ticket-form="${action}"`));
assert.match(open.data.panel, /action="https:\/\/example.test\/wp-json\/aksrt\/v1\/admin\/tickets\/21\/notes"/);
assert.match(open.data.panel, /data-aksrt-ticket-close-confirm/);
assert.match(open.data.panel, /value="closed" data-closed="1"/);
assert.equal(open.data.description, undefined);
assert.match(open.data.panel, /<dt>工单号<\/dt><dd>TK-00021<\/dd>/);
test('workspace loads by ID independent of list filters and keeps the list context for going back', () => {
const { open, closed, detail_list_queries: listQueries } = rendered();
assert.equal(listQueries, 0, 'workspace must not query the list');
assert.match(open, /<h1 class="aksrt-native-header__title">[^]*Question &lt;svg onload=alert\(1\)&gt;<\/h1>/);
assert.match(open, /href="[^"]*page=aksrt_tickets&amp;status=pending&amp;s=not\+in\+list&amp;paged=3"[^>]*>[^]*返回工单列表/);
assert.match(open, /data-aksrt-ticket-detail="21"/);
for (const action of ['reply', 'status', 'note']) assert.ok(open.includes(`data-aksrt-ticket-form="${action}"`));
assert.match(open, /action="https:\/\/example.test\/wp-json\/aksrt\/v1\/admin\/tickets\/21\/notes"/);
assert.match(open, /data-aksrt-ticket-close-confirm/);
assert.match(open, /value="closed" data-closed="1"/);
assert.match(open, /<dt>工单号<\/dt><dd>TK-00021<\/dd>/);
assert.match(open, /data-aksrt-ticket-feedback/);
assert.match(closed, /data-aksrt-ticket-detail="99"/);
assert.match(closed, /aksrt-ticket-detail__closed/);
assert.match(closed, /data-aksrt-ticket-form="note"/);
assert.doesNotMatch(closed, /data-aksrt-ticket-form="(?:reply|status)"/);
for (const html of [open, closed]) assert.doesNotMatch(html, /<dialog|data-aksrt-dialog-close/);
});
test('result codes render as one native notice and unknown codes are ignored', () => {
const { open, closed, bogus_notice: bogus } = rendered();
assert.match(open, /<div class="notice notice-success is-dismissible"><p>回复已发送，用户将收到通知。<\/p><\/div>/);
assert.doesNotMatch(closed, /notice-success/);
assert.doesNotMatch(bogus, /class="notice\b/);
assert.doesNotMatch(bogus, /<script>/);
});
test('ticket information owns the only status editor and closed tickets stay read-only', () => {
const { open, closed } = rendered();
const sidebarCards = panel => {
const sidebar = panel.match(/<aside\b[^>]*>([\s\S]*?)<\/aside>/)?.[1] || '';
const sidebarCards = html => {
const sidebar = html.match(/<aside\b[^>]*>([\s\S]*?)<\/aside>/)?.[1] || '';
return [...sidebar.matchAll(/<section class="aksrt-ticket-detail__card(?: [^"]+)?">([\s\S]*?)<\/section>/g)].map(match => match[1]);
};
const cards = sidebarCards(open.data.panel);
const cards = sidebarCards(open);
assert.equal(cards.length, 2, 'only ticket information and internal notes remain');
const info = cards[0];
assert.match(info, /<h3>工单信息<\/h3>/);
assert.match(info, /data-aksrt-ticket-form="status"/);
assert.match(info, /data-aksrt-ticket-assign/);
assert.match(info, /保存工单信息/);
assert.doesNotMatch(open.data.panel, /<h3[^>]*>处理工单<\/h3>/);
assert.doesNotMatch(info, /aksrt-ticket-badge/);
for (const [name, label] of [['status', '状态'], ['ticket_type_id', '部门'], ['admin_id', '跟进人']]) {
const id = `aksrt-ticket-${name}-21`;
assert.ok(info.includes(`<label for="${id}">${label}</label>`));
assert.ok(info.includes(`<select id="${id}" name="${name}"`));
assert.equal((open.data.panel.match(new RegExp(`name="${name}"`, 'g')) || []).length, 1);
assert.equal((open.match(new RegExp(`name="${name}"`, 'g')) || []).length, 1);
}
assert.match(cards[1], /内部备注/);
const closedInfo = sidebarCards(closed.data.panel)[0];
const closedInfo = sidebarCards(closed)[0];
assert.match(closedInfo, /<h3>工单信息<\/h3>/);
assert.match(closedInfo, /aksrt-ticket-badge/);
assert.doesNotMatch(closedInfo, /<form|<select|data-aksrt-ticket-assign|保存工单信息/);
});
test('read handler enforces capability, nonce and record existence', () => {
const { missing, denied, nonce } = rendered();
assert.equal(missing.status, 404);
assert.equal(denied.status, 403);
assert.equal(nonce.status, 403);
for (const result of [missing, denied, nonce]) {
assert.equal(result.success, false);
assert.equal(result.data.panel, undefined);
assert.equal(result.data.list, undefined);
}
test('missing ticket renders an empty state with a way back and no forms', () => {
const { missing } = rendered();
assert.match(missing, /工单不存在/);
assert.match(missing, /返回工单列表/);
assert.doesNotMatch(missing, /data-aksrt-ticket-form|data-aksrt-ticket-detail/);
});
test('create page is a full-page form that posts to REST and returns to the list context', () => {
const { create } = rendered();
assert.doesNotMatch(create, /<dialog|data-aksrt-dialog/);
assert.match(create, /<form method="post" action="https:\/\/example.test\/wp-json\/aksrt\/v1\/admin\/tickets" class="aksrt-tickets-admin__create-form" data-aksrt-ticket-form="create">/);
for (const name of ['user_id', 'ticket_type_id', 'title', 'order_number', 'content']) assert.ok(create.includes(`name="${name}"`), name);
assert.match(create, /data-aksrt-ticket-feedback/);
const back = /href="[^"]*page=aksrt_tickets&amp;status=pending&amp;paged=2"/g;
assert.equal((create.match(back) || []).length, 2, 'header back link and cancel both keep the list context');
});
test('real rendering escapes user content, quotes and metadata', () => {
const { html, open } = rendered();
const all = html + open.data.panel;
const { list, open } = rendered();
const all = list + open;
assert.match(all, /Question &lt;svg onload=alert\(1\)&gt;/);
assert.match(all, /Description &lt;script&gt;alert\(1\)&lt;\/script&gt;/);
assert.match(all, /Secret &lt;script&gt;alert\(1\)&lt;\/script&gt;/);
@@ -103,6 +115,7 @@ test('missing departments and disabled order links have explicit creation states
assert.match(noTypes, /尚未配置工单部门/);
assert.doesNotMatch(noTypes, /data-aksrt-ticket-form="create"/);
assert.match(noTypes, /前往工单配置/);
assert.match(noOrders, /data-aksrt-ticket-form="create"/);
assert.doesNotMatch(noOrders, /name="order_number"/);
});