@modern-js/server 1.1.5-beta.0 → 1.2.1-beta.1

package/tests/fixtures/pure/src/App.css

@@ -0,0 +1,119 @@
+html,
+body {
+  padding: 0;
+  margin: 0;
+  font-family: nunito_for_arco, Helvetica Neue, Helvetica, PingFang SC,
+    Hiragino Sans GB, Microsoft YaHei, 微软雅黑, Arial, sans-serif;
+}
+
+* {
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  box-sizing: border-box;
+}
+
+.container {
+  min-height: 100vh;
+  max-width: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+main {
+  padding: 5rem 0;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+.footer {
+  width: 100%;
+  height: 80px;
+  border-top: 1px solid #eaeaea;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: #470000;
+}
+
+.footer a {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-grow: 1;
+  color: #f4f4f4;
+  text-decoration: none;
+  font-size: 1.1rem;
+}
+
+.logo {
+  margin-bottom: 2rem;
+}
+
+.logo svg {
+  width: 450px;
+  height: 132px;
+}
+
+.description {
+  text-align: center;
+  line-height: 1.5;
+  font-size: 1.5rem;
+}
+
+.code {
+  background: #fafafa;
+  border-radius: 5px;
+  padding: 0.75rem;
+  font-size: 1.1rem;
+  font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
+    Bitstream Vera Sans Mono, Courier New, monospace;
+}
+
+@media (max-width: 600px) {
+  .grid {
+    width: 100%;
+    flex-direction: column;
+  }
+}
+
+.grid {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-wrap: wrap;
+  width: 800px;
+  margin-top: 3rem;
+}
+
+.card {
+  margin: 1rem;
+  padding: 1.5rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100px;
+  color: inherit;
+  text-decoration: none;
+  border: 1px solid #470000;
+  color: #470000;
+  transition: color 0.15s ease, border-color 0.15s ease;
+  width: 45%;
+}
+
+.card:hover,
+.card:focus,
+.card:active {
+  transform: scale(1.05);
+  transition: 0.1s ease-in-out;
+}
+
+.card h2 {
+  font-size: 1.5rem;
+  margin: 0;
+  padding: 0;
+}

package/tests/fixtures/pure/src/App.tsx

@@ -0,0 +1,43 @@
+import './App.css';
+
+const App = () => (
+  <div className="container">
+    <main>
+      <div className="logo">
+        <img
+          src="https://lf3-static.bytednsdoc.com/obj/eden-cn/ylaelkeh7nuhfnuhf/modernjs-cover.png"
+          width="300"
+          alt="Modern.js Logo"
+        />
+      </div>
+      <p className="description">
+        Get started by editing <code className="code">src/home/App.tsx</code>
+      </p>
+      <div className="grid">
+        <a href="https://modernjs.dev/docs/start" className="card">
+          <h2>Quick Start Tencent</h2>
+        </a>
+        <a href="https://modernjs.dev/docs/guides" className="card">
+          <h2>Handbook</h2>
+        </a>
+        <a href="https://modernjs.dev/docs/apis" className="card">
+          <h2>API Reference </h2>
+        </a>
+        <a
+          href="https://modernjs.dev/coming-soon"
+          target="_blank"
+          rel="noopener noreferrer"
+          className="card">
+          <h2>Community </h2>
+        </a>
+      </div>
+    </main>
+    <footer className="footer">
+      <a href="https://modernjs.dev" target="_blank" rel="noopener noreferrer">
+        Powered by Modern.js
+      </a>
+    </footer>
+  </div>
+);
+
+export default App;

package/tests/fixtures/pure/tsconfig.json

@@ -0,0 +1,13 @@
+{
+  "extends": "@modern-js/tsconfig/base",
+  "compilerOptions": {
+    "declaration": false,
+    "jsx": "preserve",
+    "baseUrl": "./",
+    "paths": {
+      "@/*": ["./src/*"],
+      "@shared/*": ["./shared/*"]
+    }
+  },
+  "include": ["src", "shared", "config"]
+}

package/tests/fixtures/route-spec/index.json

@@ -0,0 +1,29 @@
+{
+  "routes": [
+    {
+      "urlPath": "/entry",
+      "entryName": "entry",
+      "entryPath": "html/entry/index.html",
+      "isSPA": true,
+      "isSSR": true,
+      "enableModernMode": false,
+      "bundle": "bundles/entry.js"
+    },
+    {
+      "urlPath": "/home",
+      "entryName": "home",
+      "entryPath": "html/home/index.html",
+      "isSPA": true,
+      "isSSR": true,
+      "enableModernMode": false,
+      "bundle": "bundles/home.js"
+    },
+    {
+      "urlPath": "/api",
+      "isApi": true,
+      "entryPath": "",
+      "isSPA": false,
+      "isSSR": false
+    }
+  ]
+}

package/tests/helper.ts

@@ -0,0 +1,8 @@
+export const createDoc = () => `<html>
+  <head>
+    <title>mock</title>
+  </head>
+  <body>
+    <div>hello</div>
+  </body>
+  </html>`;

package/tests/hook.test.ts

@@ -0,0 +1,44 @@
+import { createRouteAPI } from '../src/libs/hook-api/route';
+import { createTemplateAPI } from '../src/libs/hook-api/template';
+import { RouteMatchManager } from '../src/libs/route';
+import { createDoc } from './helper';
+import spec from './fixtures/route-spec/index.json';
+
+describe('test hook api', () => {
+  test('should route api work correctly', () => {
+    const manager = new RouteMatchManager();
+    manager.reset(spec.routes);
+    const matcher = manager.match('/home');
+
+    const routeAPI = createRouteAPI(matcher!, manager);
+    expect(routeAPI.cur().entryName).toBe('home');
+    expect(routeAPI.get('entry')?.entryPath).toBe('html/entry/index.html');
+
+    expect(routeAPI.use('home')).toBeTruthy();
+    expect(routeAPI.cur().entryName).toBe('home');
+  });
+
+  test('should template api work correctly', () => {
+    const content = createDoc();
+    const templateAPI = createTemplateAPI(content);
+
+    expect(templateAPI.get()).toMatch(content);
+
+    templateAPI.replace('mock', 'replace');
+    expect(templateAPI.get()).toMatch('replace');
+
+    templateAPI.appendBody('after body');
+    templateAPI.prependBody('before body');
+    templateAPI.appendHead('after head');
+    templateAPI.prependHead('before head');
+
+    const newContent = templateAPI.get();
+    expect(newContent).toMatch('<head>before head');
+    expect(newContent).toMatch('<body>before body');
+    expect(newContent).toMatch('after head</head>');
+    expect(newContent).toMatch('after body</body>');
+
+    templateAPI.set('<div>empty</div>');
+    expect(templateAPI.get()).toBe('<div>empty</div>');
+  });
+});

package/tests/middleware.test.ts

@@ -0,0 +1,178 @@
+/* eslint-disable max-nested-callbacks */
+import path from 'path';
+import EventEmitter from 'events';
+import { Readable } from 'stream';
+import { createServer, Server } from 'http';
+import httpMocks from 'node-mocks-http';
+import portfinder from 'portfinder';
+import axios from 'axios';
+import { createContext } from '../src/libs/context';
+import { createStaticFileHandler } from '../src/libs/serve-file';
+import { createProxyHandler } from '../src/libs/proxy';
+
+describe('test middleware create factory', () => {
+  describe('should create static-file handler correctly', () => {
+    const middleware = createStaticFileHandler([
+      {
+        path: /static\/|upload\//,
+        target: path.join(__dirname, './fixtures/hosting-files'),
+      },
+    ]);
+
+    test('should get static file correctly', resolve => {
+      const req = httpMocks.createRequest({
+        path: '/static/index.js',
+        eventEmitter: Readable,
+      });
+      const res = httpMocks.createResponse({ eventEmitter: EventEmitter });
+      const mockContext = createContext(req, res);
+      res.on('finish', () => {
+        expect(res._getBuffer().toString().trim()).toBe(
+          "console.info('index.js');",
+        );
+        resolve();
+      });
+
+      middleware(mockContext, () => {
+        throw new Error('should not happened');
+      });
+    });
+
+    test('should miss static file correctly', resolve => {
+      const req = httpMocks.createRequest({
+        path: '/static/index.css',
+        eventEmitter: Readable,
+      });
+      const res = httpMocks.createResponse({ eventEmitter: EventEmitter });
+      const mockContext = createContext(req, res);
+      res.on('finish', () => {
+        throw new Error('should not happened');
+      });
+
+      middleware(mockContext, () => {
+        req.destroy();
+        expect(true).toBeTruthy();
+        resolve();
+      });
+    });
+  });
+
+  jest.setTimeout(1000 * 10);
+  describe('should create proxy handler correctly', () => {
+    test('should return null if no options', () => {
+      expect(createProxyHandler(null as any)).toBeNull();
+    });
+
+    let sourceServerPort = 8080;
+    let sourceServer: Server | null = null;
+    beforeAll(async () => {
+      sourceServerPort = await portfinder.getPortPromise();
+      sourceServer = createServer((req, res) => {
+        res.setHeader('Access-Control-Allow-Origin', '*');
+        res.write(req.url?.slice(1));
+        res.end();
+      }).listen(sourceServerPort);
+    });
+
+    afterAll(() => {
+      if (sourceServer) {
+        sourceServer.close();
+      }
+    });
+
+    test('should proxy correctly use simply options', async () => {
+      const port = await portfinder.getPortPromise();
+      const middlewares = createProxyHandler({
+        '/simple': `http://127.0.0.1:${sourceServerPort}`,
+      });
+      const proxyHandler = middlewares![0];
+
+      const server = createServer((req, res) => {
+        const context = createContext(req, res);
+        proxyHandler(context, () => {
+          throw new Error('should not happened');
+        });
+      }).listen(port);
+
+      try {
+        const { data } = await axios.get(`http://127.0.0.1:${port}/simple`);
+        expect(data).toBe('simple');
+      } finally {
+        server.close();
+      }
+    });
+
+    test('should proxy correctly use simply obj options', async () => {
+      const port = await portfinder.getPortPromise();
+      const middlewares = createProxyHandler({
+        '/simple-obj': {
+          target: `http://127.0.0.1:${sourceServerPort}`,
+        },
+      });
+      const proxyHandler = middlewares![0];
+
+      const server = createServer((req, res) => {
+        const context = createContext(req, res);
+        proxyHandler(context, () => {
+          throw new Error('should not happened');
+        });
+      }).listen(port);
+
+      try {
+        const { data } = await axios.get(`http://127.0.0.1:${port}/simple-obj`);
+        expect(data).toBe('simple-obj');
+      } finally {
+        server.close();
+      }
+    });
+
+    test('should proxy correctly use context options', async () => {
+      const port = await portfinder.getPortPromise();
+      const middlewares = createProxyHandler({
+        context: '/context',
+        target: `http://127.0.0.1:${sourceServerPort}`,
+      });
+      const proxyHandler = middlewares![0];
+
+      const server = createServer((req, res) => {
+        const context = createContext(req, res);
+        proxyHandler(context, () => {
+          throw new Error('should not happened');
+        });
+      }).listen(port);
+
+      try {
+        const { data } = await axios.get(`http://127.0.0.1:${port}/context`);
+        expect(data).toBe('context');
+      } finally {
+        server.close();
+      }
+    });
+
+    test('should proxy correctly use array options', async () => {
+      const port = await portfinder.getPortPromise();
+      const middlewares = createProxyHandler([
+        {
+          context: '/array',
+          target: `http://127.0.0.1:${sourceServerPort}`,
+        },
+      ]);
+      const proxyHandler = middlewares![0];
+
+      const server = createServer((req, res) => {
+        const context = createContext(req, res);
+        proxyHandler(context, () => {
+          throw new Error('should not happened');
+        });
+      }).listen(port);
+
+      try {
+        const { data } = await axios.get(`http://127.0.0.1:${port}/array`);
+        expect(data).toBe('array');
+      } finally {
+        server.close();
+      }
+    });
+  });
+});
+/* eslint-enable max-nested-callbacks */

package/tests/route.test.ts

@@ -0,0 +1,54 @@
+import { RouteMatchManager, RouteMatcher } from '../src/libs/route';
+import spec from './fixtures/route-spec/index.json';
+
+describe('test route', () => {
+  describe('test route matcher', () => {
+    test('should matcher work correctyl with simple spec', () => {
+      const routeSpec = spec.routes[0];
+      const matcher = new RouteMatcher(routeSpec);
+      expect(matcher.spec).toBe(routeSpec);
+      expect(matcher.urlPath).toBe(routeSpec.urlPath);
+      expect(matcher.urlReg).toBeUndefined();
+      expect(matcher.urlMatcher).toBeUndefined();
+
+      const { isSSR, isApi, isSPA, urlPath, entryName, entryPath } =
+        matcher.generate();
+
+      expect(isSSR).toBeTruthy();
+      expect(isApi).toBeFalsy();
+      expect(isSPA).toBeTruthy();
+      expect(urlPath).toBe(routeSpec.urlPath);
+      expect(entryName).toBe(routeSpec.entryName);
+      expect(entryPath).toBe(routeSpec.entryPath);
+
+      expect(matcher.matchEntry('entry')).toBeTruthy();
+      expect(matcher.matchEntry('home')).toBeFalsy();
+      expect(matcher.matchLength('/entry')).toBe(6);
+      expect(matcher.matchUrlPath('/entry')).toBeTruthy();
+      expect(matcher.matchUrlPath('/home')).toBeFalsy();
+    });
+  });
+
+  describe('test route manager', () => {
+    test('should manager work correctly with simple spec', async () => {
+      const manager = new RouteMatchManager();
+      expect(manager.matchers.length).toBe(0);
+      manager.reset(spec.routes);
+      expect(manager.matchers.length).toBe(3);
+
+      const matchedByEntry = manager.matchEntry('home');
+      expect(matchedByEntry).toBeDefined();
+      expect(matchedByEntry?.generate().entryName).toBe('home');
+
+      const matchedByUrl = manager.match('/entry');
+      expect(matchedByUrl).toBeDefined();
+      expect(matchedByUrl?.generate().entryName).toBe('entry');
+
+      const SSRUrlBundles = manager.getBundles();
+      expect(SSRUrlBundles).toEqual(['bundles/entry.js', 'bundles/home.js']);
+
+      manager.reset([]);
+      expect(manager.matchers.length).toBe(0);
+    });
+  });
+});

package/tests/server.test.ts

@@ -0,0 +1,89 @@
+import path from 'path';
+import { defaultsConfig, NormalizedConfig } from '@modern-js/core';
+import { ModernServerContext, NextFunction } from '@modern-js/types';
+import createServer, { Server } from '../src';
+
+describe('test server', () => {
+  test('should throw error when ', resolve => {
+    try {
+      createServer(null as any);
+    } catch (e: any) {
+      expect((e as Error).message).toBe(
+        'can not start mserver without options',
+      );
+      resolve();
+    }
+  });
+
+  test('shoule get modern server instance', async () => {
+    const server = await createServer({
+      config: defaultsConfig as NormalizedConfig,
+      pwd: path.join(__dirname, './fixtures/pure'),
+    });
+    expect(server instanceof Server).toBe(true);
+  });
+
+  describe('shoule get production modern server instance', () => {
+    const appDirectory = path.join(__dirname, './fixtures/pure');
+
+    test('should init server correctly', async () => {
+      const server = await createServer({
+        config: defaultsConfig as NormalizedConfig,
+        pwd: appDirectory,
+      });
+      const modernServer = (server as any).server;
+
+      const {
+        pwd,
+        distDir,
+        workDir,
+        conf,
+        handlers,
+        isDev,
+        staticGenerate,
+        presetRoutes,
+      } = modernServer;
+      expect(pwd).toBe(appDirectory);
+      expect(distDir).toBe(path.join(appDirectory, 'dist'));
+      expect(workDir).toBe(distDir);
+      expect(conf).toBe(defaultsConfig);
+      expect(handlers).toBeDefined();
+      expect(isDev).toBeFalsy();
+      expect(staticGenerate).toBeFalsy();
+      expect(presetRoutes).toBeUndefined();
+    });
+
+    test('should add handler correctly', async () => {
+      const server = await createServer({
+        config: defaultsConfig as NormalizedConfig,
+        pwd: appDirectory,
+      });
+      const modernServer = server.server as any;
+
+      const len = modernServer.handlers.length;
+
+      const syncHandler = (ctx: ModernServerContext, next: NextFunction) => {
+        console.info(ctx.url);
+        next();
+      };
+      modernServer.addHandler(syncHandler);
+
+      const newLen = modernServer.handlers.length;
+      expect(len + 1).toBe(newLen);
+      expect(modernServer.handlers[newLen - 1]).not.toBe(syncHandler);
+
+      const asyncHandler = async (
+        ctx: ModernServerContext,
+        next: NextFunction,
+      ) => {
+        console.info(ctx.url);
+        next();
+      };
+      modernServer.addHandler(asyncHandler);
+      const nextLen = modernServer.handlers.length;
+
+      expect(newLen + 1).toBe(nextLen);
+      expect(modernServer.handlers[nextLen - 1]).toBe(asyncHandler);
+    });
+  });
+});

package/tests/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "extends": "@modern-js/tsconfig/base",
+  "compilerOptions": {
+    "declaration": false,
+    "jsx": "preserve",
+    "baseUrl": "./",
+    "isolatedModules": true,
+    "sourceMap": true
+  },
+  "paths": {
+    "@/*": ["../src/*"]
+  },
+  "exclude": ["src/__test__/fixtures/**"]
+}

package/tests/utils.test.ts

@@ -0,0 +1,40 @@
+import {
+  noop,
+  mergeExtension,
+  toMessage,
+  createErrorDocument,
+} from '../src/utils';
+
+describe('test server utils', () => {
+  test('should get nothing from noop', async () => {
+    const rtn = noop();
+    expect(rtn).toBeUndefined();
+  });
+
+  test('should merge extension', () => {
+    const middleware = ['foo', 'baz'];
+    const extension = mergeExtension(middleware);
+    expect(extension.middleware).toEqual(middleware);
+  });
+
+  describe('test some case by toMessage func', () => {
+    test('should get message from error like object', () => {
+      const error = new Error('some error happened');
+      const message = toMessage('error info', error);
+      expect(message).toBe('error info: some error happened');
+    });
+
+    test('should get message from error message', () => {
+      const errorMsg = 'some error happened';
+      const message = toMessage('error info', errorMsg);
+      expect(message).toBe('error info: some error happened');
+    });
+  });
+
+  test('should return document text', () => {
+    const doc = createErrorDocument(302, 'redirect');
+    expect(doc).toMatch('302');
+    expect(doc).toMatch('redirect');
+    expect(doc).toMatch('302: redirect');
+  });
+});