From 7d55b000526a28caa1f249acdc65c6ddec551f51 Mon Sep 17 00:00:00 2001 From: Jovi De Croock Date: Thu, 18 Apr 2024 16:09:21 +0200 Subject: [PATCH 1/7] respect default value --- src/diff/index.js | 2 ++ test/browser/hydrate.test.js | 6 ++++++ test/browser/render.test.js | 9 ++++++++- 3 files changed, 16 insertions(+), 1 deletion(-) diff --git a/src/diff/index.js b/src/diff/index.js index 6289a9bd4d..2bcb7be778 100644 --- a/src/diff/index.js +++ b/src/diff/index.js @@ -443,6 +443,7 @@ function diffElementNodes( } else if (i == 'dangerouslySetInnerHTML') { oldHtml = value; } else if (i !== 'key' && !(i in newProps)) { + if (i == 'value' && 'defaultValue' in newProps) continue; setProperty(dom, i, null, value, isSvg); } } @@ -524,6 +525,7 @@ function diffElementNodes( // again, which triggers IE11 to re-evaluate the select value (nodeType === 'option' && inputValue !== oldProps[i])) ) { + console.log('setting', i); setProperty(dom, i, inputValue, oldProps[i], false); } diff --git a/test/browser/hydrate.test.js b/test/browser/hydrate.test.js index b03c0e2a66..b27155507d 100644 --- a/test/browser/hydrate.test.js +++ b/test/browser/hydrate.test.js @@ -57,6 +57,12 @@ describe('hydrate()', () => { teardown(scratch); }); + it('should respect defaultValue in hydrate', () => { + scratch.innerHTML = ''; + hydrate(, scratch); + expect(scratch.firstChild.value).to.equal('foo'); + }); + it('should reuse existing DOM', () => { const onClickSpy = sinon.spy(); const html = ul([li('1'), li('2'), li('3')]); diff --git a/test/browser/render.test.js b/test/browser/render.test.js index 822f864f21..51f632b02d 100644 --- a/test/browser/render.test.js +++ b/test/browser/render.test.js @@ -1,5 +1,5 @@ import { setupRerender } from 'preact/test-utils'; -import { createElement, render, Component, options } from 'preact'; +import { createElement, render, Component, options, hydrate } from 'preact'; import { setupScratch, teardown, @@ -472,6 +472,13 @@ describe('render()', () => { expect(scratch.firstChild.spellcheck).to.equal(false); }); + // Test for preactjs/preact#651 + it('should respect defaultValue in render', () => { + scratch.innerHTML = ''; + render(, scratch); + expect(scratch.firstChild.value).to.equal('foo'); + }); + it('should render download attribute', () => { render(, scratch); expect(scratch.firstChild.getAttribute('download')).to.equal(''); From e9beb7d8bd63c4ddc902319e18e2177c01c2f2f7 Mon Sep 17 00:00:00 2001 From: Jovi De Croock Date: Thu, 18 Apr 2024 16:11:11 +0200 Subject: [PATCH 2/7] Update src/diff/index.js --- src/diff/index.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/diff/index.js b/src/diff/index.js index 2bcb7be778..77e94f9e45 100644 --- a/src/diff/index.js +++ b/src/diff/index.js @@ -525,7 +525,6 @@ function diffElementNodes( // again, which triggers IE11 to re-evaluate the select value (nodeType === 'option' && inputValue !== oldProps[i])) ) { - console.log('setting', i); setProperty(dom, i, inputValue, oldProps[i], false); } From d501beafa0ebc22f447b1ffdb6bf4d6cb7eed2af Mon Sep 17 00:00:00 2001 From: Jovi De Croock Date: Thu, 18 Apr 2024 16:11:23 +0200 Subject: [PATCH 3/7] Update test/browser/render.test.js --- test/browser/render.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/browser/render.test.js b/test/browser/render.test.js index 51f632b02d..0f60552409 100644 --- a/test/browser/render.test.js +++ b/test/browser/render.test.js @@ -1,5 +1,5 @@ import { setupRerender } from 'preact/test-utils'; -import { createElement, render, Component, options, hydrate } from 'preact'; +import { createElement, render, Component, options } from 'preact'; import { setupScratch, teardown, From 0b7ed35c9f494d7a3c29339e24245d4df967fde8 Mon Sep 17 00:00:00 2001 From: Jovi De Croock Date: Thu, 18 Apr 2024 16:12:14 +0200 Subject: [PATCH 4/7] comments --- test/browser/hydrate.test.js | 1 + test/browser/render.test.js | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/test/browser/hydrate.test.js b/test/browser/hydrate.test.js index b27155507d..250e9411af 100644 --- a/test/browser/hydrate.test.js +++ b/test/browser/hydrate.test.js @@ -57,6 +57,7 @@ describe('hydrate()', () => { teardown(scratch); }); + // Test for preactjs/preact#4340 it('should respect defaultValue in hydrate', () => { scratch.innerHTML = ''; hydrate(, scratch); diff --git a/test/browser/render.test.js b/test/browser/render.test.js index 0f60552409..ff436456f4 100644 --- a/test/browser/render.test.js +++ b/test/browser/render.test.js @@ -472,7 +472,7 @@ describe('render()', () => { expect(scratch.firstChild.spellcheck).to.equal(false); }); - // Test for preactjs/preact#651 + // Test for preactjs/preact#4340 it('should respect defaultValue in render', () => { scratch.innerHTML = ''; render(, scratch); From d517a7702a91167c009bb4ae9afb2f3155a0e2f0 Mon Sep 17 00:00:00 2001 From: Jovi De Croock Date: Thu, 18 Apr 2024 16:14:52 +0200 Subject: [PATCH 5/7] add test --- test/browser/render.test.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/test/browser/render.test.js b/test/browser/render.test.js index ff436456f4..03c8327bf3 100644 --- a/test/browser/render.test.js +++ b/test/browser/render.test.js @@ -479,6 +479,15 @@ describe('render()', () => { expect(scratch.firstChild.value).to.equal('foo'); }); + // Test for preactjs/preact#4340 + it('should support subsequent renders', () => { + scratch.innerHTML = ''; + render(, scratch); + expect(scratch.firstChild.value).to.equal('bar'); + render(, scratch); + expect(scratch.firstChild.value).to.equal('baz'); + }); + it('should render download attribute', () => { render(, scratch); expect(scratch.firstChild.getAttribute('download')).to.equal(''); From 39b80369a5caa29acd07fcbf1394f8d0a4cb9a75 Mon Sep 17 00:00:00 2001 From: Jovi De Croock Date: Thu, 18 Apr 2024 16:17:16 +0200 Subject: [PATCH 6/7] add checked --- src/diff/index.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/diff/index.js b/src/diff/index.js index 77e94f9e45..7840ce640f 100644 --- a/src/diff/index.js +++ b/src/diff/index.js @@ -443,7 +443,11 @@ function diffElementNodes( } else if (i == 'dangerouslySetInnerHTML') { oldHtml = value; } else if (i !== 'key' && !(i in newProps)) { - if (i == 'value' && 'defaultValue' in newProps) continue; + if ( + (i == 'value' && 'defaultValue' in newProps) || + (i == 'checked' && 'defaultChecked' in newProps) + ) + continue; setProperty(dom, i, null, value, isSvg); } } From da61334347f35f8417174492c728cce85d99f2c0 Mon Sep 17 00:00:00 2001 From: Jovi De Croock Date: Thu, 18 Apr 2024 16:28:58 +0200 Subject: [PATCH 7/7] feedback --- src/diff/index.js | 3 ++- test/browser/hydrate.test.js | 6 ++++++ test/browser/render.test.js | 17 +++++++++++++++-- 3 files changed, 23 insertions(+), 3 deletions(-) diff --git a/src/diff/index.js b/src/diff/index.js index 7840ce640f..3766beb7d1 100644 --- a/src/diff/index.js +++ b/src/diff/index.js @@ -446,8 +446,9 @@ function diffElementNodes( if ( (i == 'value' && 'defaultValue' in newProps) || (i == 'checked' && 'defaultChecked' in newProps) - ) + ) { continue; + } setProperty(dom, i, null, value, isSvg); } } diff --git a/test/browser/hydrate.test.js b/test/browser/hydrate.test.js index 250e9411af..4603e0cdf9 100644 --- a/test/browser/hydrate.test.js +++ b/test/browser/hydrate.test.js @@ -64,6 +64,12 @@ describe('hydrate()', () => { expect(scratch.firstChild.value).to.equal('foo'); }); + it('should respect defaultChecked in hydrate', () => { + scratch.innerHTML = ''; + hydrate(, scratch); + expect(scratch.firstChild.checked).to.equal(true); + }); + it('should reuse existing DOM', () => { const onClickSpy = sinon.spy(); const html = ul([li('1'), li('2'), li('3')]); diff --git a/test/browser/render.test.js b/test/browser/render.test.js index 03c8327bf3..a861271afe 100644 --- a/test/browser/render.test.js +++ b/test/browser/render.test.js @@ -479,8 +479,7 @@ describe('render()', () => { expect(scratch.firstChild.value).to.equal('foo'); }); - // Test for preactjs/preact#4340 - it('should support subsequent renders', () => { + it('should support subsequent renders w/ defaultValue', () => { scratch.innerHTML = ''; render(, scratch); expect(scratch.firstChild.value).to.equal('bar'); @@ -488,6 +487,20 @@ describe('render()', () => { expect(scratch.firstChild.value).to.equal('baz'); }); + it('should respect defaultChecked in render', () => { + scratch.innerHTML = ''; + render(, scratch); + expect(scratch.firstChild.checked).to.equal(true); + }); + + it('should support subsequent renders w/ defaultChecked', () => { + scratch.innerHTML = ''; + render(, scratch); + expect(scratch.firstChild.checked).to.equal(true); + render(, scratch); + expect(scratch.firstChild.checked).to.equal(false); + }); + it('should render download attribute', () => { render(, scratch); expect(scratch.firstChild.getAttribute('download')).to.equal('');