Sander/docs hotfix (scullyio#647)

* fix(scully): fix config handling when option `--404=''`

* docs(docsWeb): hotfix for not building routes

* fix(scully): read wrong folder for source files

apps/scully-docs/src/app/components/left-menu/left-menu.component.ts

@@ -3,11 +3,14 @@ import { Component, Input } from '@angular/core';
 @Component({
   selector: 'app-left-menu',
   templateUrl: './left-menu.component.html',
-  styleUrls: ['./left-menu.component.css']
+  styleUrls: ['./left-menu.component.css'],
 })
 export class LeftMenuComponent {
   @Input() set list(_list: any[]) {
-    this.fullList.push(..._list);
+    if (Array.isArray(_list)) {
+      this.fullList.push(..._list);
+    }
+
     this.changeLang();
   }
   @Input() first = true;
@@ -19,8 +22,8 @@ export class LeftMenuComponent {
   changeLang() {
     this.showList = [];
     if (this.fullList) {
-      this.fullList.forEach(post => {
-        if (post.lang === this.lang) {
+      this.fullList.forEach((post) => {
+        if (post && post.lang === this.lang) {
           this.showList.push(post);
         }
       });

docs/getting-started.md

@@ -47,7 +47,7 @@ export const config: ScullyConfig = {
   projectRoot: './src',
   projectName: '<projectName>',
   outDir: './dist/static',
-  routes: {}
+  routes: {},
 };
 ```
 
@@ -97,7 +97,7 @@ This message indicates that Scully has skept any unconfigured routes. Read more
 
 Once the app is built with Scully, see the output and test how it runs as a statically generated webpage.
 
-To see the pre-rendered site, open the `/dist/static` folder where you can find one `index.html` for every route in your app. Hence, if the application has 1000 routes, there should be 1000 `index.html` files in the `dist/static` folder. 
+To see the pre-rendered site, open the `/dist/static` folder where you can find one `index.html` for every route in your app. Hence, if the application has 1000 routes, there should be 1000 `index.html` files in the `dist/static` folder.
 These `index.html` files are jamstack-packed with HTML and CSS. This means that Scully built successfully, and that your site is now pre-rendered.
 
 Scully provides a server, so that you can test out your jamstack site after the Scully build. To launch Scully's test server, run the following command:

docs/plugin/jsonPlugin.md

@@ -23,10 +23,10 @@ export const config: ScullyConfig = {
       type: 'json',
       userId: {
         url: 'http://localhost:8200/users',
-        property: 'id'
-      }
-    }
-  }
+        property: 'id',
+      },
+    },
+  },
 };
 ```
 
@@ -52,10 +52,10 @@ export const config: ScullyConfig = {
         url: 'https://my-api.com/todos',
         property: 'id',
         headers: {
-          'API-KEY': '0123456789'
-        }
-      }
-    }
-  }
+          'API-KEY': '0123456789',
+        },
+      },
+    },
+  },
 };
 ```

docs/utils.md → docs/util.md

@@ -9,8 +9,8 @@ lang: en
 Scully works well in combination with other tools and utilities, for example:
 
 - [Utilities](#utilities)
-- [Github Action: Scully Publish](#github-action-scully-publish)
-- [Syntax Highlighting Using Prismjs](#syntax-highlighting-using-prismjs)
+  - [Github Action: Scully Publish](#github-action-scully-publish)
+  - [Syntax Highlighting Using Prismjs](#syntax-highlighting-using-prismjs)
 
 ## Github Action: Scully Publish
 

libs/scully/src/lib/renderPlugins/puppeteerRenderPlugin.ts

@@ -166,9 +166,10 @@ export const puppeteerRender = async (route: HandledRoute): Promise<string> => {
       throw new Error(`Route "${route.route}" render to ${path}`);
     }
 
-    const firstTitle = await page.evaluate(
-      () => document.querySelector('h1').innerText
-    );
+    const firstTitle = await page.evaluate(() => {
+      const d = document.querySelector('h1');
+      return (d && d.innerText) || '';
+    });
     if (firstTitle === title404) {
       logWarn(`Route "${yellow(route.route)}" not provided by angular app`);
     }

libs/scully/src/lib/utils/serverstuff/handleUnknownRoute.ts

@@ -15,6 +15,16 @@ export const handleUnknownRoute: RequestHandler = async (req, res, next) => {
   if (req.accepts('html')) {
     /** only handle 404 on html requests specially  */
     await loadConfig;
+    const distIndex = join(
+      scullyConfig.homeFolder,
+      scullyConfig.distFolder,
+      '/index.html'
+    );
+    const dist404 = join(
+      scullyConfig.homeFolder,
+      scullyConfig.distFolder,
+      '/404.html'
+    );
     // cmd-line takes precedence over config
     const h404 = (handle404.trim() === '' ? scullyConfig.handle404 : handle404)
       .trim()
@@ -24,22 +34,22 @@ export const handleUnknownRoute: RequestHandler = async (req, res, next) => {
       case '':
         const myHandledRoutes = loadHandledRoutes();
         if (myHandledRoutes.includes(req.url)) {
-          return res.sendFile(join(scullyConfig.outDir, '/index.html'));
+          return res.sendFile(distIndex);
         }
         break;
       case 'onlybase':
       case 'baseonly':
         const unhandledRoutes = await handleTravesal();
         if (unhandledRoutes.find(matchRoute(req))) {
           /** this is a base route known by Scully, just return the index */
-          return res.sendFile(join(scullyConfig.outDir, '/index.html'));
+          return res.sendFile(distIndex);
         }
         /** use fallthrough as all of those are served by the above route-machers, and only here if the route is 404 */
         break;
       case 'index':
-        return res.sendFile(join(scullyConfig.outDir, '/index.html'));
+        return res.sendFile(distIndex);
       case '404':
-        return res.sendFile(join(scullyConfig.outDir, '/404.html'));
+        return res.sendFile(dist404);
       case 'none':
         /** let express do its default thing, don't alter behavior */
         return next();

scully.scully-docs.config.ts

@@ -10,14 +10,19 @@ export const config: ScullyConfig = {
   projectRoot: './apps/scully-docs/src',
   projectName: 'scully-docs',
   outDir: './dist/static/doc-sites',
+  distFolder: './dist/apps/scully-docs',
   defaultPostRenderers,
   routes: {
     '/docs/:slug': {
       type: 'contentFolder',
       postRenderers: ['docsLink', ...defaultPostRenderers],
       slug: {
-        folder: './docs'
-      }
-    }
-  }
+        folder: './docs',
+      },
+    },
+  },
+  puppeteerLaunchOptions: {
+    defaultViewport: null,
+    devtools: true,
+  },
 };