Mirrors/gitea
0
0
Fork 0
mirror of https://github.com/go-gitea/gitea.git synced 2025-11-04 12:53:43 +01:00
Code Issues Activity

Fix form property assignment edge case (#35073) (#35078)

Browse Source 
Backport #35073 by wxiaoguang

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
Giteabot 2025-07-15 09:40:50 +08:00 committed by GitHub
parent 12bfa9e83d
commit ab3d2a944c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 27 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
web_src/js/features/common-button.test.ts
View File

@ -1,12 +1,23 @@
import {assignElementProperty} from './common-button.ts';
import {assignElementProperty, type ElementWithAssignableProperties} from './common-button.ts';
test('assignElementProperty', () => {
const elForm = document.createElement('form');
assignElementProperty(elForm, 'action', '/test-link');
expect(elForm.action).contains('/test-link'); // the DOM always returns absolute URL
expect(elForm.getAttribute('action')).eq('/test-link');
assignElementProperty(elForm, 'text-content', 'dummy');
expect(elForm.textContent).toBe('dummy');
// mock a form with its property "action" overwritten by an input element
const elFormWithAction = new class implements ElementWithAssignableProperties {
action = document.createElement('input'); // now "form.action" is not string, but an input element
_attrs: Record<string, string> = {};
setAttribute(name: string, value: string) { this._attrs[name] = value }
getAttribute(name: string): string | null { return this._attrs[name] }
}();
assignElementProperty(elFormWithAction, 'action', '/bar');
expect(elFormWithAction.getAttribute('action')).eq('/bar');
const elInput = document.createElement('input');
expect(elInput.readOnly).toBe(false);
assignElementProperty(elInput, 'read-only', 'true');

22
web_src/js/features/common-button.ts
View File

@ -102,18 +102,26 @@ function onHidePanelClick(el: HTMLElement, e: MouseEvent) {
throw new Error('no panel to hide'); // should never happen, otherwise there is a bug in code
}
export function assignElementProperty(el: any, name: string, val: string) {
name = camelize(name);
const old = el[name];
export type ElementWithAssignableProperties = {
getAttribute: (name: string) => string | null;
setAttribute: (name: string, value: string) => void;
} & Record<string, any>
export function assignElementProperty(el: ElementWithAssignableProperties, kebabName: string, val: string) {
const camelizedName = camelize(kebabName);
const old = el[camelizedName];
if (typeof old === 'boolean') {
el[name] = val === 'true';
el[camelizedName] = val === 'true';
} else if (typeof old === 'number') {
el[name] = parseFloat(val);
el[camelizedName] = parseFloat(val);
} else if (typeof old === 'string') {
el[name] = val;
el[camelizedName] = val;
} else if (old?.nodeName) {
// "form" has an edge case: its "<input name=action>" element overwrites the "action" property, we can only set attribute
el.setAttribute(kebabName, val);
} else {
// in the future, we could introduce a better typing system like `data-modal-form.action:string="..."`
throw new Error(`cannot assign element property ${name} by value ${val}`);
throw new Error(`cannot assign element property "${camelizedName}" by value "${val}"`);
}
}