Revert "fix(platform-server): insert transfer state script before other script tags (#48868)" (#49112)

alan-agius4 · AndrewKushnir · commit 2d51b5f64446 · 2023-02-17T11:09:21.000-08:00
This reverts commit 2fc5b70 as this change is no longer needed since `type=module` script are deferred by default. Which causes the transfer data to be queried after the browser has finished parsing the DOM. PR Close #49112
diff --git a/packages/platform-server/src/transfer_state.ts b/packages/platform-server/src/transfer_state.ts
@@ -35,14 +35,11 @@ function serializeTransferStateFactory(doc: Document, appId: string, transferSto
     script.id = appId + '-state';
     script.setAttribute('type', 'application/json');
     script.textContent = escapeHtml(content);
-    const existingScript = doc.body.querySelector('script');
-    if (existingScript) {
-      // Insert the state script before any script so that the the script is available
-      // before Angular is bootstrapped as otherwise this can causes the state not to be present.
-      existingScript.before(script);
-    } else {
-      doc.body.appendChild(script);
-    }
+
+    // It is intentional that we add the script at the very bottom. Angular CLI script tags for
+    // bundles are always `type="module"`. These are deferred by default and cause the transfer
+    // transfer data to be queried only after the browser has finished parsing the DOM.
+    doc.body.appendChild(script);
   };
 }
 
diff --git a/packages/platform-server/test/transfer_state_spec.ts b/packages/platform-server/test/transfer_state_spec.ts
@@ -83,36 +83,4 @@ describe('transfer_state', () => {
     const output = await renderModule(TransferStoreModule, {document: '<app></app>'});
     expect(output).toBe(defaultExpectedOutput);
   });
-
-  it('adds transfer script tag before any existing script tags', async () => {
-    const STATE_KEY = makeStateKey<number>('test');
-
-    @Component({selector: 'app', template: 'Works!'})
-    class TransferComponent {
-      constructor(private transferStore: TransferState) {
-        this.transferStore.onSerialize(STATE_KEY, () => 10);
-      }
-    }
-
-    @NgModule({
-      bootstrap: [TransferComponent],
-      declarations: [TransferComponent],
-      imports: [BrowserModule.withServerTransition({appId: 'transfer'}), ServerModule],
-    })
-    class TransferStoreModule {
-    }
-
-    const output = await renderModule(TransferStoreModule, {
-      document: '<app></app><script src="polyfills.js"></script><script src="main.js"></script>'
-    });
-    expect(output).toContain(
-        '<body>' +
-        '<app ng-version="0.0.0-PLACEHOLDER" ng-server-context="other">Works!</app>' +
-        '<script id="transfer-state" type="application/json">' +
-        '{&q;test&q;:10}' +
-        '</script>' +
-        '<script src="polyfills.js"></script>' +
-        '<script src="main.js"></script>' +
-        '</body>');
-  });
 });
