修复中文输入法下 , / . 选词失效:认全角标点 + beforeinput 兜底

用户实测:切到「, 和 .」模式后,中文输入法下按逗号/句号,仍被当普通字符输进
搜索框,没能选词。根因是上一版判定只认半角 —— `e.key === ','` 或
`e.code === 'Comma'`,而中文输入法上屏的是全角「,」(U+FF0C) /「。」(U+3002),
且此时 e.code 不一定是 'Comma'/'Period'(取决于浏览器与输入法),于是漏判。

- isComma / isPeriod 改为以 e.key 的字符为主判据,半角 + 全角都认
  (全角句号另兼容全角句点 .U+FF0E),e.code 仅作辅助。
- 新增 beforeinput 兜底:字符即将插入文本框前触发,e.data 就是要插入的字符,
  是拦全角标点最可靠的一道 —— 有些输入法下标点根本不走可靠的 keydown。
  命中就 preventDefault(不插入)并移动选中项;仅「下拉打开 + punct/both」下生效,
  没有下拉时放行(逗号句号照常输入)。
- 新增 IME 组合态保护:打拼音时 keydown 带 isComposing(或 keyCode=229),
  这些按键属于输入法自己,不能当选词键拦下。
- keydown 与 beforeinput 可能对同一次按键都触发 → 加 punctByKeyDown 去重闸门,
  防止「跳两格」;抽出 moveSelection() 供两条路径共用。

测试(jsdom 59/59,arrows/punct/both + IME 专项各一遍):
- 核心③用「全角字符 + code 为空」的事件形态断言(上一版测试人为把 code 设成
  'Comma',恰好掩盖了这个 bug —— 本次一并修正测试盲区)。
