feedback6: Esc in the 自选 picker closes only the picker, like its 取消 (GitHub #284 by @Xinglan233, idea from PR #286)

- The 干员调配 overlay's capture-phase Esc closed the whole overlay while a 自选 picker was open (it only gave way to a
  .modal; the picker is a .diy-pick section without its own key handling), so one Esc went back to the lobby.
- DiyPicker registers its own capture-phase Escape handler (calls onClose, as 取消 and the × do; skipped while a .modal
  — the 导入 dialog — is open, which handles Esc first); loadout.js returns early on Escape while a .diy-pick is open.
  The second Esc closes the overlay as before. Saved picks are untouched (the draft is dropped, as with 取消).
- test/ui/diy.e2e.test.js: a real-server browser test that needs no art (5阶 slot, then a 6阶 slot with Esc pressed in
  the search field): the picker closes, the overlay and its four slots stay, sp.pref.diy is unchanged, the next Esc
  closes the overlay. Fails on the parent (「Esc keeps the 干员调配 overlay」), passes here.
- Tests: SP_E2E=1 diy.e2e (the new test) 1 / 1; client-static, i18n, ui/diy*, ui/loadout* 369 / 369; eslint clean.

public/js/screens/diy.js

@@ -8,7 +8,7 @@
 // /diy.js). Out of match: the next match takes the picks. The picks live in ui/loadoutSync.js (localStorage + room.diy);
 // the model is ui/diyModel.js. Styles: css/screens/loadout.css (diy-*).
 
-import { useState } from '../../vendor/hooks.module.js';
+import { useEffect, useState } from '../../vendor/hooks.module.js';
 import { html, Icon, Button, TierChip } from '../ui/components.js';
 import { Img, RichText, BondGlyph } from '../ui/gameComponents.js';
 import { chessAvatarUrl, chessPortraitUrl, profIconUrl, skillRecordIconUrl, moduleTypeIconUrl } from '../ui/assetUrls.js';
@@ -141,6 +141,18 @@ export function DiyPicker(props) {
   const [filter, setFilter] = useState('all');
   const [query, setQuery] = useState('');
   const [draft, setDraft] = useState(cur ? { ...cur } : null);
+  // Esc cancels only the picker, like its 取消 (GitHub #284, idea from PR #286); the 干员调配 overlay's own Esc skips
+  // while a picker is open, and a dialog over the picker (导入) still takes Esc first
+  useEffect(() => {
+    const onKey = (e) => {
+      if (e.key !== 'Escape' || e.ctrlKey || e.metaKey || e.altKey || document.querySelector('.modal')) return;
+      e.preventDefault();
+      e.stopImmediatePropagation();
+      props.onClose();
+    };
+    window.addEventListener('keydown', onKey, true);
+    return () => window.removeEventListener('keydown', onKey, true);
+  }, [props.onClose]);
   return DiyPickerView({ ...props, filter, query, draft, onFilter: setFilter, onQuery: setQuery, onDraft: setDraft });
 }
 

public/js/screens/loadout.js

@@ -550,6 +550,7 @@ function LoadoutScreen({ st }) {
     const onKey = (e) => {
       if (e.ctrlKey || e.metaKey || e.altKey) return;
       if (document.querySelector('.modal')) return; // a confirm dialog handles its own keys
+      if (e.key === 'Escape' && document.querySelector('.diy-pick')) return; // the 自选 picker's Esc closes only the picker (diy.js)
       const typing = e.target && /^(INPUT|SELECT|TEXTAREA)$/.test(e.target.tagName);
       if (e.key === 'Escape') { e.preventDefault(); e.stopImmediatePropagation(); closeLoadout(); return; }
       if (typing) return;