From e2435d568b18032e8ef4e249007bdc57da385a55 Mon Sep 17 00:00:00 2001 From: Morten Vestergaard Hansen Date: Tue, 8 Aug 2023 14:10:30 +0200 Subject: [PATCH 1/4] Made loading more resilient --- .../changepassword-unified.html | 36 +++++++++-------- .../forgotpassword-unified.html | 38 ++++++++++-------- .../b2c-custom-layouts/login-unified.html | 39 +++++++++++-------- .../login-with-mitid-unified.html | 39 +++++++++++-------- .../src/assets/b2c-custom-layouts/main.js | 5 +++ .../multifactorauth-unified.html | 36 +++++++++-------- .../b2c-custom-layouts/reset-password.html | 31 ++++++++++----- .../b2c-custom-layouts/self-asserted.html | 38 ++++++++++-------- .../b2c-custom-layouts/signup-unified.html | 37 ++++++++++-------- .../b2c-custom-layouts/totp-unified.html | 39 +++++++++++-------- 10 files changed, 197 insertions(+), 141 deletions(-) diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/changepassword-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/changepassword-unified.html index a8fcddd198..ab35e60fd9 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/changepassword-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/changepassword-unified.html @@ -74,10 +74,7 @@ Utils.waitFor("button#next", function (element) { element.addEventListener("click", Utils.toggleErrorClasses); }); - } - - function showContent() { - document.querySelector("main").style.display = "block"; + Utils.showContent(); } @@ -86,19 +83,26 @@ ? SETTINGS.remoteResource.replace(SETTINGS.remoteResource.split("/").pop(), "") : ""; - var head = document.getElementsByTagName("head")[0]; - var link = document.createElement("link"); - link.rel = "stylesheet"; - link.type = "text/css"; - link.href = path + "main.css"; - link.onload = showContent; - head.appendChild(link); + const loadStyleProimse = new Promise((resolve, reject) => { + var style = document.createElement("link"); + style.rel = "stylesheet"; + style.type = "text/css"; + style.href = path + "main.css"; + style.onload = resolve; + style.onerror = reject; + document.head.appendChild(style); + }); + + const loadScriptPromise = new Promise((resolve, reject) => { + var script = document.createElement("script"); + script.type = "text/javascript"; + script.src = path + "main.js"; + script.onload = resolve; + script.onerror = reject; + document.head.appendChild(script); + }); - var script = document.createElement("script"); - script.type = "text/javascript"; - script.src = path + "main.js"; - script.onload = init; - head.appendChild(script); + Promise.all([loadStyleProimse, loadScriptPromise]).then(init); diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/forgotpassword-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/forgotpassword-unified.html index 10cc98d11d..d9d16bbc4a 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/forgotpassword-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/forgotpassword-unified.html @@ -199,10 +199,7 @@ toggleErrorClasses(); }); }); - } - - function showContent() { - document.querySelector("main").style.display = "block"; + Utils.showContent(); } diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-unified.html index 3eab5dc94b..d25cf7e366 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-unified.html @@ -158,10 +158,7 @@ element.addEventListener("click", Utils.toggleErrorClasses); appendForgotPasswordTemplate(); }); - } - - function showContent() { - document.querySelector("main").style.display = "block"; + Utils.showContent(); } @@ -169,19 +166,27 @@ const path = window.SETTINGS ? SETTINGS.remoteResource.replace(SETTINGS.remoteResource.split("/").pop(), "") : ""; - var head = document.getElementsByTagName("head")[0]; - var link = document.createElement("link"); - link.rel = "stylesheet"; - link.type = "text/css"; - link.href = path + "main.css"; - link.onload = showContent; - head.appendChild(link); - - var script = document.createElement("script"); - script.type = "text/javascript"; - script.src = path + "main.js"; - script.onload = init; - head.appendChild(script); + + const loadStyleProimse = new Promise((resolve, reject) => { + var style = document.createElement("link"); + style.rel = "stylesheet"; + style.type = "text/css"; + style.href = path + "main.css"; + style.onload = resolve; + style.onerror = reject; + document.head.appendChild(style); + }); + + const loadScriptPromise = new Promise((resolve, reject) => { + var script = document.createElement("script"); + script.type = "text/javascript"; + script.src = path + "main.js"; + script.onload = resolve; + script.onerror = reject; + document.head.appendChild(script); + }); + + Promise.all([loadStyleProimse, loadScriptPromise]).then(init); diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-with-mitid-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-with-mitid-unified.html index 01359d4c39..9277ba2dcc 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-with-mitid-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-with-mitid-unified.html @@ -192,10 +192,7 @@ appendForgotPasswordTemplate(); setMitIdFlowSignInFlow(); }); - } - - function showContent() { - document.querySelector("main").style.display = "block"; + Utils.showContent(); } @@ -203,19 +200,27 @@ const path = window.SETTINGS ? SETTINGS.remoteResource.replace(SETTINGS.remoteResource.split("/").pop(), "") : ""; - var head = document.getElementsByTagName("head")[0]; - var link = document.createElement("link"); - link.rel = "stylesheet"; - link.type = "text/css"; - link.href = path + "main.css"; - link.onload = showContent; - head.appendChild(link); - - var script = document.createElement("script"); - script.type = "text/javascript"; - script.src = path + "main.js"; - script.onload = init; - head.appendChild(script); + + const loadStyleProimse = new Promise((resolve, reject) => { + var style = document.createElement("link"); + style.rel = "stylesheet"; + style.type = "text/css"; + style.href = path + "main.css"; + style.onload = resolve; + style.onerror = reject; + document.head.appendChild(style); + }); + + const loadScriptPromise = new Promise((resolve, reject) => { + var script = document.createElement("script"); + script.type = "text/javascript"; + script.src = path + "main.js"; + script.onload = resolve; + script.onerror = reject; + document.head.appendChild(script); + }); + + Promise.all([loadStyleProimse, loadScriptPromise]).then(init); diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/main.js b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/main.js index 0c19f8ccde..989483bf40 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/main.js +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/main.js @@ -15,6 +15,11 @@ * limitations under the License. */ const Utils = { + showContent: function () { + Utils.waitFor('main', (main) => { + main.style.display = 'block'; + }); + }, waitFor: function (selector, callback) { const elm = document.querySelector(selector); diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/multifactorauth-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/multifactorauth-unified.html index a509023618..5e1d7c7491 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/multifactorauth-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/multifactorauth-unified.html @@ -91,10 +91,7 @@ Utils.waitFor("button#next", function (element) { element.addEventListener("click", toggleErrorClasses); }); - } - - function showContent() { - document.querySelector("main").style.display = "block"; + Utils.showContent(); } diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/reset-password.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/reset-password.html index 4c7810e5f6..207da6c222 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/reset-password.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/reset-password.html @@ -99,8 +99,8 @@ } diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/self-asserted.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/self-asserted.html index 79a2428aad..d124e33ac8 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/self-asserted.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/self-asserted.html @@ -125,10 +125,7 @@ element.addEventListener("click", toggleErrorClasses); }); }); - } - - function showContent() { - document.querySelector("main").style.display = "block"; + Utils.showContent(); } diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/signup-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/signup-unified.html index 18696e5902..0e9d89f04c 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/signup-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/signup-unified.html @@ -108,10 +108,8 @@ element.addEventListener("click", Utils.toggleErrorClasses); }); }); - } - function showContent() { - document.querySelector("main").style.display = "block"; + Utils.showContent(); } diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/totp-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/totp-unified.html index 5c4d277667..57bad3cb9f 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/totp-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/totp-unified.html @@ -122,9 +122,8 @@ } @@ -132,19 +131,27 @@ const path = window.SETTINGS ? SETTINGS.remoteResource.replace(SETTINGS.remoteResource.split("/").pop(), "") : ""; - var head = document.getElementsByTagName("head")[0]; - var link = document.createElement("link"); - link.rel = "stylesheet"; - link.type = "text/css"; - link.href = path + "main.css"; - link.onload = showContent; - head.appendChild(link); - - var script = document.createElement("script"); - script.type = "text/javascript"; - script.src = path + "main.js"; - script.onload = init; - head.appendChild(script); + + const loadStyleProimse = new Promise((resolve, reject) => { + var style = document.createElement("link"); + style.rel = "stylesheet"; + style.type = "text/css"; + style.href = path + "main.css"; + style.onload = resolve; + style.onerror = reject; + document.head.appendChild(style); + }); + + const loadScriptPromise = new Promise((resolve, reject) => { + var script = document.createElement("script"); + script.type = "text/javascript"; + script.src = path + "main.js"; + script.onload = resolve; + script.onerror = reject; + document.head.appendChild(script); + }); + + Promise.all([loadStyleProimse, loadScriptPromise]).then(init); From 1cb8b85a16b663221e8731ba457565d2dea67c82 Mon Sep 17 00:00:00 2001 From: Morten Vestergaard Hansen Date: Tue, 8 Aug 2023 14:14:31 +0200 Subject: [PATCH 2/4] Fixed typo --- .../src/assets/b2c-custom-layouts/changepassword-unified.html | 4 ++-- .../src/assets/b2c-custom-layouts/forgotpassword-unified.html | 4 ++-- .../assets/src/assets/b2c-custom-layouts/login-unified.html | 4 ++-- .../assets/b2c-custom-layouts/login-with-mitid-unified.html | 4 ++-- .../assets/b2c-custom-layouts/multifactorauth-unified.html | 4 ++-- .../assets/src/assets/b2c-custom-layouts/reset-password.html | 4 ++-- .../assets/src/assets/b2c-custom-layouts/self-asserted.html | 4 ++-- .../assets/src/assets/b2c-custom-layouts/signup-unified.html | 4 ++-- .../assets/src/assets/b2c-custom-layouts/totp-unified.html | 4 ++-- 9 files changed, 18 insertions(+), 18 deletions(-) diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/changepassword-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/changepassword-unified.html index ab35e60fd9..e3eefeb651 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/changepassword-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/changepassword-unified.html @@ -83,7 +83,7 @@ ? SETTINGS.remoteResource.replace(SETTINGS.remoteResource.split("/").pop(), "") : ""; - const loadStyleProimse = new Promise((resolve, reject) => { + const loadStylePromise = new Promise((resolve, reject) => { var style = document.createElement("link"); style.rel = "stylesheet"; style.type = "text/css"; @@ -102,7 +102,7 @@ document.head.appendChild(script); }); - Promise.all([loadStyleProimse, loadScriptPromise]).then(init); + Promise.all([loadStylePromise, loadScriptPromise]).then(init); diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/forgotpassword-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/forgotpassword-unified.html index d9d16bbc4a..eb7c99e7ad 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/forgotpassword-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/forgotpassword-unified.html @@ -207,7 +207,7 @@ ? SETTINGS.remoteResource.replace(SETTINGS.remoteResource.split("/").pop(), "") : ""; - const loadStyleProimse = new Promise((resolve, reject) => { + const loadStylePromise = new Promise((resolve, reject) => { var style = document.createElement("link"); style.rel = "stylesheet"; style.type = "text/css"; @@ -226,7 +226,7 @@ document.head.appendChild(script); }); - Promise.all([loadStyleProimse, loadScriptPromise]).then(init); + Promise.all([loadStylePromise, loadScriptPromise]).then(init); diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-unified.html index d25cf7e366..eaa564e833 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-unified.html @@ -167,7 +167,7 @@ ? SETTINGS.remoteResource.replace(SETTINGS.remoteResource.split("/").pop(), "") : ""; - const loadStyleProimse = new Promise((resolve, reject) => { + const loadStylePromise = new Promise((resolve, reject) => { var style = document.createElement("link"); style.rel = "stylesheet"; style.type = "text/css"; @@ -186,7 +186,7 @@ document.head.appendChild(script); }); - Promise.all([loadStyleProimse, loadScriptPromise]).then(init); + Promise.all([loadStylePromise, loadScriptPromise]).then(init); diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-with-mitid-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-with-mitid-unified.html index 9277ba2dcc..490b391254 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-with-mitid-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/login-with-mitid-unified.html @@ -201,7 +201,7 @@ ? SETTINGS.remoteResource.replace(SETTINGS.remoteResource.split("/").pop(), "") : ""; - const loadStyleProimse = new Promise((resolve, reject) => { + const loadStylePromise = new Promise((resolve, reject) => { var style = document.createElement("link"); style.rel = "stylesheet"; style.type = "text/css"; @@ -220,7 +220,7 @@ document.head.appendChild(script); }); - Promise.all([loadStyleProimse, loadScriptPromise]).then(init); + Promise.all([loadStylePromise, loadScriptPromise]).then(init); diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/multifactorauth-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/multifactorauth-unified.html index 5e1d7c7491..58958157c3 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/multifactorauth-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/multifactorauth-unified.html @@ -99,7 +99,7 @@ ? SETTINGS.remoteResource.replace(SETTINGS.remoteResource.split("/").pop(), "") : ""; - const loadStyleProimse = new Promise((resolve, reject) => { + const loadStylePromise = new Promise((resolve, reject) => { var style = document.createElement("link"); style.rel = "stylesheet"; style.type = "text/css"; @@ -118,7 +118,7 @@ document.head.appendChild(script); }); - Promise.all([loadStyleProimse, loadScriptPromise]).then(init); + Promise.all([loadStylePromise, loadScriptPromise]).then(init); diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/reset-password.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/reset-password.html index 207da6c222..9f12678eb9 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/reset-password.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/reset-password.html @@ -108,7 +108,7 @@ ? SETTINGS.remoteResource.replace(SETTINGS.remoteResource.split("/").pop(), "") : ""; - const loadStyleProimse = new Promise((resolve, reject) => { + const loadStylePromise = new Promise((resolve, reject) => { var style = document.createElement("link"); style.rel = "stylesheet"; style.type = "text/css"; @@ -127,7 +127,7 @@ document.head.appendChild(script); }); - Promise.all([loadStyleProimse, loadScriptPromise]).then(init); + Promise.all([loadStylePromise, loadScriptPromise]).then(init); diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/self-asserted.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/self-asserted.html index d124e33ac8..3e5f09371b 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/self-asserted.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/self-asserted.html @@ -133,7 +133,7 @@ ? SETTINGS.remoteResource.replace(SETTINGS.remoteResource.split("/").pop(), "") : ""; - const loadStyleProimse = new Promise((resolve, reject) => { + const loadStylePromise = new Promise((resolve, reject) => { var style = document.createElement("link"); style.rel = "stylesheet"; style.type = "text/css"; @@ -152,7 +152,7 @@ document.head.appendChild(script); }); - Promise.all([loadStyleProimse, loadScriptPromise]).then(init); + Promise.all([loadStylePromise, loadScriptPromise]).then(init); diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/signup-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/signup-unified.html index 0e9d89f04c..26f5f6b4e5 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/signup-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/signup-unified.html @@ -117,7 +117,7 @@ ? SETTINGS.remoteResource.replace(SETTINGS.remoteResource.split("/").pop(), "") : ""; - const loadStyleProimse = new Promise((resolve, reject) => { + const loadStylePromise = new Promise((resolve, reject) => { var style = document.createElement("link"); style.rel = "stylesheet"; style.type = "text/css"; @@ -136,7 +136,7 @@ document.head.appendChild(script); }); - Promise.all([loadStyleProimse, loadScriptPromise]).then(init); + Promise.all([loadStylePromise, loadScriptPromise]).then(init); diff --git a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/totp-unified.html b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/totp-unified.html index 57bad3cb9f..af4ccb7d2b 100644 --- a/libs/dh/shared/assets/src/assets/b2c-custom-layouts/totp-unified.html +++ b/libs/dh/shared/assets/src/assets/b2c-custom-layouts/totp-unified.html @@ -132,7 +132,7 @@ ? SETTINGS.remoteResource.replace(SETTINGS.remoteResource.split("/").pop(), "") : ""; - const loadStyleProimse = new Promise((resolve, reject) => { + const loadStylePromise = new Promise((resolve, reject) => { var style = document.createElement("link"); style.rel = "stylesheet"; style.type = "text/css"; @@ -151,7 +151,7 @@ document.head.appendChild(script); }); - Promise.all([loadStyleProimse, loadScriptPromise]).then(init); + Promise.all([loadStylePromise, loadScriptPromise]).then(init); From 1ae08d52642b51fc0ffe07e0a4976fd9bebcec6c Mon Sep 17 00:00:00 2001 From: Morten Vestergaard Hansen Date: Tue, 8 Aug 2023 14:33:38 +0200 Subject: [PATCH 3/4] Exclude from sonarcloud --- .github/workflows/frontend-ci.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/frontend-ci.yml b/.github/workflows/frontend-ci.yml index 5fe6ceb077..05d366921f 100644 --- a/.github/workflows/frontend-ci.yml +++ b/.github/workflows/frontend-ci.yml @@ -106,7 +106,7 @@ jobs: -Dsonar.projectKey=geh-frontend-app -Dsonar.organization=energinet-datahub -Dsonar.sources=apps/dh/app-dh,libs/dh,libs/ui-watt,libs/gf - -Dsonar.exclusions=**/*.spec.ts,libs/dh/shared/domain/src/lib/generated/**/*,libs/dh/shared/data-access-msw/src/assets/mockServiceWorker.js,libs/dh/shared/data-access-msw/src/lib/mocks/**/* + -Dsonar.exclusions=libs/dh/shared/assets/src/assets/b2c-custom-layouts/**/*,**/*.spec.ts,libs/dh/shared/domain/src/lib/generated/**/*,libs/dh/shared/data-access-msw/src/assets/mockServiceWorker.js,libs/dh/shared/data-access-msw/src/lib/mocks/**/* -Dsonar.cpd.exclusions=libs/dh/globalization/assets-localization/src/assets/i18n/*.json -Dsonar.coverage.exclusions=libs/ui-watt/**/+storybook/*,libs/ui-watt/**/*.stories.ts, env: From e5cb747a840b086953836181ea218fc66504ce86 Mon Sep 17 00:00:00 2001 From: Morten Vestergaard Hansen Date: Tue, 8 Aug 2023 14:37:31 +0200 Subject: [PATCH 4/4] Fixed feature flag test --- libs/dh/shared/feature-flags/src/lib/feature-flags.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/libs/dh/shared/feature-flags/src/lib/feature-flags.ts b/libs/dh/shared/feature-flags/src/lib/feature-flags.ts index 55d240d8cc..d5f766b3ae 100644 --- a/libs/dh/shared/feature-flags/src/lib/feature-flags.ts +++ b/libs/dh/shared/feature-flags/src/lib/feature-flags.ts @@ -37,7 +37,7 @@ const makeFeatureFlags = satisfies(); * }, */ -const created = '06-06-2023'; +const created = '08-08-2023'; export const dhFeatureFlagsConfig = makeFeatureFlags({ start_wholesale_process_feature_flag: {