- 覆盖 beforeinput 兜底、IME 组合态不误判、keydown+beforeinput 去重不跳两格。
反向验证三变体:A 回车套第一条 → 挂核心①;B 判定改回只认半角 → 挂核心③全角;
C 删 beforeinput 兜底 → 挂兜底断言。三者均精确命中对应断言。
e2e 128/128;线上部署 0 FAIL(82 条静态断言);线上几何 25/25;直连核验 app.js 就位。
This commit is contained in:
2026-09-28 21:01:22 +08:00
parent 13b12a3d67
commit 257c38e16a
+54 -10
View File
@@ -32,16 +32,26 @@
var seq = 0; // 请求序号:防止先发的慢响应覆盖后发的快响应 var seq = 0; // 请求序号:防止先发的慢响应覆盖后发的快响应
var items = []; // 当前展示的建议词 var items = []; // 当前展示的建议词
var active = -1; // 选中项下标(键盘 ↓/↑、,/. 与鼠标划过共用);-1 = 没选中 var active = -1; // 选中项下标(键盘 ↓/↑、,/. 与鼠标划过共用);-1 = 没选中
var punctByKeyDown = false; // 本次标点是否已由 keydown 处理(防 keydown+beforeinput 双触发跳两格)
/* 联想词的选中按键(后台「设置 → 联想词按键」): /* 联想词的选中按键(后台「设置 → 联想词按键」):
arrows(默认,等同改造前)/ punct / both */ arrows(默认,等同改造前)/ punct / both */
var keyMode = cfg.suggestKeys || 'arrows'; var keyMode = cfg.suggestKeys || 'arrows';
function acceptsArrows() { return keyMode === 'arrows' || keyMode === 'both'; } function acceptsArrows() { return keyMode === 'arrows' || keyMode === 'both'; }
function acceptsPunct() { return keyMode === 'punct' || keyMode === 'both'; } function acceptsPunct() { return keyMode === 'punct' || keyMode === 'both'; }
/* ⚠️ 认**物理键**而不是字符:中文输入法下按逗号打出的是全角「,」,e.key 会变成「,」, /* ⚠️ 中文输入法的标点坑(真实用户反馈,2026-09-28):
但 e.code 仍然是 'Comma' —— 「跟输入法一样」就该按物理键认,否则中文用户按不出来。 */ 中文输入法下按逗号/句号,上屏的是**全角** `,`(U+FF0C) / `。`(U+3002),
function isComma(e) { return e.code === 'Comma' || e.key === ','; } 而且此时 e.code **不一定**是 'Comma'/'Period'(取决于浏览器与输入法)——
function isPeriod(e) { return e.code === 'Period' || e.key === '.'; } 早先只认 `e.code === 'Comma' || e.key === ','`(半角)就是因此漏判,
结果标点被当普通字符输进了搜索框、没当成选词键。
修法:以 e.key 的**字符**为主判据,半角/全角都认,e.code 仅作辅助。
全角逗号 = `,`(U+FF0C);全角句号常见是 `。`(U+3002),另兼容全角句点 `.`(U+FF0E)。 */
function isComma(e) {
return e.key === ',' || e.key === '\uFF0C' || e.code === 'Comma';
}
function isPeriod(e) {
return e.key === '.' || e.key === '\u3002' || e.key === '\uFF0E' || e.code === 'Period';
}
function hideWord() { function hideWord() {
if (word) { word.innerHTML = ''; word.style.display = 'none'; } if (word) { word.innerHTML = ''; word.style.display = 'none'; }
@@ -93,6 +103,11 @@
}); });
input.addEventListener('keydown', function (e) { input.addEventListener('keydown', function (e) {
// ⚠️ IME 组合态保护:用中文输入法**打拼音**时也会触发 keydown(isComposing=true,
// 或 keyCode=229),那些按键属于输入法自己的候选选择,不能当成选联想词的键拦下来。
// 组合结束(拼音上屏)后 isComposing=false,下面的 , / . 选词才生效。
if (e.isComposing || e.keyCode === 229) { return; }
var open = !!word && word.style.display === 'block' && items.length > 0; var open = !!word && word.style.display === 'block' && items.length > 0;
// 移动选中项:只动高亮、不动输入框(回车时才落到输入框)。 // 移动选中项:只动高亮、不动输入框(回车时才落到输入框)。
@@ -110,12 +125,11 @@
// ⚠️ 没有下拉时**必须放行** —— 这时 , 和 . 是正常输入字符(如搜「python, pandas」)。 // ⚠️ 没有下拉时**必须放行** —— 这时 , 和 . 是正常输入字符(如搜「python, pandas」)。
if (!open) { return; } if (!open) { return; }
e.preventDefault(); // 别让光标跳到文本首尾、也别让页面跟着滚 e.preventDefault(); // 别让光标跳到文本首尾、也别让页面跟着滚
if (active < 0) { moveSelection(dir);
active = dir > 0 ? 0 : items.length - 1; // 同一次按键 keydown 已经处理过标点 → 标记一下,让紧随其后的 beforeinput 别再移一次,
} else { // 否则会「跳两格」(keydown 与 beforeinput 的真实触发组合因浏览器/输入法而异,jsdom 测不全)。
active = (active + dir + items.length) % items.length; punctByKeyDown = true;
} setTimeout(function () { punctByKeyDown = false; }, 0);
paintWord();
return; return;
} }
@@ -135,6 +149,36 @@
return; return;
} }
}); });
/* ⚠️ beforeinput 兜底 —— 专治中文输入法的全角标点(用户实测反馈,2026-09-28)。
某些输入法下,按逗号/句号上屏的是全角「,」「。」,这时:
· keydown 的 e.key 可能不是半角,e.code 也可能不是 'Comma'/'Period' → 漏判;
· 或者根本在 isComposing 组合态里被上面那道保护挡掉 → 也漏判。
beforeinput 在**字符即将插入文本框之前**触发,e.data 就是要插入的字符,
是拦全角标点最可靠的一道。命中就 preventDefault(不插入)并移动选中项。
只在「下拉打开 + punct/both 模式」下生效;没有下拉时不拦,逗号句号照常输入。 */
input.addEventListener('beforeinput', function (e) {
if (e.inputType !== 'insertText') { return; }
if (punctByKeyDown) { return; } // keydown 已处理过本次标点,别再移一次(防跳两格)
var d = e.data;
if (d === null || d === undefined) { return; }
var open = !!word && word.style.display === 'block' && items.length > 0;
if (!open || !acceptsPunct()) { return; }
var dir = 0;
if (d === ',' || d === '\uFF0C') { dir = -1; } // 半角/全角逗号
else if (d === '.' || d === '\u3002' || d === '\uFF0E') { dir = 1; } // 半角/全角句号
if (dir !== 0) { e.preventDefault(); moveSelection(dir); }
});
}
/** 移动联想下拉的选中项(keydown 与 beforeinput 共用;dir=-1 上一条 / +1 下一条) */
function moveSelection(dir) {
if (active < 0) {
active = dir > 0 ? 0 : items.length - 1;
} else {
active = (active + dir + items.length) % items.length;
}
paintWord();
} }
/* 鼠标划过某条建议 → 同步高亮(与 ↓/↑ 共用 active,回车即可确认) */ /* 鼠标划过某条建议 → 同步高亮(与 ↓/↑ 共用 active,回车即可确认) */