Merge pull request #231 from lyra/fix/example-issues

feat(examples): Update framework examples and add e2e tests for them
lyra · Sep 21, 2022 · 7b7b420 · 7b7b420
2 parents f90bc79 + 6d3a8e0
commit 7b7b420
Show file tree

Hide file tree

Showing 85 changed files with 65,362 additions and 64,917 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -10,10 +10,17 @@ jobs:
       - checkout
       - browser-tools/install-browser-tools
       - node/install-packages
+      # - run:
+      #     name: 'Start http server'
+      #     background: true
+      #     command: npm run e2e-server
       - run:
-          name: 'Start http server'
+          name: 'Build examples'
+          command: npm run build:examples
+      - run:
+          name: 'start servers'
           background: true
-          command: npm run e2e-server
+          command: npm run e2e-servers
       - run:
           name: 'Run tests'
           command: npm run test-ci

diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,5 @@
 *.pyc
 node_modules
 .history
+examples_build
+.angular
diff --git a/README.md b/README.md
@@ -55,9 +55,9 @@ First you need to load the theme files in your HEAD section:
 ```javascript
 <!-- theme and plugins. should be loaded in the HEAD section -->
 <link rel="stylesheet"
-href="https://[CHANGE_ME: JAVASCRIPT ENDPOINT]/static/js/krypton-client/V4.0/ext/classic-reset.css">
+href="~~CHANGE_ME_ENDPOINT~~/static/js/krypton-client/V4.0/ext/classic-reset.css">
 <script
-    src="https://[CHANGE_ME: JAVASCRIPT ENDPOINT]/static/js/krypton-client/V4.0/ext/classic.js">
+    src="~~CHANGE_ME_ENDPOINT~~/static/js/krypton-client/V4.0/ext/classic.js">
 </script>
 ```
 **note**: Replace **[CHANGE_ME]** with your credentials and end-points.
@@ -71,8 +71,8 @@ Import the component:
 and Load the [Lyra Javascript library][JS Link]:
 
 ```javascript
-const publicKey = 'CHANGE_ME: YOUR PUBLIC KEY';
-const endPoint = 'CHANGE_ME: JAVASCRIPT ENDPOINT'; /* should include https:// */
+const publicKey = '~~CHANGE_ME_PUBLIC_KEY~~';
+const endPoint = '~~CHANGE_ME_ENDPOINT~~'; /* should include https:// */
 
 /* WARNING: You should always use promises chaining with KR method calls */
 KRGlue.loadLibrary(endPoint, publicKey) /* Load the remote library */

diff --git a/build.sh b/build.sh
@@ -0,0 +1,33 @@
+#!/bin/bash
+
+mkdir -p examples_build/react
+mkdir examples_build/next
+mkdir examples_build/server
+mkdir examples_build/svelte
+
+cd examples
+
+npm ci --prefix server && 
+npm ci --prefix angular/minimal-example && 
+npm ci --prefix emberjs && 
+npm ci --legacy-peer-deps --prefix ionic/minimal-example && 
+npm ci --prefix react/minimal-example && 
+npm ci --prefix react/next-minimal && 
+npm ci --prefix vuejs/minimal-example && 
+npm ci --prefix svelte/minimal-example 
+
+wait
+
+npm run build:example --prefix angular/minimal-example &&
+npm run build:example --prefix emberjs &&
+npm run build:example --prefix ionic/minimal-example &&
+npm run build:example --prefix react/minimal-example &&
+npm run build:example --prefix react/next-minimal &&
+npm run build:example --prefix vuejs/minimal-example &&
+npm run build:example --prefix svelte/minimal-example 
+
+wait
+
+cp -R server ../examples_build/
+
+gulp replaceKeys
diff --git a/examples/angular/minimal-example/README.md b/examples/angular/minimal-example/README.md
@@ -57,9 +57,9 @@ Add them in src/index.html in the the HEAD section:
 ```javascript
 <!-- theme and plugins. should be loaded in the HEAD section -->
 <link rel="stylesheet"
-href="https://[CHANGE_ME: JAVASCRIPT ENDPOINT]/static/js/krypton-client/V4.0/ext/classic-reset.css">
+href="~~CHANGE_ME_ENDPOINT~~/static/js/krypton-client/V4.0/ext/classic-reset.css">
 <script
-    src="https://[CHANGE_ME: JAVASCRIPT ENDPOINT]/static/js/krypton-client/V4.0/ext/classic.js">
+    src="~~CHANGE_ME_ENDPOINT~~/static/js/krypton-client/V4.0/ext/classic.js">
 </script>
 ```
 
@@ -107,8 +107,8 @@ import KRGlue from "@lyracom/embedded-form-glue";
 export class AppComponent implements OnInit {
   title = "minimal-example";
   ngOnInit() {
-    const endpoint = "CHANGE_ME: JAVASCRIPT ENDPOINT";
-    const publicKey = "CHANGE_ME: YOUR PUBLIC KEY";
+    const endpoint = "~~CHANGE_ME_ENDPOINT~~";
+    const publicKey = "~~CHANGE_ME_PUBLIC_KEY~~";
     const formToken = "DEMO-TOKEN-TO-BE-REPLACED";
     KRGlue.loadLibrary(endpoint, publicKey) /* Load the remote library */
       .then(({ KR }) =>
@@ -187,8 +187,8 @@ export class AppComponent implements OnInit {
   (...),
     ngOnInit() {
       /* Use your endpoint and personal public key */
-      const endpoint = 'CHANGE_ME: JAVASCRIPT ENDPOINT'
-      const publicKey = 'CHANGE_ME: YOUR PUBLIC KEY'
+      const endpoint = '~~CHANGE_ME_ENDPOINT~~'
+      const publicKey = '~~CHANGE_ME_PUBLIC_KEY~~'
       const formToken = 'DEMO-TOKEN-TO-BE-REPLACED'
       KRGlue.loadLibrary(endpoint, publicKey) /* Load the remote library */
         .then(({KR}) => KR.setFormConfig({  /* set the minimal configuration */

diff --git a/examples/angular/minimal-example/angular.json b/examples/angular/minimal-example/angular.json
@@ -102,5 +102,8 @@
       }
     }
   },
-  "defaultProject": "minimal-example"
+  "defaultProject": "minimal-example",
+  "cli": {
+    "analytics": false
+  }
 }