feat(scully): logrocket render plugin. (#680)

GuzmanPI · jorgeucano · HeroDevs · web-flow · commit ca3503621cae · 2020-07-02T21:08:41.000-03:00
* feat(scully): Add logrocket render plugin.

Fixes tests adds dummy app and id

* feat(Scully/publish/plugins): add support for logrocket

Add keys for logrocket
fix issue undefined values in getMyConfig
add prod option for support
into scully config
change web publisher for publish with logrocket

* update test for logrocket

* test(lib): add test for LogRocket

* fix(docsWeb): fix typo UTF-8

* fix(monorepo): remove jasmine dependencies

* fix snapshot

* fix(test-jest): update expect import

* add tslib

* change test for md

* change test for md

* update test

Co-authored-by: jorgeucano &lt;jorgeucano@gmail.com&gt;
Co-authored-by: HeroDevs &lt;herodevs@freddie.lan&gt;
diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml
@@ -17,7 +17,7 @@ jobs:
       - run: npm install
       - run: npm run symlinks
       - run: npx nx run-many --target=build --all --prod
-      - run: node ./dist/libs/scully/scully --project scully-docs --RSD --scan --404=baseOnly
+      - run: node ./dist/libs/scully/scully --project scully-docs --RSD --scan --404=baseOnly --prod
       - uses: w9jds/firebase-action@master
         with:
           args: deploy --project scullyio --only hosting
diff --git a/docs/scully_es.md b/docs/scully_es.md
@@ -2,14 +2,14 @@
 title: Introducción
 order: 110
 lang: es
-slug: Introducción
+slug: introduccion
 ---
 
 # Introducción (Alfa)
 
 ## ¿Qué es Scully?
 
-**Scully**  el mejor generador de sitios estáticos para proyectos de Angular buscando adoptar JAMStack.
+**Scully** el mejor generador de sitios estáticos para proyectos de Angular buscando adoptar JAMStack.
 
 ### ¿Cómo funciona?
 
@@ -43,4 +43,4 @@ Scully [Horas de Oficina](https://meet.google.com/vcm-wekz-hsx?authuser=1) todos
 
 El equipo aprecia su retroalimentación y nos gustaría conocer cómo está usando Scully en convinación con otras herramientas.
 
-¿Le gustaría compartir su experiencia con la comunidad?  Por favor vea nuestra guía de [CONTRIBUCIÓN](../CONTRIBUTING.md).
+¿Le gustaría compartir su experiencia con la comunidad? Por favor vea nuestra guía de [CONTRIBUCIÓN](../CONTRIBUTING.md).
diff --git a/libs/plugins/logrocket/.eslintrc b/libs/plugins/logrocket/.eslintrc
@@ -0,0 +1 @@
+{ "extends": "../../../.eslintrc", "rules": {}, "ignorePatterns": ["!**/*"] }
diff --git a/libs/plugins/logrocket/README.md b/libs/plugins/logrocket/README.md
@@ -0,0 +1,7 @@
+# plugins-logrocket
+
+This library was generated with [Nx](https://nx.dev).
+
+## Running unit tests
+
+Run `ng test plugins-logrocket` to execute the unit tests via [Jest](https://jestjs.io).
diff --git a/libs/plugins/logrocket/jest.config.js b/libs/plugins/logrocket/jest.config.js
@@ -0,0 +1,9 @@
+module.exports = {
+  name: 'plugins-logrocket',
+  preset: '../../../jest.config.js',
+  transform: {
+    '^.+\\.[tj]sx?$': 'ts-jest',
+  },
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'html'],
+  coverageDirectory: '../../../coverage/libs/plugins/logrocket',
+};
diff --git a/libs/plugins/logrocket/package.json b/libs/plugins/logrocket/package.json
@@ -0,0 +1,13 @@
+{
+  "name": "@scullyio/plugins-logrocket",
+  "version": "0.0.1",
+  "author": "Israel Guzman",
+  "repository": {
+    "type": "GIT",
+    "url": "https://github.com/scullyio/scully/tree/main/libs/plugins/logrocket"
+  },
+  "license": "MIT",
+  "dependencies": {
+    "tslib": "^1.13.0"
+  }
+}
diff --git a/libs/plugins/logrocket/src/index.ts b/libs/plugins/logrocket/src/index.ts
@@ -0,0 +1 @@
+export * from './lib/plugins-logrocket';
diff --git a/libs/plugins/logrocket/src/lib/plugins-logrocket.ts b/libs/plugins/logrocket/src/lib/plugins-logrocket.ts
@@ -0,0 +1,21 @@
+import { registerPlugin, getPluginConfig } from '@scullyio/scully';
+
+export const LogRocket = 'logrocket';
+
+export const logrocketPlugin = async (html: string): Promise<string> => {
+  const logrocketConfig = getPluginConfig(LogRocket);
+
+  if (!logrocketConfig) {
+    throw new Error('logrocket plugin missing configuration');
+  }
+
+  const logrocketScript = `
+    <script src="https://cdn.logrocket.io/LogRocket.min.js"></script>
+    <script>window.LogRocket && window.LogRocket.init('${logrocketConfig['app']}/${logrocketConfig['id']}');</script>`;
+
+  return html.replace(/<\/head/i, `${logrocketScript}</head`);
+};
+
+const validator = async () => [];
+
+registerPlugin('render', LogRocket, logrocketPlugin, validator);
diff --git a/libs/plugins/logrocket/tsconfig.json b/libs/plugins/logrocket/tsconfig.json
@@ -0,0 +1,7 @@
+{
+  "extends": "../../../tsconfig.json",
+  "compilerOptions": {
+    "types": ["node", "jest"]
+  },
+  "include": ["**/*.ts"]
+}
diff --git a/libs/plugins/logrocket/tsconfig.lib.json b/libs/plugins/logrocket/tsconfig.lib.json
@@ -0,0 +1,12 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "module": "commonjs",
+    "outDir": "../../../dist/out-tsc",
+    "declaration": true,
+    "rootDir": "./src",
+    "types": ["node"]
+  },
+  "exclude": ["**/*.spec.ts"],
+  "include": ["**/*.ts"]
+}
diff --git a/libs/plugins/logrocket/tsconfig.spec.json b/libs/plugins/logrocket/tsconfig.spec.json
@@ -0,0 +1,15 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../../dist/out-tsc",
+    "module": "commonjs",
+    "types": ["jest", "node"]
+  },
+  "include": [
+    "**/*.spec.ts",
+    "**/*.spec.tsx",
+    "**/*.spec.js",
+    "**/*.spec.jsx",
+    "**/*.d.ts"
+  ]
+}
diff --git a/libs/scully/src/index.ts b/libs/scully/src/index.ts
@@ -28,7 +28,7 @@ import { handleTravesal } from './lib/utils/handlers/handleTravesal';
 import { routeDiscovery } from './lib/utils/handlers/routeDiscovery';
 import { executePluginsForRoute } from './lib/renderPlugins/executePlugins';
 import { WriteToStorage } from './lib/systemPlugins/writeToFs.plugin';
