refactor: form binding validation (#38832)

Make "form-fetch-action" highlight the invalid field as "error"
This commit is contained in:
wxiaoguang
2026-08-10 01:25:31 +00:00
committed by GitHub
parent b5aa8c4ff0
commit 9c915e4e1a
27 changed files with 411 additions and 323 deletions
@@ -1,4 +1,6 @@
import {execPseudoSelectorCommands, handleFetchActionSuccessJson} from './common-fetch-action.ts';
import {execPseudoSelectorCommands, handleFetchActionErrorFields, handleFetchActionSuccessJson} from './common-fetch-action.ts';
import {createElementFromHTML} from '../utils/dom.ts';
import {normalizeTestHtml} from '../utils/testhelper.ts';
test('execPseudoSelectorCommands', () => {
window.document.body.innerHTML = `
@@ -57,3 +59,15 @@ test('handleFetchActionSuccessJson', async () => {
expect(spyReload).toHaveBeenCalledTimes(1);
vi.resetAllMocks();
});
test('handleFetchActionErrorFields', () => {
const elForm = createElementFromHTML<HTMLElement>(`<form>
<div class="error field"></div>
<div class="field"><input name="Foo_Bar[]"></div>
</form>`);
handleFetchActionErrorFields(elForm, ['foo-BAR', 'other']);
expect(normalizeTestHtml(elForm.outerHTML)).toEqual(normalizeTestHtml(`<form>
<div class="field"></div>
<div class="field error"><input name="Foo_Bar[]"></div>
</form>`));
});