merg

Author: malincrist

.github/workflows/test.yml

@@ -20,7 +20,7 @@ jobs:
         run: npm run test
 
   end2end-tests:
-    runs-on: ubuntu-latest
+    runs-on: windows-latest
 
     steps:      
       - name: Checkout code
@@ -32,16 +32,29 @@ jobs:
       - name: Install
         run: npm install
 
+      - name: Compile
+        run: npx tsc -p tests\tsconfig.json
+
+      - name: Install Playwright Browsers
+        run: npx playwright install --with-deps
+
       - name: Build static data
         run: npm run build-mock-static-data
 
       - name: Start mock server
         run: npm run serve-website &
+        shell: bash
 
       - name: Wait for the server
         run: ./.github/scripts/wait-for-server.ps1 -HostName "http://localhost:8080"
         shell: pwsh
 
       - name: Run tests
-        run: npm run test-e2e
-      
+        run: npx playwright test tests/ --workers 1
+
+      - uses: actions/upload-artifact@v3
+        if: failure()
+        with:
+          name: playwright-report
+          path: test-results/
+          retention-days: 30

.gitignore

@@ -7,4 +7,5 @@ node_modules/
 src/config.design.json
 src/config.publish.json
 src/config.runtime.json
-
+test-results/
+tsconfig.tsbuildinfo

js/HipObject.js

@@ -2,7 +2,7 @@
 // and callback functions for displaying items outside the control.
 
 //-------------------------------------------------------------------------------------------------
-// The following varible name is defined by partner
+// The following variable name is defined by partner
 // Make sure it has no conflicts to any other your variable names.
 // The name defined here influence how to generate get hip URL that has format "http://p.client.hip.live.com/GetHIP/GetWLSPHIP0/<the namedefined here>?". 
 // Replace '<   >' there with the name here.  

package-lock.json

@@ -17,7 +17,6 @@
         "build-publisher": "webpack --config webpack.publisher.js",
         "build-runtime": "webpack --config webpack.runtime.js",
         "build-function": "webpack --config webpack.function.js",
-        "test-e2e": "node node_modules/mocha/bin/_mocha -r mocha.js tests/e2e/**/*.spec.ts --timeout 3000000",
         "test": "node node_modules/mocha/bin/_mocha -r mocha.js src/**/*.spec.ts",
         "deploy-function": "npm run build-function && cd dist/function && func azure functionapp publish < function app name >",
         "publish": "webpack --config webpack.publisher.js && node dist/publisher/index.js && npm run serve-website",
@@ -29,94 +28,92 @@
         "lint:fix": "eslint src/**/*.ts --fix"
     },
     "devDependencies": {
-        "@azure/storage-blob": "12.13.0",
-        "@types/chai": "^4.3.4",
+        "@azure/storage-blob": "12.14.0",
+        "@types/chai": "^4.3.5",
         "@types/google-maps": "^3.2.3",
         "@types/knockout": "^3.4.72",
         "@types/knockout.mapping": "^2.0.37",
-        "@types/knockout.validation": "0.0.38",
+        "@types/knockout.validation": "0.0.39",
         "@types/mime": "^3.0.1",
         "@types/mocha": "10.0.1",
-        "@types/node": "^18.15.3",
-        "@types/puppeteer": "5.4.7",
-        "@typescript-eslint/eslint-plugin": "^5.55.0",
-        "@typescript-eslint/parser": "^5.55.0",
+        "@types/node": "^20.3.1",
+        "@typescript-eslint/eslint-plugin": "^5.60.0",
+        "@typescript-eslint/parser": "^5.60.0",
         "autoprefixer": "^10.4.14",
         "buffer": "^6.0.3",
         "chai": "^4.3.7",
         "clean-webpack-plugin": "4.0.0",
         "copy-webpack-plugin": "^11.0.0",
-        "css-loader": "^6.7.3",
-        "eslint": "^8.36.0",
+        "css-loader": "^6.8.1",
+        "eslint": "^8.43.0",
         "file-loader": "^6.2.0",
         "html-loader": "^4.2.0",
-        "mini-css-extract-plugin": "^2.7.3",
+        "mini-css-extract-plugin": "^2.7.6",
         "mocha": "^10.2.0",
         "path": "^0.12.7",
-        "postcss-loader": "^7.0.2",
-        "puppeteer": "19.7.5",
+        "postcss-loader": "^7.3.3",
         "querystring-es3": "^0.2.1",
         "raw-loader": "^4.0.2",
-        "sass": "^1.59.3",
-        "sass-loader": "^13.2.0",
+        "sass": "^1.63.6",
+        "sass-loader": "^13.3.2",
         "stream-browserify": "^3.0.0",
-        "style-loader": "^3.3.2",
-        "terser-webpack-plugin": "^5.3.7",
-        "ts-loader": "^9.4.2",
+        "style-loader": "^3.3.3",
+        "terser-webpack-plugin": "^5.3.9",
+        "ts-loader": "^9.4.3",
         "ts-node": "10.9.1",
         "typescript": "^4.9.5",
-        "url-loader": "^4.1.1",
-        "webpack": "5.76.1",
-        "webpack-cli": "5.0.1",
-        "webpack-dev-server": "4.12.0",
-        "webpack-merge": "5.8.0"
+        "webpack": "5.88.0",
+        "webpack-cli": "5.1.4",
+        "webpack-dev-server": "4.15.1",
+        "webpack-merge": "5.9.0",
+        "playwright": "1.35.1",
+        "@playwright/test": "1.35.1"
     },