-
+import { prod } from './lib/utils/cli-options';
 export * from './lib/utils/log';
 export {
   configValidator,
@@ -57,4 +57,5 @@ export {
   /** end WIP */
   getConfig as getMyConfig,
   setConfig as setMyConfig,
+  prod,
 };
diff --git a/libs/scully/src/lib/utils/cli-options.ts b/libs/scully/src/lib/utils/cli-options.ts
@@ -130,7 +130,7 @@ export const {
     'provide a wildcard string separated by ,(comma) to filter the handled routes'
   ).argv;
 
-export const { pjFirst, serverTimeout, pluginsError, handle404 } = yargs
+export const { pjFirst, serverTimeout, pluginsError, handle404, prod } = yargs
   /** server Timout */
   .number('st')
   .default('st', 0)
@@ -154,7 +154,12 @@ export const { pjFirst, serverTimeout, pluginsError, handle404 } = yargs
   .boolean('pe')
   .alias('pe', 'pluginsError')
   .default('pe', true)
-  .describe('pe', "Exit scully's run when exist an error in a plugin").argv;
+  .describe('pe', "Exit scully's run when exist an error in a plugin")
+  /** Use Prod Mode */
+  .boolean('prod')
+  .alias('prod', 'Production')
+  .default('prod', false)
+  .describe('prod', 'Use prod mode for Scully').argv;
 
 yargs.help();
 
diff --git a/nx.json b/nx.json
@@ -45,6 +45,9 @@
     },
     "plugins-scully-plugin-flash-prevention": {
       "tags": []
+    },
+    "plugins-logrocket": {
+      "tags": []
     }
   }
 }
