456
expect(container.innerHTML).toBe('{}');
457
});
458
459
+ it('should resolve deduped objects in blocked models referencing other blocked models with blocked references', async () => {
460
+ let resolveFooClientComponentChunk;
461
+ let resolveBarClientComponentChunk;
462
+
463
+ function PassthroughServerComponent({children}) {
464
+ return children;
465
+ }
466
+
467
+ const FooClient = clientExports(
468
+ function FooClient({children}) {
469
+ return JSON.stringify(children);
470
+ },
471
+ '1',
472
+ '/foo.js',
473
+ new Promise(resolve => (resolveFooClientComponentChunk = resolve)),
474
+ );
475
+
476
+ const BarClient = clientExports(
477
+ function BarClient() {
478
+ return 'not used';
479
+ },
480
+ '2',
481
+ '/bar.js',
482
+ new Promise(resolve => (resolveBarClientComponentChunk = resolve)),
483
+ );
484
+
485
+ const shared = {foo: 1};
486
+
487
+ function Server() {
488
+ return (
489
+ <>
490
+ <PassthroughServerComponent>
491
+ <FooClient key="first" bar={BarClient}>
492
+ {shared}
493
+ </FooClient>
494
+ </PassthroughServerComponent>
495
+ <FooClient key="second" bar={BarClient}>
496
+ {shared}
497
+ </FooClient>
498
+ </>
499
+ );
500
+ }
501
+
502
+ const stream = await serverAct(() =>
503
+ ReactServerDOMServer.renderToReadableStream(<Server />, webpackMap),
504
+ );
505
+
506
+ function ClientRoot({response}) {
507
+ return use(response);
508
+ }
509
+
510
+ const response = ReactServerDOMClient.createFromReadableStream(stream);
511
+ const container = document.createElement('div');
512
+ const root = ReactDOMClient.createRoot(container);
513
+
514
+ await act(() => {
515
+ root.render(<ClientRoot response={response} />);
516
+ });
517
+
518
+ expect(container.innerHTML).toBe('');
519
+
520
+ await act(() => {
521
+ resolveFooClientComponentChunk();
522
+ resolveBarClientComponentChunk();
523
+ });
524
+
525
+ expect(container.innerHTML).toBe('{"foo":1}{"foo":1}');
526
+ });
527
+
528
it('should progressively reveal server components', async () => {
529
let reportedErrors = [];
530