fix(ssr): html with single quote parse error

jest.config.js

@@ -1,7 +1,7 @@
 module.exports = {
   // disable css files mock for bundler-webpack's css import tests
   moduleNameMapper: {},
-  transformIgnorePatterns: ['/node_modules/'],
+  transformIgnorePatterns: ['/node_modules/(?!.*@babel)[^/]+?/'],
   collectCoverageFrom(memo) {
     return memo.concat([
       // benchmarks

packages/preset-built-in/package.json

@@ -29,7 +29,7 @@
     "@types/merge-stream": "1.1.2",
     "@types/multer": "1.4.3",
     "@types/react-router-config": "5.0.1",
-    "@types/serialize-javascript": "4.0.0",
+    "@types/serialize-javascript": "5.0.0",
     "@umijs/babel-preset-umi": "3.3.7",
     "@umijs/bundler-webpack": "3.3.7",
     "@umijs/renderer-mpa": "3.3.7",

packages/preset-built-in/src/fixtures/ssr-dynamicImport/pages/Bar.tsx

@@ -7,7 +7,7 @@ const Bar = props => {
   );
 };
 
-Bar.getInitialProps = async () => {
+Bar.getInitialProps = () => {
   return {
     title: 'Bar',
   };

packages/preset-built-in/src/index.test.ts

@@ -15,9 +15,7 @@ beforeEach(() => {
   }
 });
 
-afterEach(() => {
-  cleanup();
-});
+afterEach(cleanup);
 
 test('api.writeTmpFile error in register stage', async () => {
   const cwd = join(fixtures, 'api-writeTmpFile');
@@ -394,6 +392,7 @@ xtest('ssr dynamicImport', async () => {
     'p__Bar.css': '/p__Bar.chunk.css',
   };
 
+  // without webpack, so export default
   const render = require(tmpServerFile).default;
   // render /
   const homeResult = await render({

packages/preset-built-in/src/plugins/features/ssr/ssr.ts

@@ -1,6 +1,7 @@
 import * as fs from 'fs';
 import assert from 'assert';
 import * as path from 'path';
+import serialize from 'serialize-javascript';
 import { performance } from 'perf_hooks';
 import { Route } from '@umijs/core';
 import { IApi, BundlerConfigType } from '@umijs/types';
@@ -157,7 +158,7 @@ export default (api: IApi) => {
         ManifestFileName: api.config.manifest
           ? api.config.manifest.fileName || 'asset-manifest.json'
           : '',
-        DEFAULT_HTML_PLACEHOLDER: JSON.stringify(defaultHTML),
+        DEFAULT_HTML_PLACEHOLDER: serialize(defaultHTML),
       }),
     });
 

packages/preset-built-in/src/plugins/features/ssr/templates/renderServer/renderServer.tsx

@@ -65,7 +65,7 @@ export const loadPageGetInitialProps = async ({ ctx,
       // preload for dynamicImport
       if (Component?.preload) {
         const preloadComponent = await Component.preload();
-        Component = preloadComponent.default || preloadComponent;
+        Component = preloadComponent?.default || preloadComponent;
       }
 
       if (Component && (Component as any)?.getInitialProps) {

packages/preset-built-in/src/plugins/features/ssr/templates/server.tpl

@@ -50,7 +50,6 @@ const render: IServerRender = async (params) => {
     const history = createMemoryHistory({
       initialEntries: [format(location)],
     });
-
     /**
      * beforeRenderServer hook, for polyfill global.*
      */
@@ -104,7 +103,6 @@ const render: IServerRender = async (params) => {
         manifest = requireFunc(`./{{{ ManifestFileName }}}`);
       } catch (_) {}
     }
-
     // renderServer get rootContainer
     const { pageHTML, pageInitialProps, routesMatched } = await renderServer(opts);
     rootContainer = pageHTML;

packages/renderer-mpa/src/renderClient/renderClient.test.tsx

@@ -11,11 +11,11 @@ beforeEach(() => {
   document.body.appendChild(container);
 });
 
-afterEach(() => {
+afterEach(async () => {
   document.body.removeChild(container);
   // @ts-ignore
   container = null;
-  cleanup();
+  await cleanup();
 });
 
 test('normal', () => {

packages/renderer-react/src/renderClient/renderClient.test.tsx

@@ -13,12 +13,12 @@ beforeEach(() => {
   window.g_initialProps = null;
 });
 
-afterEach(() => {
+afterEach(async () => {
   document.body.removeChild(container);
   container = null;
   delete window.g_useSSR;
   delete window.g_initialProps;
-  cleanup();
+  await cleanup();
 });
 
 test('normal', async () => {

packages/renderer-react/src/renderRoutes/renderRoutes.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { MemoryRouter, Plugin, Link } from '@umijs/runtime';
-import { getByText, render, screen, waitFor } from '@testing-library/react';
+import { getByText, render, screen, waitFor, cleanup } from '@testing-library/react';
 import renderRoutes from './renderRoutes';
 import { IRoute } from '..';
 
@@ -206,9 +206,10 @@ beforeEach(() => {
   renderCount = 0;
 });
 
-afterEach(() => {
+afterEach(async () => {
   delete window.g_useSSR;
   delete window.g_initialProps;
+  await cleanup();
 });
 
 test('/layout', async () => {
@@ -290,38 +291,6 @@ test('/pass-props', async () => {
   expect((await screen.findByTestId('test')).innerHTML).toEqual('bar');
 });
 
-test('/get-initial-props', async () => {
-  const newRoutes = renderRoutes(routerConfig);
-  const { container } = render(
-    <MemoryRouter initialEntries={['/get-initial-props']}>
-      {newRoutes}
-    </MemoryRouter>,
-  );
-  await waitFor(() => getByText(container, 'bar'));
-  expect((await screen.findByTestId('test')).innerHTML).toEqual('bar');
-});
-
-test('/get-initial-props-without-unmount', async () => {
-  const newRoutes = renderRoutes(routerConfig);
-  const { container } = render(
-    <MemoryRouter initialEntries={['/get-initial-props-without-unmount']}>
-      {newRoutes}
-    </MemoryRouter>,
-  );
-  await waitFor(() => getByText(container, 'bar'));
-  expect((await screen.findByTestId('test2')).innerHTML).toEqual('bar');
-  expect(mountCount).toEqual(0);
-  // hash change
-  getByText(container, 'link-bar').click();
-  expect(mountCount).toEqual(0);
-
-  // change route
-  getByText(container, 'change-route').click();
-  expect(mountCount).toEqual(1);
-  await waitFor(() => getByText(container, 'bar'));
-  expect((await screen.findByTestId('test')).innerHTML).toEqual('bar');
-});
-
 test('/get-initial-props-with-mount', async () => {
   const newRoutes = renderRoutes(routerConfig);
 
@@ -355,7 +324,7 @@ test('/get-initial-props-embed', async () => {
   );
 });
 
-test('/wrappers', async () => {
+test('/wrappers', () => {
   const { container } = render(
     <MemoryRouter initialEntries={['/wrappers']}>{routes}</MemoryRouter>,
   );

yarn.lock

@@ -3279,10 +3279,10 @@
   resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.3.4.tgz#43d7168fec6fa0988bb1a513a697b29296721afb"
   integrity sha512-+nVsLKlcUCeMzD2ufHEYuJ9a2ovstb6Dp52A5VsoKxDXgvE051XgHI/33I1EymwkRGQkwnA0LkhnUzituGs4EQ==
 
-"@types/serialize-javascript@4.0.0":
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/@types/serialize-javascript/-/serialize-javascript-4.0.0.tgz#ab9c47edf71f6a4590221118d1dffc37b50d71a2"
-  integrity sha512-y9UO8ozDGF30EVRizmsXuCdZzAxHmYpEEiL+/SQjX+7bnxslkvZQU8rLydixJv7yVae6bWyrNDFHsh6fYHkFMA==
+"@types/serialize-javascript@5.0.0":
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/@types/serialize-javascript/-/serialize-javascript-5.0.0.tgz#127638567bd9f11251ad0ca2d9d9ea9ce5ca4b93"
+  integrity sha512-2+ai0/OTduvDzJHRAcqDwgNwshL1TN+iAfjzJJogXPSSjTBuqPl7MI0xGqCcPx+PDFbvmziiK1H6bjDb4DcoSA==
 
 "@types/serve-static@*":
   version "1.13.8"