Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: [#1608] Fixes problem with snapshot not resulting in HTML for form and select elements #1653

Merged
merged 1 commit into from
Dec 31, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion packages/happy-dom/src/utilities/ClassMethodBinder.ts
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ export default class ClassMethodBinder {
*/
public bind(name: string | symbol): void {
// We should never bind the Symbol.iterator method as it can cause problems with Array.from()
if (this.cache.has(name) || name === Symbol.iterator) {
if (this.cache.has(name) || name === Symbol.iterator || name === 'constructor') {
return;
}

Expand All @@ -40,6 +40,10 @@ export default class ClassMethodBinder {
const descriptor = Object.getOwnPropertyDescriptor(_class.prototype, name);
if (descriptor) {
if (typeof descriptor.value === 'function') {
if (descriptor.value.toString().startsWith('class ')) {
// Do not bind classes
return;
}
Object.defineProperty(target, name, {
...descriptor,
value: descriptor.value.bind(target)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,22 @@ describe('HTMLFormElement', () => {
});
});

describe('constructor()', () => {
it('Matches snapshot.', () => {
element.innerHTML = `
<input type="text" name="text1" value="value1">
<input type="hidden" name="text2" value="value2">
<input type="checkbox" name="checkbox1" value="value1" checked>
<input type="checkbox" name="checkbox2" value="value2">
<input type="radio" name="radio1" value="value1">
<input type="radio" name="radio1" value="value2" checked>
<input type="radio" name="radio1" value="value3">
<input type="submit" name="button1">
`;
expect(element).toMatchSnapshot();
});
});

for (const property of [
'name',
'target',
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`HTMLFormElement > constructor() > Matches snapshot. 1`] = `
<form>


<input
name="text1"
type="text"
value="value1"
/>


<input
name="text2"
type="hidden"
value="value2"
/>


<input
checked=""
name="checkbox1"
type="checkbox"
value="value1"
/>


<input
name="checkbox2"
type="checkbox"
value="value2"
/>


<input
name="radio1"
type="radio"
value="value1"
/>


<input
checked=""
name="radio1"
type="radio"
value="value2"
/>


<input
name="radio1"
type="radio"
value="value3"
/>


<input
name="button1"
type="submit"
/>


</form>
`;
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,13 @@ describe('HTMLSelectElement', () => {
});
});

describe('constructor()', () => {
it('Matches snapshot.', () => {
element.innerHTML = '<option>Option 1</option><option>Option 2</option>';
expect(element).toMatchSnapshot();
});
});

describe('get options()', () => {
it('Reflects changes as options elements are added and removed from the DOM.', () => {
const option1 = <HTMLOptionElement>document.createElement('option');
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`HTMLSelectElement > constructor() > Matches snapshot. 1`] = `
<select>
<option>
Option 1
</option>
<option>
Option 2
</option>
</select>
`;
Loading