diff --git a/packages/happy-dom/src/nodes/html-form-element/HTMLFormElement.ts b/packages/happy-dom/src/nodes/html-form-element/HTMLFormElement.ts index ba7ff4c4b..88bb95d47 100644 --- a/packages/happy-dom/src/nodes/html-form-element/HTMLFormElement.ts +++ b/packages/happy-dom/src/nodes/html-form-element/HTMLFormElement.ts @@ -297,8 +297,8 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle name: string ): void { if (!this.elements.includes(node)) { - this.elements.push(node); this[this.elements.length] = node; + this.elements.push(node); (this.length) = this.elements.length; } diff --git a/packages/happy-dom/test/nodes/html-form-element/HTMLFormElement.test.ts b/packages/happy-dom/test/nodes/html-form-element/HTMLFormElement.test.ts index 277efec73..2901d8f80 100644 --- a/packages/happy-dom/test/nodes/html-form-element/HTMLFormElement.test.ts +++ b/packages/happy-dom/test/nodes/html-form-element/HTMLFormElement.test.ts @@ -96,8 +96,18 @@ describe('HTMLFormElement', () => { const elements = element.elements; const root = element.children[0]; + expect(element.length).toBe(8); expect(elements.length).toBe(8); + expect(element[0] === root.children[0]).toBe(true); + expect(element[1] === root.children[1]).toBe(true); + expect(element[2] === root.children[2]).toBe(true); + expect(element[3] === root.children[3]).toBe(true); + expect(element[4] === root.children[4]).toBe(true); + expect(element[5] === root.children[5]).toBe(true); + expect(element[6] === root.children[6]).toBe(true); + expect(element[7] === root.children[7]).toBe(true); + expect(elements[0] === root.children[0]).toBe(true); expect(elements[1] === root.children[1]).toBe(true); expect(elements[2] === root.children[2]).toBe(true); @@ -127,6 +137,11 @@ describe('HTMLFormElement', () => { radioNodeList2.push(root.children[6]); radioNodeList2.push(root.children[7]); + expect(element['text1'] === root.children[0]).toBe(true); + expect(element['button1'] === root.children[1]).toBe(true); + expect(element['checkbox1']).toEqual(radioNodeList1); + expect(element['radio1']).toEqual(radioNodeList2); + expect(elements['text1'] === root.children[0]).toBe(true); expect(elements['button1'] === root.children[1]).toBe(true); expect(elements['checkbox1']).toEqual(radioNodeList1); @@ -142,6 +157,9 @@ describe('HTMLFormElement', () => { (elements.namedItem('text1')).name = 'text2'; (elements.namedItem('text2')).id = 'text3'; + expect(element['text2'] === root.children[0]).toBe(true); + expect(element['text3'] === root.children[0]).toBe(true); + expect(elements['text2'] === root.children[0]).toBe(true); expect(elements['text3'] === root.children[0]).toBe(true); @@ -163,8 +181,18 @@ describe('HTMLFormElement', () => { root.appendChild(anotherElement); + expect(element.length).toBe(16); expect(elements.length).toBe(16); + expect(element[8] === anotherRoot.children[0]).toBe(true); + expect(element[9] === anotherRoot.children[1]).toBe(true); + expect(element[10] === anotherRoot.children[2]).toBe(true); + expect(element[11] === anotherRoot.children[3]).toBe(true); + expect(element[12] === anotherRoot.children[4]).toBe(true); + expect(element[13] === anotherRoot.children[5]).toBe(true); + expect(element[14] === anotherRoot.children[6]).toBe(true); + expect(element[15] === anotherRoot.children[7]).toBe(true); + expect(elements[8] === anotherRoot.children[0]).toBe(true); expect(elements[9] === anotherRoot.children[1]).toBe(true); expect(elements[10] === anotherRoot.children[2]).toBe(true); @@ -185,10 +213,52 @@ describe('HTMLFormElement', () => { anotherRadioNodeList2.push(anotherRoot.children[6]); anotherRadioNodeList2.push(anotherRoot.children[7]); + expect(element['anotherText1'] === anotherRoot.children[0]).toBe(true); + expect(element['anotherButton1'] === anotherRoot.children[1]).toBe(true); + expect(element['anotherCheckbox1']).toEqual(anotherRadioNodeList1); + expect(element['anotherRadio1']).toEqual(anotherRadioNodeList2); + expect(elements['anotherText1'] === anotherRoot.children[0]).toBe(true); expect(elements['anotherButton1'] === anotherRoot.children[1]).toBe(true); expect(elements['anotherCheckbox1']).toEqual(anotherRadioNodeList1); expect(elements['anotherRadio1']).toEqual(anotherRadioNodeList2); + + for (const child of root.children.slice()) { + if (child !== anotherElement) { + root.removeChild(child); + } + } + + expect(element.length).toBe(8); + expect(elements.length).toBe(8); + + expect(element[0] === anotherRoot.children[0]).toBe(true); + expect(element[1] === anotherRoot.children[1]).toBe(true); + expect(element[2] === anotherRoot.children[2]).toBe(true); + expect(element[3] === anotherRoot.children[3]).toBe(true); + expect(element[4] === anotherRoot.children[4]).toBe(true); + expect(element[5] === anotherRoot.children[5]).toBe(true); + expect(element[6] === anotherRoot.children[6]).toBe(true); + expect(element[7] === anotherRoot.children[7]).toBe(true); + + expect(elements[0] === anotherRoot.children[0]).toBe(true); + expect(elements[1] === anotherRoot.children[1]).toBe(true); + expect(elements[2] === anotherRoot.children[2]).toBe(true); + expect(elements[3] === anotherRoot.children[3]).toBe(true); + expect(elements[4] === anotherRoot.children[4]).toBe(true); + expect(elements[5] === anotherRoot.children[5]).toBe(true); + expect(elements[6] === anotherRoot.children[6]).toBe(true); + expect(elements[7] === anotherRoot.children[7]).toBe(true); + + expect(element['text1'] === undefined).toBe(true); + expect(element['button1'] === undefined).toBe(true); + expect(element['checkbox1'] === undefined).toBe(true); + expect(element['radio1'] === undefined).toBe(true); + + expect(elements['text1'] === undefined).toBe(true); + expect(elements['button1'] === undefined).toBe(true); + expect(elements['checkbox1'] === undefined).toBe(true); + expect(elements['radio1'] === undefined).toBe(true); }); });