Close iterator after rendering is complete and no more chunks remain (#11210)

* Close iterator after rendering is complete and no more chunks remain

* Wait for the first whole render before resolving

Author: matthewp

.changeset/purple-pianos-greet.md

@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Close the iterator only after rendering is complete

packages/astro/src/runtime/server/render/astro/render.ts

@@ -239,6 +239,11 @@ export async function renderToAsyncIterable(
 			if (next !== null) {
 				await next.promise;
 			}
+			// Buffer is empty so there's nothing to receive, wait for the next resolve.
+			else if(!renderingComplete && !buffer.length) {
+				next = promiseWithResolvers();
+				await next.promise;
+			}
 
 			// Only create a new promise if rendering is still ongoing. Otherwise
 			// there will be a dangling promises that breaks tests (probably not an actual app)
@@ -270,8 +275,9 @@ export async function renderToAsyncIterable(
 			buffer.length = 0;
 
 			const returnValue = {
-				// The iterator is done if there are no chunks to return.
-				done: length === 0,
+				// The iterator is done when rendering has finished
+				// and there are no more chunks to return.
+				done: length === 0 && renderingComplete,
 				value: mergedArray,
 			};
 
@@ -305,6 +311,8 @@ export async function renderToAsyncIterable(
 				// will run.
 				buffer.push(bytes);
 				next?.resolve();
+			} else if(buffer.length > 0) {
+				next?.resolve();
 			}
 		},
 	};

packages/astro/test/fixtures/partials/src/pages/partials/nested-conditional.astro

@@ -0,0 +1,12 @@
+---
+export const partial = true
+---
+
+{
+  true && (
+    <>
+      {true && <div id="true">test</div>}
+      {false && <div>test</div>}
+    </>
+  )
+}

packages/astro/test/partials.test.js

@@ -1,5 +1,6 @@
 import assert from 'node:assert/strict';
 import { after, before, describe, it } from 'node:test';
+import * as cheerio from 'cheerio';
 import { loadFixture } from './test-utils.js';
 
 describe('Partials', () => {
@@ -28,6 +29,12 @@ describe('Partials', () => {
 			const html = await fixture.fetch('/partials/item/').then((res) => res.text());
 			assert.equal(html.startsWith('<li'), true);
 		});
+
+		it('Nested conditionals render', async () => {
+			const html = await fixture.fetch('/partials/nested-conditional/').then((res) => res.text());
+			const $ = cheerio.load(html);
+			assert.equal($('#true').text(), 'test');
+		});
 	});
 
 	describe('build', () => {