diff --git a/package-lock.json b/package-lock.json
diff --git a/scully.scully-docs.config.ts b/scully.scully-docs.config.ts
@@ -1,11 +1,26 @@
-import { ScullyConfig, setPluginConfig } from '@scullyio/scully';
+import {
+  ScullyConfig,
+  setPluginConfig,
+  prod,
+  getPluginConfig,
+} from '@scullyio/scully';
 import { DisableAngular } from 'scully-plugin-disable-angular';
 import './demos/plugins/docs-link-update';
+import { LogRocket } from '@scullyio/plugins/logrocket';
 
 setPluginConfig('md', { enableSyntaxHighlighting: true });
 
 const defaultPostRenderers = [DisableAngular];
 
+if (prod) {
+  setPluginConfig(LogRocket, { app: 'herodevs', id: 'scully' });
+  defaultPostRenderers.push(LogRocket);
+} else {
+  // This is for check the plugin with the test
+  setPluginConfig(LogRocket, { app: 'test', id: 'test' });
+  defaultPostRenderers.push(LogRocket);
+}
+
 export const config: ScullyConfig = {
   projectRoot: './apps/scully-docs/src',
   projectName: 'scully-docs',
diff --git a/tests/jest/src/__tests__/__snapshots__/docsThere.spec.ts.snap b/tests/jest/src/__tests__/__snapshots__/docsThere.spec.ts.snap
diff --git a/tests/jest/src/__tests__/baseHrefRewrite.spec.ts b/tests/jest/src/__tests__/baseHrefRewrite.spec.ts
@@ -1,5 +1,3 @@
-import { readFileSync } from 'fs';
-import { join } from 'path';
 import { readPage } from '../test-config.helper';
 
 describe('Check if base-ref rewite ', () => {
diff --git a/tests/jest/src/__tests__/blog-index.spec.ts b/tests/jest/src/__tests__/blog-index.spec.ts
@@ -1,4 +1,5 @@
 import { readPage, replaceIndexNG } from '../test-config.helper';
+import { expect } from '@jest/globals';
 
 describe('Static: Test blog index', () => {
   it('Check clean blog index by scully', () => {
diff --git a/tests/jest/src/__tests__/docsThere.spec.ts b/tests/jest/src/__tests__/docsThere.spec.ts
@@ -1,21 +1,21 @@
-import { readdir, readFileSync } from 'fs';
+import { readdirSync, readFileSync } from 'fs';
 import { join } from 'path';
 import { readPage, replaceIndexNG } from '../test-config.helper';
 const fm = require('front-matter');
+import { expect } from '@jest/globals';
 
 describe('docsSite', () => {
   const path = join(__dirname, '../../../../docs');
-
-  it('should have content for all markdown files', async () => {
-    const files = (
-      await new Promise<string[]>((resolve) =>
-        readdir(path, (err, data) => resolve(data))
-      )
-    )
+  describe('should have content for all markdown files', () => {
+    const files = readdirSync(path)
       .filter((file) => file.endsWith('.md'))
       .map((file) => getSlug(file, path));
     for (const file of files) {
-      expect(replaceIndexNG(readPage(file, 'doc-sites'))).toMatchSnapshot();
+      it(`check html for markdown ${file}`, () => {
+        const index = readPage(file, 'doc-sites');
+        const replace = replaceIndexNG(index);
+        expect(replace).toMatchSnapshot();
+      });
     }
   });
 });
diff --git a/tests/jest/src/__tests__/home.spec.ts b/tests/jest/src/__tests__/home.spec.ts
@@ -1,4 +1,5 @@
 import { readPage, replaceIndexNG } from '../test-config.helper';
+import { expect } from '@jest/globals';
 
 describe('Check list of all', () => {
   it('Check clean all list from scully', () => {
diff --git a/tests/jest/src/__tests__/route404.spec.ts b/tests/jest/src/__tests__/route404.spec.ts
@@ -1,5 +1,6 @@
 import { readPage, replaceIndexNG } from '../test-config.helper';
 // import { title404 } from '../../../../libs/scully/src/lib/utils/serverstuff/title404';
+import { expect } from '@jest/globals';
 
 // copied in here, because the import blows up in GA.
 const title404 = '404 - URL not provided in the app Scully is serving';
diff --git a/tests/jest/src/__tests__/transfer-state.spec.ts b/tests/jest/src/__tests__/transfer-state.spec.ts
@@ -1,4 +1,5 @@
 import { extractTransferState, readPage } from '../test-config.helper';
+import { expect } from '@jest/globals';
 
 describe('TransferState', () => {
   it('should add state to page 1', () => {
diff --git a/tests/jest/src/__tests__/users.spec.ts b/tests/jest/src/__tests__/users.spec.ts
@@ -1,4 +1,5 @@
 import { readPage, replaceIndexNG } from '../test-config.helper';
+import { expect } from '@jest/globals';
 
 describe('JsonPlugin: test user List', () => {
   it('Check clean blog index by scully', () => {
diff --git a/tests/jest/src/setup-jest.ts b/tests/jest/src/setup-jest.ts
@@ -1,8 +1,10 @@
 import 'jest-preset-angular';
 
+declare const expect: jest.Expect;
+
 /* global mocks for jsdom */
 const mock = () => {
-  let storage: {[key: string]: string} = {};
+  let storage: { [key: string]: string } = {};
   return {
     getItem: (key: string) => (key in storage ? storage[key] : null),
     setItem: (key: string, value: string) => (storage[key] = value || ''),
@@ -11,8 +13,8 @@ const mock = () => {
   };
 };
 
-Object.defineProperty(window, 'localStorage', {value: mock()});
-Object.defineProperty(window, 'sessionStorage', {value: mock()});
+Object.defineProperty(window, 'localStorage', { value: mock() });
+Object.defineProperty(window, 'sessionStorage', { value: mock() });
 Object.defineProperty(window, 'getComputedStyle', {
   value: () => ['-webkit-appearance'],
 });
diff --git a/tsconfig.json b/tsconfig.json
@@ -25,7 +25,8 @@
       "@scullyio/plugins/demo-lib": ["libs/plugins/demo-lib/src/index.ts"],
       "@scullyio/plugins/scully-plugin-flash-prevention": [
         "dist/libs/plugins/scully-plugin-flash-prevention"
-      ]
+      ],
+      "@scullyio/plugins/logrocket": ["libs/plugins/logrocket/src/index.ts"]
     }
   },
   "angularCompilerOptions": {
diff --git a/workspace.json b/workspace.json
@@ -450,6 +450,43 @@
           }
         }
       }
+    },
+    "plugins-logrocket": {
+      "root": "libs/plugins/logrocket",
+      "sourceRoot": "libs/plugins/logrocket/src",
+      "projectType": "library",
+      "schematics": {},
+      "architect": {
+        "lint": {
+          "builder": "@nrwl/linter:lint",
+          "options": {
+            "linter": "eslint",
+            "tsConfig": [
+              "libs/plugins/logrocket/tsconfig.lib.json",
+              "libs/plugins/logrocket/tsconfig.spec.json"
+            ],
+            "exclude": ["**/node_modules/**", "!libs/plugins/logrocket/**/*"]
+          }
+        },
+        "test": {
+          "builder": "@nrwl/jest:jest",
+          "options": {
+            "jestConfig": "libs/plugins/logrocket/jest.config.js",
+            "tsConfig": "libs/plugins/logrocket/tsconfig.spec.json",
+            "passWithNoTests": true
+          }
+        },
+        "build": {
+          "builder": "@nrwl/node:package",
+          "options": {
+            "outputPath": "dist/libs/plugins/logrocket",
+            "tsConfig": "libs/plugins/logrocket/tsconfig.lib.json",
+            "packageJson": "libs/plugins/logrocket/package.json",
+            "main": "libs/plugins/logrocket/src/index.ts",
+            "assets": ["libs/plugins/logrocket/*.md"]
+          }
+        }
+      }
     }
   },
   "cli": {

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1 @@`
	`1`	`+{ "extends": "../../../.eslintrc", "rules": {}, "ignorePatterns": ["!*/"] }`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1 @@`
	`1`	`+export * from './lib/plugins-logrocket';`