Commit27f340b

authored

Fix rendering waterfall of suspended components in a single Suspense boundary (#413)

1 parent81e7da3 commit27f340bCopy full SHA for 27f340b

File tree

3 files changed

+49

-15

lines changed

.changeset
- long-ties-brake.md
src
- index.js
test/compat
- async.test.jsx

3 files changed

+49

-15

lines changed

`‎.changeset/long-ties-brake.md‎`

Lines changed: 5 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,5 @@`
	`1`	`+---`
	`2`	`+'preact-render-to-string':patch`
	`3`	`+---`
	`4`	`+`
	`5`	`+Fix async rendering of multiple suspended components in a single Suspense boundary`

`‎src/index.js‎`

Lines changed: 2 additions & 15 deletions

Original file line number	Diff line number	Diff line change
`@@ -542,21 +542,8 @@ function _renderToString(`
`542`	`542`	`:result;`
`543`	`543`	`}catch(e){`
`544`	`544`	`if(!e\|\|typeofe.then!='function')throwe;`
`545`		`-`
`546`		`-returne.then(()=>{`
`547`		`-constresult=_renderToString(`
`548`		`-rendered,`
`549`		`-context,`
`550`		`-isSvgMode,`
`551`		`-selectValue,`
`552`		`-vnode,`
`553`		`-asyncMode,`
`554`		`-renderer`
`555`		`-);`
`556`		`-returnvnode._suspended`
`557`		`-?BEGIN_SUSPENSE_DENOMINATOR+result+END_SUSPENSE_DENOMINATOR`
`558`		`-:result;`
`559`		`-},renderNestedChildren);`
	`545`	`+`
	`546`	`+returne.then(renderNestedChildren);`
`560`	`547`	`}`
`561`	`548`	`};`
`562`	`549`

`‎test/compat/async.test.jsx‎`

Lines changed: 42 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -254,6 +254,48 @@ describe('Async renderToString', () => {`
`254`	`254`	`expect(rendered).to.equal(expected);`
`255`	`255`	`});`
`256`	`256`
	`257`	`+it('should render JSX with multiple suspended direct children within a single suspense boundary that resolve one-after-another',async()=>{`
	`258`	`+const{`
	`259`	`+Suspender:SuspenderOne,`
	`260`	`+suspended:suspendedOne`
	`261`	`+}=createSuspender();`
	`262`	`+const{`
	`263`	`+Suspender:SuspenderTwo,`
	`264`	`+suspended:suspendedTwo`
	`265`	`+}=createSuspender();`
	`266`	`+const{`
	`267`	`+Suspender:SuspenderThree,`
	`268`	`+suspended:suspendedThree`
	`269`	`+}=createSuspender();`
	`270`	`+`
	`271`	`+constpromise=renderToStringAsync(`
	`272`	`+<ul>`
	`273`	`+<Suspensefallback={null}>`
	`274`	`+<SuspenderOne>`
	`275`	`+<li>one</li>`
	`276`	`+</SuspenderOne>`
	`277`	`+<SuspenderTwo>`
	`278`	`+<li>two</li>`
	`279`	`+</SuspenderTwo>`
	`280`	`+<SuspenderThree>`
	`281`	`+<li>three</li>`
	`282`	`+</SuspenderThree>`
	`283`	`+</Suspense>`
	`284`	`+</ul>`
	`285`	`+);`
	`286`	`+`
	`287`	+constexpected=`<ul><!--$s--><li>one</li><!--/$s--><!--$s--><li>two</li><!--/$s--><!--$s--><li>three</li><!--/$s--></ul>`;
	`288`	`+`
	`289`	`+suspendedOne.promise.then(()=>{voidsuspendedTwo.resolve();});`
	`290`	`+suspendedTwo.promise.then(()=>{voidsuspendedThree.resolve();});`
	`291`	`+`
	`292`	`+suspendedOne.resolve();`
	`293`	`+`
	`294`	`+constrendered=awaitpromise;`
	`295`	`+`
	`296`	`+expect(rendered).to.equal(expected);`
	`297`	`+});`
	`298`	`+`
`257`	`299`	`it('should rethrow error thrown after suspending',async()=>{`
`258`	`300`	`const{ suspended, getResolved}=createSuspender();`
`259`	`301`

0 commit comments

Comments

(0)

Movatterモバイル変換

Navigation Menu

Search code, repositories, users, issues, pull requests...

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

Commit27f340b

File tree

3 files changed

3 files changed

`‎.changeset/long-ties-brake.md‎`

`‎src/index.js‎`

`‎test/compat/async.test.jsx‎`

0 commit comments