Added a way to detect Scully (#45)

* Added Scully mode detection. (in Scully/from generated)
scullyio · Dec 18, 2019 · 0b3eea4 · 0b3eea4
1 parent 2db725f
commit 0b3eea4
Show file tree

Hide file tree

Showing 7 changed files with 22 additions and 8 deletions.
diff --git a/projects/sampleBlog/src/app/app.component.html b/projects/sampleBlog/src/app/app.component.html
@@ -1,5 +1,5 @@
 <header>
-  <h1>Scully demo blog app!</h1>
+  <h1>Scully demo blog app! <small>{{currentState}}</small></h1>
   <a [routerLink]="['/home']">🏠</a>
 </header>
 

diff --git a/projects/sampleBlog/src/app/app.component.ts b/projects/sampleBlog/src/app/app.component.ts
@@ -1,12 +1,16 @@
 import {Component} from '@angular/core';
-import { IdleMonitorService } from '@scullyio/ng-lib';
+import {IdleMonitorService, isScullyGenerated, isScullyRunning} from '@scullyio/ng-lib';
 
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css'],
 })
 export class AppComponent {
-  title = 'sampleBlog';
+  currentState = isScullyRunning()
+    ? 'rendering inside scully'
+    : isScullyGenerated()
+    ? 'Loaded from static HTML'
+    : 'SPA mode';
   constructor(private idle: IdleMonitorService) {}
 }
diff --git a/projects/scullyio/ng-lib/package.json b/projects/scullyio/ng-lib/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@scullyio/ng-lib",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "repository": {
     "type": "GIT",
     "url": "https://github.com/scullyio/scully/tree/master/projects/scullyio/ng-lib"

diff --git a/projects/scullyio/ng-lib/src/lib/utils/isScully.ts b/projects/scullyio/ng-lib/src/lib/utils/isScully.ts
@@ -0,0 +1,3 @@
+// tslint:disable: no-string-literal
+export const isScullyRunning = () => window && window['ScullyIO'] === 'running';
+export const isScullyGenerated = () => window && window['ScullyIO'] === 'generated';
diff --git a/projects/scullyio/ng-lib/src/public-api.ts b/projects/scullyio/ng-lib/src/public-api.ts
@@ -5,5 +5,6 @@
 export * from './lib/components.module';
 export * from './lib/idleMonitor/idle-monitor.service';
 export * from './lib/route-service/scully-routes.service';
-export * from './lib/scully-content/scully-content.component'
+export * from './lib/scully-content/scully-content.component';
+export * from './lib/utils/isScully'
 
diff --git a/scully/renderPlugins/puppeteerRenderPlugin.ts b/scully/renderPlugins/puppeteerRenderPlugin.ts
@@ -1,3 +1,4 @@
+// tslint:disable: no-string-literal
 // const puppeteer = require('puppeteer');
 import {Browser, Page} from 'puppeteer';
 import {HandledRoute} from '../routerPlugins/addOptionalRoutesPlugin';
@@ -26,16 +27,21 @@ export const puppeteerRender = async (route: HandledRoute): Promise<string> => {
 
     /** Inject this into the running page, runs in browser*/
     await page.evaluateOnNewDocument(() => {
+      /** set "running" mode */
+      window['ScullyIO'] = 'running';
       window.addEventListener('AngularReady', () => {
-        // setTimeout(() => window['onCustomEvent'](),10000);
+        /** add a small script tag to set "generated" mode */
+        const d = document.createElement('script');
+        d.innerHTML = `window['ScullyIO']='generated';`;
+        document.head.appendChild(d);
         window['onCustomEvent']();
       });
     });
 
     // enter url in page
     await page.goto(path);
 
-    await Promise.race([pageReady, waitForIt(25 * 1000)] );
+    await Promise.race([pageReady, waitForIt(25 * 1000)]);
 
     /**
      * The stange notation is needed bcs typescript messes

diff --git a/scully/utils/validateConfig.ts b/scully/utils/validateConfig.ts
@@ -51,7 +51,7 @@ export async function validateConfig(config: ScullyConfig) {
       })
     );
   } else {
-    logWarn('No routes defined in "scully.config"');
+    logWarn('No routes defined in "scully.config.js "');
   }
   if (hasErrors) {
     /** stop everything if there are errors in the config. */