formbuilder-lhcforms 9.3.0 → 9.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,101 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <title>Title</title>
6
+ </head>
7
+ <body>
8
+ <div class="bg-body p-2" xmlns="http://www.w3.org/1999/html">
9
+ <button id="openWin" class="btn btn-primary m-2" onClick="openFormBuilder()">Open form builder</button>
10
+ <button id="sendQ" class="btn btn-primary m-2" onClick="sendQuestionnaire()">Post questionnaire</button>
11
+ <button id="clear" class="btn btn-primary m-2" onClick="clearMessages()">Clear messages</button>
12
+ <p class="m-1" id="url"></p>
13
+ <h6 id="initH">initialized</h6>
14
+ <pre class="m-1" id="initW"></pre>
15
+ <h6 id="updateH">updateQuestionnaire</h6>
16
+ <pre class="m-1" id="updateQ"></pre>
17
+ <h6 id="closedH">closed</h6>
18
+ <pre class="m-1" id="closedQ"></pre>
19
+ </div>
20
+
21
+ <script>
22
+ // Sample questionnaire to be edited in form builder.
23
+ const initialQ = {resourceType: 'Questionnaire', title: 'Form loaded from window-open-test.html', status: 'draft', item: [{text: 'q one', linkId: 'q-1'}]};
24
+
25
+ let fbWindow = null;
26
+ let fbUrl = '/';
27
+
28
+ let initHeader = document.getElementById('initH');
29
+ let updateHeader = document.getElementById('updateH');
30
+ let closedHeader = document.getElementById('closedH');
31
+ let initEl = document.getElementById('initW');
32
+ let updateEl = document.getElementById('updateQ');
33
+ let closedEl = document.getElementById('closedQ');
34
+
35
+ let urlEl = document.getElementById('url');
36
+ window.addEventListener('message', handleMessage, true);
37
+
38
+
39
+ /**
40
+ * Listen to messages from form builder.
41
+ */
42
+ function handleMessage(event) {
43
+ const messageFromOpenedWindow = JSON.stringify(event.data, null, 2);
44
+ fbUrl = new URL(fbUrl, window.location.href).toString();
45
+ // console.log(`Message type ${event.data?.type} received from ${event.origin}`);
46
+ if (!fbUrl.startsWith(event.origin)) {
47
+ return;
48
+ }
49
+ switch (event.data?.type) {
50
+ case 'initialized':
51
+ // Wait for the child window to be ready, before sending initial questionnaire.
52
+ initHeader.innerHTML = `${event.data?.type}: New window initialized (${new Date().toISOString()})`;
53
+ initEl.innerHTML = `${messageFromOpenedWindow}`;
54
+ sendQuestionnaire(); // Send initial questionnaire.
55
+ break;
56
+ case 'updateQuestionnaire':
57
+ // Use this to get continuous updates. Wiil be triggered by every edit in
58
+ // the form builder with about 0.5 second debounce.
59
+ updateHeader.innerHTML = `${event.data?.type}: Updated questionnaire from opened window (${new Date().toISOString()})`;
60
+ updateEl.innerHTML = `${messageFromOpenedWindow}`
61
+ break;
62
+ case 'closed':
63
+ // Triggered when the window is closed. Use this to get last updated questionnaire
64
+ closedHeader.innerHTML = `${event.data?.type}: Final questionnaire from opened window after it is closed (${new Date().toISOString()})`;
65
+ closedEl.innerHTML = `${messageFromOpenedWindow}`;
66
+ break;
67
+ default:
68
+ console.log(`Unknown message type ${event.data?.type} received from ${event.origin}`);
69
+ }
70
+ }
71
+
72
+ /**
73
+ * Open a child window to load form builder app.
74
+ */
75
+ function openFormBuilder() {
76
+ fbWindow = window.open(fbUrl, 'formbuilder_window');
77
+ fbWindow.focus();
78
+ urlEl.innerHTML = 'Opened url: ' + fbUrl;
79
+ }
80
+
81
+ /**
82
+ * Send questionnaire to form builder using window.postMessage()
83
+ */
84
+ function sendQuestionnaire() {
85
+ if(fbWindow && !fbWindow.closed) {
86
+ console.log(`Posting initialQuestionnaire to ${fbUrl}`);
87
+ fbWindow?.postMessage({type: 'initialQuestionnaire', questionnaire: initialQ}, fbUrl);
88
+ }
89
+ }
90
+
91
+ /**
92
+ * Clear messages, typically to read fresh messages.
93
+ */
94
+ function clearMessages() {
95
+ initEl.innerHTML = '';
96
+ updateEl.innerHTML = '';
97
+ closedEl.innerHTML = '';
98
+ }
99
+ </script>
100
+ </body>
101
+ </html>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "formbuilder-lhcforms",
3
- "version": "9.3.0",
3
+ "version": "9.4.0",
4
4
  "description": "Build LHC-Forms and FHIR Questionnaires",
5
5
  "homepage": "https://github.com/lhncbc/formbuilder-lhcforms",
6
6
  "license": "SEE LICENSE IN LICENSE.md",
@@ -18,14 +18,20 @@
18
18
  "start-public": "node ./bin/start-public.js",
19
19
  "install-and-build": "npm install && npm run clean-build",
20
20
  "clean-build": "ng cache clean && npm ci && npm run build",
21
+ "build-with-test-html": "ng build --configuration prod_with_test_html",
21
22
  "create-version-file": "echo {\\\"version\\\": \\\"${npm_package_version}\\\"} > ./src/assets/version.json",
22
23
  "build": "npm run create-version-file && ng build --configuration production",
23
24
  "test": "npm run unit-test && npm run e2e:prod",
24
25
  "unit-test": "ng test --watch=false",
25
26
  "lint": "ng lint",
26
27
  "cy:verify": "cypress verify",
28
+ "cy-run": "cypress run --browser chrome --config baseUrl=http://localhost:${npm_package_config_testPort}",
27
29
  "e2e": "ng e2e",
28
- "e2e:prod": "ng run formbuilder-lhcforms:e2e:production",
30
+ "e2e:start-server": "npm run build-with-test-html && angular-http-server --silent --path ./dist/formbuilder-lhcforms -p ${npm_package_config_testPort}",
31
+ "pw-run": "npx playwright test",
32
+ "e2e:pw-run": "start-server-and-test e2e:start-server http://localhost:${npm_package_config_testPort} pw-run",
33
+ "e2e:prod": "start-server-and-test e2e:start-server http://localhost:${npm_package_config_testPort} e2e:cy-pw-run",
34
+ "e2e:cy-pw-run": "npm run cy-run && npm run pw-run",
29
35
  "postinstall": "ngcc"
30
36
  },
31
37
  "files": [
@@ -81,6 +87,7 @@
81
87
  "@angular/compiler-cli": "~15.2.4",
82
88
  "@angular/language-service": "~15.2.4",
83
89
  "@cypress/schematic": "^2.5.1",
90
+ "@playwright/test": "^1.42.1",
84
91
  "@types/hapi": "18.0.8",
85
92
  "@types/jasmine": "~4.3.1",
86
93
  "@types/jasminewd2": "~2.0.10",
@@ -102,6 +109,7 @@
102
109
  "karma-jasmine": "~4.0.2",
103
110
  "karma-jasmine-html-reporter": "^1.7.0",
104
111
  "postcss": "^8.3.0",
112
+ "start-server-and-test": "2.0.3",
105
113
  "ts-node": "~9.1.1",
106
114
  "typescript": "^4.8.4"
107
115
  }