@shuvi/platform-web 1.0.39 → 1.0.42

package/esm/shuvi-app/app/client.js

@@ -43,16 +43,14 @@ export const createApp = ({ routes, appData, appComponent }) => {
     });
     const loadersData = app.getLoadersData();
     const hasHydrateData = Object.keys(loadersData).length > 0;
-    let shouldHydrate = ssr && hasHydrateData;
-    let hasServerError = !!app.error;
+    let shouldHydrate = !!ssr;
     router.beforeResolve((to, from, next) => __awaiter(void 0, void 0, void 0, function* () {
+        // when hydrating, we will never run loaders, but just use the data from server
         if (shouldHydrate) {
             shouldHydrate = false;
-            app.setLoadersData(loadersData);
-            return next();
-        }
-        if (hasServerError) {
-            hasServerError = false;
+            if (hasHydrateData) {
+                app.setLoadersData(loadersData);
+            }
             return next();
         }
         if (!to.matches.length) {
@@ -113,10 +111,7 @@ export const createApp = ({ routes, appData, appComponent }) => {
                     window.location.replace(location);
                 }
                 else {
-                    next({
-                        path: location,
-                        replace: true
-                    });
+                    next(location);
                 }
                 runLoadersTrace.setAttribute(SHUVI_CLIENT_RUN_LOADERS.attrs.errorType.name, 'redirect');
                 runLoadersTrace.stop();
@@ -132,6 +127,8 @@ export const createApp = ({ routes, appData, appComponent }) => {
                 runLoadersTrace.stop();
                 return;
             }
+            runLoadersTrace.setAttribute(SHUVI_CLIENT_RUN_LOADERS.attrs.errorType.name, 'unexpectedError');
+            runLoadersTrace.stop();
             // If loader throws a error, we need to rethrow it
             app.setError({
                 message: SHUVI_ERROR.CLIENT_ERROR.message,
@@ -141,8 +138,6 @@ export const createApp = ({ routes, appData, appComponent }) => {
             next(() => {
                 throw error;
             });
-            runLoadersTrace.setAttribute(SHUVI_CLIENT_RUN_LOADERS.attrs.errorType.name, 'unexpectedError');
-            runLoadersTrace.stop();
             return;
         }
         next(() => {

package/esm/shuvi-app/app/server.js

@@ -51,6 +51,8 @@ export const createApp = options => {
                 if (isRedirect(error)) {
                     const location = error.headers.get('Location');
                     const status = error.status;
+                    // server side redirect is different from regular route redirect because it has the extra data - statusCode
+                    // So it won't change route target, but just store the redirect location in state
                     next({
                         path: pathToString(to),
                         replace: true,

package/esm/shuvi-app/react/AppContainer.jsx

@@ -1,13 +1,10 @@
 import * as React from 'react';
-import { useCurrentRoute, useRouter } from '@shuvi/router-react';
 import { errorModel, errorModelName } from '@shuvi/platform-shared/shared';
 import { AppProvider } from './ApplicationContext';
 import ErrorPage from './ErrorPage';
 import { ErrorBoundary } from './ErrorBoundary';
 import { Provider, useSharedModel } from './store';
-import { clientRenderTrace } from '../entry/client/trace';
-import { CLIENT_RENDER } from '@shuvi/shared/constants/trace';
-const { SHUVI_NAVIGATION_TRIGGERED, SHUVI_NAVIGATION_DONE, SHUVI_PAGE_READY } = CLIENT_RENDER.events;
+import { Trace } from './Trace';
 function ErrorGuard({ children = null }) {
     const errorState = useSharedModel(errorModelName, errorModel);
     const { error, hasError } = errorState;
@@ -16,46 +13,13 @@ function ErrorGuard({ children = null }) {
     }
     return <>{children}</>;
 }
-const uuid = () => {
-    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
-        var r = (Math.random() * 16) | 0, v = c == 'x' ? r : (r & 0x3) | 0x8;
-        return v.toString(16);
-    });
-};
-function useTrace() {
-    const router = useRouter();
-    const route = useCurrentRoute();
-    let navigationTrace = React.useRef();
-    React.useEffect(() => {
-        clientRenderTrace.traceChild(SHUVI_PAGE_READY.name).stop();
-        router.beforeEach((to, from, next) => {
-            const fromPath = `${from.pathname}${from.search}`;
-            const toPath = `${to.pathname}${to.search}`;
-            const navigationId = uuid();
-            const traceAttrs = {
-                [SHUVI_NAVIGATION_DONE.attrs.from.name]: fromPath,
-                [SHUVI_NAVIGATION_DONE.attrs.to.name]: toPath,
-                [SHUVI_NAVIGATION_DONE.attrs.navigationId.name]: navigationId
-            };
-            clientRenderTrace
-                .traceChild(SHUVI_NAVIGATION_TRIGGERED.name, traceAttrs)
-                .stop();
-            navigationTrace.current = clientRenderTrace.traceChild(SHUVI_NAVIGATION_DONE.name);
-            navigationTrace.current.setAttributes(traceAttrs);
-            next();
-        });
-    }, []);
-    React.useEffect(() => {
-        var _a;
-        (_a = navigationTrace.current) === null || _a === void 0 ? void 0 : _a.stop();
-    }, [route]);
-}
 export default function AppContainer({ app, children }) {
-    useTrace();
     return (<AppProvider app={app}>
       <ErrorBoundary>
         <Provider store={app.store}>
-          <ErrorGuard>{children}</ErrorGuard>
+          <ErrorGuard>
+            <Trace>{children}</Trace>
+          </ErrorGuard>
         </Provider>
       </ErrorBoundary>
     </AppProvider>);

package/esm/shuvi-app/react/Trace.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare function useTrace(): void;
+export declare function Trace({ children }: React.PropsWithChildren<{}>): JSX.Element;

package/esm/shuvi-app/react/Trace.jsx

@@ -0,0 +1,43 @@
+import * as React from 'react';
+import { useCurrentRoute, useRouter } from '@shuvi/router-react';
+import { clientRenderTrace } from '../entry/client/trace';
+import { CLIENT_RENDER } from '@shuvi/shared/constants/trace';
+const { SHUVI_NAVIGATION_TRIGGERED, SHUVI_NAVIGATION_DONE, SHUVI_PAGE_READY } = CLIENT_RENDER.events;
+const uuid = () => {
+    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
+        var r = (Math.random() * 16) | 0, v = c == 'x' ? r : (r & 0x3) | 0x8;
+        return v.toString(16);
+    });
+};
+export function useTrace() {
+    const router = useRouter();
+    const route = useCurrentRoute();
+    let navigationTrace = React.useRef();
+    React.useEffect(() => {
+        clientRenderTrace.traceChild(SHUVI_PAGE_READY.name).stop();
+        router.beforeEach((to, from, next) => {
+            const fromPath = `${from.pathname}${from.search}`;
+            const toPath = `${to.pathname}${to.search}`;
+            const navigationId = uuid();
+            const traceAttrs = {
+                [SHUVI_NAVIGATION_DONE.attrs.from.name]: fromPath,
+                [SHUVI_NAVIGATION_DONE.attrs.to.name]: toPath,
+                [SHUVI_NAVIGATION_DONE.attrs.navigationId.name]: navigationId
+            };
+            clientRenderTrace
+                .traceChild(SHUVI_NAVIGATION_TRIGGERED.name, traceAttrs)
+                .stop();
+            navigationTrace.current = clientRenderTrace.traceChild(SHUVI_NAVIGATION_DONE.name);
+            navigationTrace.current.setAttributes(traceAttrs);
+            next();
+        });
+    }, []);
+    React.useEffect(() => {
+        var _a;
+        (_a = navigationTrace.current) === null || _a === void 0 ? void 0 : _a.stop();
+    }, [route]);
+}
+export function Trace({ children = null }) {
+    useTrace();
+    return <>{children}</>;
+}

package/lib/node/features/filesystem-routes/api/middleware.js

@@ -43,9 +43,11 @@ function middleware(_ctx) {
                 catch (error) {
                     runApiMiddlewareTrace.setAttributes({
                         [SHUVI_SERVER_RUN_API_MIDDLEWARE.attrs.error.name]: true,
-                        [SHUVI_SERVER_RUN_API_MIDDLEWARE.attrs.statusCode.name]: res.statusCode
+                        [SHUVI_SERVER_RUN_API_MIDDLEWARE.attrs.statusCode.name]: 500
                     });
+                    runApiMiddlewareTrace.stop();
                     next(error);
+                    return;
                 }
                 runApiMiddlewareTrace.setAttributes({
                     [SHUVI_SERVER_RUN_API_MIDDLEWARE.attrs.error.name]: false,

package/lib/node/features/filesystem-routes/middleware/middleware.js

@@ -15,8 +15,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.middleware = void 0;
 const router_1 = require("@shuvi/router");
 const resources_1 = __importDefault(require("@shuvi/service/lib/resources"));
-const trace_1 = require("@shuvi/shared/constants/trace");
-const { SHUVI_SERVER_RUN_MIDDLEWARE_ROUTES } = trace_1.SERVER_REQUEST.events;
+const trace_1 = require("@shuvi/service/lib/trace");
+const trace_2 = require("@shuvi/shared/constants/trace");
+const { SHUVI_SERVER_RUN_MIDDLEWARE_ROUTES } = trace_2.SERVER_REQUEST.events;
 function middleware(_api) {
     return function (req, res, next) {
         return __awaiter(this, void 0, void 0, function* () {
@@ -64,7 +65,17 @@ function middleware(_api) {
                         return next(err);
                     }
                 });
-                return yield runMiddleware(middlewares[i]);
+                yield runMiddleware(middlewares[i]);
+                // if a middleware directly ends the response, the middlewareRoutesTrace will be recorded here
+                if (middlewareRoutesTrace.status === trace_1.SpanStatus.Started) {
+                    middlewareRoutesTrace.setAttributes({
+                        [SHUVI_SERVER_RUN_MIDDLEWARE_ROUTES.attrs.error.name]: false,
+                        [SHUVI_SERVER_RUN_MIDDLEWARE_ROUTES.attrs.statusCode.name]: res.statusCode,
+                        [SHUVI_SERVER_RUN_MIDDLEWARE_ROUTES.attrs.headersSent.name]: res.headersSent
+                    });
+                    middlewareRoutesTrace.stop();
+                }
+                return;
             }
             catch (err) {
                 /** Catch error from the whole function */

package/lib/node/features/html-render/lib/getPageMiddleware.js

@@ -57,7 +57,7 @@ function createPageHandler(serverPluginContext) {
                 sendHtmlHookTrace.stop();
             }
             else {
-                // shuold never reach here
+                // should never reach here
                 throw new Error('Unexpected reponse type from renderToHTML');
             }
         });
@@ -90,6 +90,7 @@ function getPageMiddleware(api) {
                     runPageMiddlewareTrace.stop();
                 }
                 catch (error) {
+                    // should never reach here except for server bundle broken
                     runPageMiddlewareTrace.setAttributes({
                         [SHUVI_SERVER_RUN_PAGE_MIDDLEWARE.attrs.error.name]: true,
                         [SHUVI_SERVER_RUN_PAGE_MIDDLEWARE.attrs.statusCode.name]: res.statusCode

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shuvi/platform-web",
-  "version": "1.0.39",
+  "version": "1.0.42",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/shuvijs/shuvi.git",
@@ -72,15 +72,15 @@
   },
   "dependencies": {
     "@next/react-refresh-utils": "12.1.6",
-    "@shuvi/error-overlay": "1.0.39",
-    "@shuvi/hook": "1.0.39",
-    "@shuvi/platform-shared": "1.0.39",
-    "@shuvi/router": "1.0.39",
-    "@shuvi/router-react": "1.0.39",
-    "@shuvi/runtime": "1.0.39",
-    "@shuvi/shared": "1.0.39",
-    "@shuvi/toolpack": "1.0.39",
-    "@shuvi/utils": "1.0.39",
+    "@shuvi/error-overlay": "1.0.42",
+    "@shuvi/hook": "1.0.42",
+    "@shuvi/platform-shared": "1.0.42",
+    "@shuvi/router": "1.0.42",
+    "@shuvi/router-react": "1.0.42",
+    "@shuvi/runtime": "1.0.42",
+    "@shuvi/shared": "1.0.42",
+    "@shuvi/toolpack": "1.0.42",
+    "@shuvi/utils": "1.0.42",
     "content-type": "1.0.4",
     "core-js": "3.6.5",
     "doura": "0.0.13",
@@ -98,7 +98,7 @@
     "whatwg-fetch": "3.0.0"
   },
   "peerDependencies": {
-    "@shuvi/service": "1.0.39"
+    "@shuvi/service": "1.0.42"
   },
   "devDependencies": {
     "@shuvi/service": "workspace:*",