-  "dependencies": {
-    "@azure/api-management-custom-widgets-scaffolder": "^1.0.0-beta.2",
-    "@azure/api-management-custom-widgets-tools": "^1.0.0-beta.1",
-    "@azure/msal-browser": "^2.34.0",
-    "@braintree/sanitize-url": "6.0.2",
-    "@microsoft/applicationinsights-web": "^2.8.11",
-    "@monaco-editor/loader": "^1.3.2",
-    "@paperbits/azure": "0.1.587",
-    "@paperbits/common": "0.1.587",
-    "@paperbits/core": "0.1.587",
-    "@paperbits/forms": "0.1.587",
-    "@paperbits/prosemirror": "0.1.587",
-    "@paperbits/styles": "0.1.587",
-    "@webcomponents/custom-elements": "1.5.1",
-    "@webcomponents/shadydom": "^1.10.0",
-    "client-oauth2": "4.3.3",
-    "codemirror": "^5.65.5",
-    "core-js": "^3.29.1",
-    "d3": "7.8.2",
-    "file-saver": "^2.0.5",
-    "google-maps": "^4.3.3",
-    "graphql": "^15.5.0",
-    "graphql-config": "^4.0.1",
-    "graphql-language-service": "3.1.6",
-    "idb-keyval": "^6.2.0",
-    "js-beautify": "^1.14.7",
-    "knockout": "^3.5.1",
-    "knockout-mapping": "^2.6.0",
-    "knockout.validation": "^2.0.4",
-    "liquidjs": "^10.6.1",
-    "lunr": "^2.3.9",
-    "mime": "^3.0.0",
-    "moment": "^2.29.4",
-    "monaco-editor": "^0.29.1",
-    "msal": "^1.4.17",
-    "prettier": "^2.8.4",
-    "prismjs": "^1.29.0",
-    "rehype-raw": "^6.1.1",
-    "rehype-sanitize": "^5.0.1",
-    "rehype-stringify": "^9.0.3",
-    "remark": "^14.0.2",
-    "remark-gfm": "^3.0.1",
-    "remark-parse": "^10.0.1",
-    "remark-rehype": "^10.1.0",
-    "saxen": "^8.1.2",
-    "topojson-client": "^3.1.0",
-    "html-truncate": "1.2.2"
-  }
-}
+    "dependencies": {
+        "@azure/api-management-custom-widgets-scaffolder": "^1.0.0-beta.2",
+        "@azure/api-management-custom-widgets-tools": "^1.0.0-beta.1",
+        "@azure/msal-browser": "^2.37.1",
+        "@braintree/sanitize-url": "6.0.2",
+        "@microsoft/applicationinsights-web": "^3.0.2",
+        "@monaco-editor/loader": "^1.3.3",
+        "@paperbits/azure": "0.1.590",
+        "@paperbits/common": "0.1.590",
+        "@paperbits/core": "0.1.590",
+        "@paperbits/forms": "0.1.590",
+        "@paperbits/styles": "0.1.590",
+        "@webcomponents/custom-elements": "1.6.0",
+        "@webcomponents/shadydom": "^1.11.0",
+        "client-oauth2": "4.3.3",
+        "codemirror": "^6.0.1",
+        "core-js": "^3.31.0",
+        "d3": "7.8.5",
+        "file-saver": "^2.0.5",
+        "google-maps": "^4.3.3",
+        "graphql": "^15.5.0",
+        "graphql-config": "^4.0.1",
+        "graphql-language-service": "3.1.6",
+        "idb-keyval": "^6.2.1",
+        "js-beautify": "^1.14.8",
+        "knockout": "^3.5.1",
+        "knockout-mapping": "^2.6.0",
+        "knockout.validation": "^2.0.4",
+        "liquidjs": "^10.8.3",
+        "lunr": "^2.3.9",
+        "mime": "^3.0.0",
+        "moment": "^2.29.4",
+        "monaco-editor": "^0.29.1",
+        "msal": "^1.4.18",
+        "prettier": "^2.8.8",
+        "prismjs": "^1.29.0",
+        "rehype-raw": "^6.1.1",
+        "rehype-sanitize": "^5.0.1",
+        "rehype-stringify": "^9.0.3",
+        "remark": "^14.0.3",
+        "remark-gfm": "^3.0.1",
+        "remark-parse": "^10.0.2",
+        "remark-rehype": "^10.1.0",
+        "saxen": "^8.1.2",
+        "topojson-client": "^3.1.0",
+        "html-truncate": "1.2.2"
+    }
+}

package.json

@@ -0,0 +1,8 @@
+import { defineConfig } from '@playwright/test';
+
+export default defineConfig({
+  retries: 2,
+  use: {
+    video: 'retain-on-failure'
+  }
+});