Fixed redirect issue that broke Switch tests

infernojs · Dec 23, 2022 · dcf8d9d · dcf8d9d
1 parent c60f65f
commit dcf8d9d
Show file tree

Hide file tree

Showing 3 changed files with 75 additions and 59 deletions.
diff --git a/packages/inferno-router/__tests__/Switch.spec.tsx b/packages/inferno-router/__tests__/Switch.spec.tsx
@@ -1,6 +1,7 @@
 /* tslint:disable:no-console */
-import { render, rerender } from 'inferno';
+import { render, rerender, Component } from 'inferno';
 import { MemoryRouter, Redirect, Route, Switch } from 'inferno-router';
+import { IRouteProps } from '../src/Route';
 
 describe('Switch (jsx)', () => {
   it('renders the first <Route> that matches the URL', () => {
@@ -349,48 +350,49 @@ describe('Switch (jsx)', () => {
   });
 
   // TODO: This will not work because component is not mandatory
-  // it('Should allow using component child parameter as result, Github #1601', () => {
-  //   const node = document.createElement('div');
-  //
-  //   class Component1 extends Component<any, any> {
-  //     constructor(p, s) {
-  //       super(p, s);
-  //
-  //       this.state.foo = 1;
-  //     }
-  //     public render() {
-  //       return (
-  //         <div>
-  //           Component
-  //         </div>
-  //       );
-  //     }
-  //   }
-  //
-  //   const routes: IRouteProps[] = [
-  //     {
-  //       component: Component1,
-  //       exact: true,
-  //       path: `/`
-  //     }
-  //   ];
-  //
-  //   render(
-  //     <MemoryRouter initialEntries={['/bubblegum']}>
-  //       <Switch>
-  //         {routes.map(({ path, exact, component: Comp, ...rest }) => (
-  //           <Route
-  //             key={path}
-  //             path={path}
-  //             exact={exact}
-  //             render={props => <Comp {...props} {...rest} />}
-  //           />
-  //         ))}
-  //       </Switch>
-  //     </MemoryRouter>,
-  //     node
-  //   );
-  // });
+  it('Should allow using component child parameter as result, Github #1601', () => {
+    const node = document.createElement('div');
+
+    class Component1 extends Component<any, any> {
+      state = { foo: 0 }
+      constructor(p, s) {
+        super(p, s);
+
+        this.state.foo = 1;
+      }
+      public render() {
+        return (
+          <div>
+            Component
+          </div>
+        );
+      }
+    }
+
+    const routes: IRouteProps[] = [
+      {
+        component: Component1,
+        exact: true,
+        path: `/`
+      }
+    ];
+
+    render(
+      <MemoryRouter initialEntries={['/bubblegum']}>
+        <Switch>
+          {routes.map(({ path, exact, component: Comp, ...rest }) => (
+            <Route
+              key={path}
+              path={path}
+              exact={exact}
+              render={props => <Component1 {...props} {...rest} />}
+            />
+          ))}
+        </Switch>
+      </MemoryRouter>,
+      node
+    );
+  });
 });
 
 describe('A <Switch location>', () => {

diff --git a/packages/inferno-router/src/Router.ts b/packages/inferno-router/src/Router.ts
@@ -3,7 +3,7 @@ import type { History, Location } from 'history';
 import { combineFrom, isUndefined } from 'inferno-shared';
 import { warning } from './utils';
 import { Match } from './Route';
-import { resolveLoaders } from './resolveLoaders';
+import { resolveLoaders, traverseLoaders } from './resolveLoaders';
 
 export type TLoaderProps<P extends Record<string, string>> = {
   params?: P; // Match params (if any)
@@ -88,25 +88,34 @@ export class Router extends Component<IRouterProps, any> {
     // location in componentWillMount. This happens e.g. when doing
     // server rendering using a <StaticRouter>.
     this.unlisten = history.listen(() => {
+      const loaderEntries = traverseLoaders(history.location.pathname, this.props.children);
+      const match = this.computeMatch(history.location.pathname);
+      if (loaderEntries.length === 0) {
+        this.setState({ match });
+        return;
+      }
+
       // First execution of loaders
-      resolveLoaders(history.location.pathname, this.props.children)
+      resolveLoaders(loaderEntries)
         .then((initialData) => {
           this.setState({
-            match: this.computeMatch(history.location.pathname),
-            // TODO: resolveLoaders should probably return undefined if no match
-            initialData: Object.keys(initialData).length > 0 ? initialData : undefined,
+            match,
+            initialData,
           });
         });
     });
 
     // First execution of loaders
     if (isUndefined(this.props.initialData)) {
-      resolveLoaders(history.location.pathname, this.props.children)
+      const promises = traverseLoaders(history.location.pathname, this.props.children);
+      if (promises.length > 0) {
+        resolveLoaders(promises)
         .then((initialData) => {
           this.setState({
             initialData: Object.keys(initialData).length > 0 ? initialData : undefined,
           });
         });
+      }
     }
   }
 

diff --git a/packages/inferno-router/src/resolveLoaders.ts b/packages/inferno-router/src/resolveLoaders.ts
@@ -1,20 +1,27 @@
 import { isNullOrUndef } from "inferno-shared";
 import { matchPath } from "./matchPath";
-import type { TLoaderData } from "./Router";
+import type { TLoaderData, TLoaderProps } from "./Router";
 
-export function resolveLoaders(location: string, tree: any): Promise<Record<string, TLoaderData>> {
-  const promises = traverseLoaders(location, tree).map((({path, loader}) => resolveEntry(path, loader)));
+// export function resolveLoaders(location: string, tree: any): Promise<Record<string, TLoaderData>> {
+//   const promises = traverseLoaders(location, tree).map((({path, loader}) => resolveEntry(path, loader)));
+//   return Promise.all(promises).then((result) => {
+//     return Object.fromEntries(result);
+//   });
+// }
+
+export function resolveLoaders(loaderEntries: TLoaderEntry[]): Promise<Record<string, TLoaderData>> {
+  const promises = loaderEntries.map((({path, loader}) => resolveEntry(path, loader)));
   return Promise.all(promises).then((result) => {
     return Object.fromEntries(result);
   });
 }
 
 type TLoaderEntry = {
   path: string,
-  loader: Function,
+  loader: (TLoaderProps) => Promise<TLoaderEntry>,
 }
 
-function traverseLoaders(location: string, tree: any): TLoaderEntry[] {
+export function traverseLoaders(location: string, tree: any): TLoaderEntry[] {
   // Make sure tree isn't null
   if (isNullOrUndef(tree)) return [];
 
@@ -55,9 +62,7 @@ function traverseLoaders(location: string, tree: any): TLoaderEntry[] {
 }
 
 function resolveEntry(path, loader): Promise<any> {
-  try {
-    return loader().then((res) => [path, { res }]);
-  } catch (err) {
-    return Promise.resolve([ path, { err } ]);
-  }
+  return loader()
+    .then((res) => [path, { res }])
+    .catch((err) => [ path, { err } ]);
 }