fix(user): align badge modals with reference theme

tests/widget-system/user-badge-actions.test.cjs

@@ -0,0 +1,95 @@
+const assert = require('node:assert/strict');
+const fs = require('node:fs');
+const path = require('node:path');
+const test = require('node:test');
+const vm = require('node:vm');
+
+const source = fs.readFileSync(path.join(__dirname, '../../assets/js/user-badge-actions.js'), 'utf8');
+
+function fixture(type = 'wear') {
+  const modal = {};
+  const classes = new Set();
+  const attributes = { 'data-aksrt-badge-action': type, 'data-slug': 'helper', 'data-user-id': '42' };
+  const button = {
+    innerHTML: '佩戴此徽章',
+    classList: {
+      contains: (name) => classes.has(name),
+      add: (name) => classes.add(name),
+      remove: (name) => classes.delete(name),
+    },
+    closest: () => modal,
+    getAttribute: (name) => attributes[name] || null,
+    setAttribute: (name, value) => { attributes[name] = value; },
+    removeAttribute: (name) => { delete attributes[name]; },
+  };
+  let listener;
+  let resolve;
+  let active = modal;
+  const requests = [];
+  const notices = [];
+  const closed = [];
+  const document = { addEventListener: (type, callback) => { listener = callback; } };
+  const window = {
+    aksrtData: { nonce: 'nonce', ajaxUrl: '/admin-ajax.php' },
+    notyf: (...args) => notices.push(args),
+    fetch: (url, options) => {
+      requests.push({ url, options });
+      return new Promise((done) => { resolve = done; });
+    },
+    AksrtModalRuntime: { getActive: () => active, close: (reason) => closed.push(reason) },
+  };
+  vm.runInNewContext(source, { window, document, URLSearchParams, Error });
+  return {
+    button, requests, notices, closed,
+    click: () => listener({ target: { closest: () => button }, preventDefault() {} }),
+    complete: async (json) => {
+      resolve({ json: async () => json });
+      await new Promise((done) => setImmediate(done));
+    },
+    changeModal: () => { active = {}; },
+  };
+}
+
+test('wear submits once, shows progress, and closes only its dialog without reloading', async () => {
+  const ui = fixture();
+  ui.click();
+  ui.click();
+  assert.equal(ui.requests.length, 1);
+  const body = new URLSearchParams(ui.requests[0].options.body);
+  assert.equal(body.get('action'), 'aksrt_user_medal_wear');
+  assert.equal(body.get('nonce'), 'nonce');
+  assert.equal(body.get('slug'), 'helper');
+  assert.equal(body.has('id'), false);
+  assert.match(ui.button.innerHTML, /loading/);
+  assert.equal(ui.button.getAttribute('aria-busy'), 'true');
+  assert.equal(ui.notices[0][1], 'load');
+  await ui.complete({ success: true, data: { message: '已佩戴徽章' } });
+  assert.deepEqual(ui.closed, ['badge-action']);
+  assert.equal(ui.button.innerHTML, '佩戴此徽章');
+  assert.equal(ui.button.getAttribute('aria-disabled'), null);
+  assert.equal(ui.notices.at(-1)[1], 'success');
+});
+
+test('grant and revoke submit the selected user; rejected actions keep the dialog usable', async () => {
+  for (const type of ['grant', 'revoke']) {
+    const ui = fixture(type);
+    ui.click();
+    const body = new URLSearchParams(ui.requests[0].options.body);
+    assert.equal(body.get('id'), '42');
+    assert.equal(body.get('action'), type === 'grant' ? 'aksrt_user_medal_manually_add' : 'aksrt_user_medal_manually_remove');
+    await ui.complete({ success: false, data: { message: '暂无此权限' } });
+    assert.equal(ui.closed.length, 0);
+    assert.equal(ui.button.getAttribute('aria-busy'), null);
+    assert.equal(ui.button.classList.contains('is-loading'), false);
+    assert.equal(ui.button.innerHTML, '佩戴此徽章');
+    assert.equal(ui.notices.at(-1)[0], '暂无此权限');
+  }
+});
+
+test('a late successful mutation cannot close a different dialog', async () => {
+  const ui = fixture();
+  ui.click();
+  ui.changeModal();
+  await ui.complete({ success: true });
+  assert.equal(ui.closed.length, 0);
+});