From c7022bc913d6377d93afae69bc32aad55b234487 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Sat, 14 Oct 2023 01:07:09 +0200 Subject: [PATCH 01/68] Added new workflow for the new web package --- .github/workflows/visual-ci-new.yaml | 34 ++++++++++++++++++++++++++++ 1 file changed, 34 insertions(+) create mode 100644 .github/workflows/visual-ci-new.yaml diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml new file mode 100644 index 000000000..a09d42583 --- /dev/null +++ b/.github/workflows/visual-ci-new.yaml @@ -0,0 +1,34 @@ +name: Visual Testing Pipeline + +on: + pull_request: + paths-ignore: + - "**.md" + - "**.png" + - "**.drawio" + - "**.xlsx" + +jobs: + setup-and-visual-test: + runs-on: ubuntu-latest + + steps: + - name: Checkout + uses: actions/checkout@v2 + + - name: Use Node.js 16 + uses: actions/setup-node@v1 + with: + node-version: "16.x" + + - name: Use lerna + run: npm install -g lerna@6.6.2 + + - name: Bootstrap + run: lerna bootstrap --no-ci + + - name: Visual Test + run: | + cd ./packages/web-new + npm install + npm run test \ No newline at end of file From 963db0a4397f10437fc8077dc887fb97914a8380 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Sat, 14 Oct 2023 01:14:22 +0200 Subject: [PATCH 02/68] Added test script --- packages/web-new/package.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/web-new/package.json b/packages/web-new/package.json index 3a0af097b..bca535160 100644 --- a/packages/web-new/package.json +++ b/packages/web-new/package.json @@ -18,7 +18,8 @@ "build": "node external-scripts/generate-paths.js && webpack --mode production", "dev": "webpack serve --mode development", "serve": "node server/server.js", - "examples": "node external-scripts/generate-paths.js" + "examples": "node external-scripts/generate-paths.js", + "test": "npx playwright test" }, "devDependencies": { "@babel/core": "^7.22.9", From 03177784760a8a1144bf1d4b6d0076698fd31691 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Sat, 14 Oct 2023 01:19:13 +0200 Subject: [PATCH 03/68] Installing supported browsers --- .github/workflows/visual-ci-new.yaml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index a09d42583..aa54c43bb 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -27,8 +27,9 @@ jobs: - name: Bootstrap run: lerna bootstrap --no-ci - - name: Visual Test + - name: New Web Visual Test run: | cd ./packages/web-new npm install + npx playwright install npm run test \ No newline at end of file From b0aa4e7a5ca49b70055cb13aff3afd844f24e17d Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Wed, 15 Nov 2023 18:48:13 +0100 Subject: [PATCH 04/68] Fixed conflict with package.json --- packages/web-new/package.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/web-new/package.json b/packages/web-new/package.json index bca535160..53bb4afb0 100644 --- a/packages/web-new/package.json +++ b/packages/web-new/package.json @@ -19,7 +19,8 @@ "dev": "webpack serve --mode development", "serve": "node server/server.js", "examples": "node external-scripts/generate-paths.js", - "test": "npx playwright test" + "test": "npx playwright test --project=chromium --project=firefox", + "test-full": "npx playwright test" }, "devDependencies": { "@babel/core": "^7.22.9", From b12e7ab5106a56d6fe1464995abf38306e937fb1 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Mon, 20 Nov 2023 05:46:55 +0100 Subject: [PATCH 05/68] Updating to the newer version --- .github/workflows/visual-ci-new.yaml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index aa54c43bb..625736bf6 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -14,10 +14,10 @@ jobs: steps: - name: Checkout - uses: actions/checkout@v2 + uses: actions/checkout@v3 - name: Use Node.js 16 - uses: actions/setup-node@v1 + uses: actions/setup-node@v3 with: node-version: "16.x" From d15b65ad25e93e24fa521604d493929c860c5531 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Sat, 14 Oct 2023 01:07:09 +0200 Subject: [PATCH 06/68] Added new workflow for the new web package --- .github/workflows/visual-ci-new.yaml | 34 ++++++++++++++++++++++++++++ 1 file changed, 34 insertions(+) create mode 100644 .github/workflows/visual-ci-new.yaml diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml new file mode 100644 index 000000000..a09d42583 --- /dev/null +++ b/.github/workflows/visual-ci-new.yaml @@ -0,0 +1,34 @@ +name: Visual Testing Pipeline + +on: + pull_request: + paths-ignore: + - "**.md" + - "**.png" + - "**.drawio" + - "**.xlsx" + +jobs: + setup-and-visual-test: + runs-on: ubuntu-latest + + steps: + - name: Checkout + uses: actions/checkout@v2 + + - name: Use Node.js 16 + uses: actions/setup-node@v1 + with: + node-version: "16.x" + + - name: Use lerna + run: npm install -g lerna@6.6.2 + + - name: Bootstrap + run: lerna bootstrap --no-ci + + - name: Visual Test + run: | + cd ./packages/web-new + npm install + npm run test \ No newline at end of file From 08d8da641a9561ecd815775e16ee423ed06f379f Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Sat, 14 Oct 2023 01:19:13 +0200 Subject: [PATCH 07/68] Installing supported browsers --- .github/workflows/visual-ci-new.yaml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index a09d42583..aa54c43bb 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -27,8 +27,9 @@ jobs: - name: Bootstrap run: lerna bootstrap --no-ci - - name: Visual Test + - name: New Web Visual Test run: | cd ./packages/web-new npm install + npx playwright install npm run test \ No newline at end of file From 45f3bb5d78b4217d603b5ac7b2448bfd4f8509e1 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Mon, 20 Nov 2023 05:46:55 +0100 Subject: [PATCH 08/68] Updating to the newer version --- .github/workflows/visual-ci-new.yaml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index aa54c43bb..625736bf6 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -14,10 +14,10 @@ jobs: steps: - name: Checkout - uses: actions/checkout@v2 + uses: actions/checkout@v3 - name: Use Node.js 16 - uses: actions/setup-node@v1 + uses: actions/setup-node@v3 with: node-version: "16.x" From a12461ac787f8dac6e1f08e7781f11bf62882f33 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Sat, 14 Oct 2023 01:07:09 +0200 Subject: [PATCH 09/68] Added new workflow for the new web package --- .github/workflows/visual-ci-new.yaml | 34 ++++++++++++++++++++++++++++ 1 file changed, 34 insertions(+) create mode 100644 .github/workflows/visual-ci-new.yaml diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml new file mode 100644 index 000000000..a09d42583 --- /dev/null +++ b/.github/workflows/visual-ci-new.yaml @@ -0,0 +1,34 @@ +name: Visual Testing Pipeline + +on: + pull_request: + paths-ignore: + - "**.md" + - "**.png" + - "**.drawio" + - "**.xlsx" + +jobs: + setup-and-visual-test: + runs-on: ubuntu-latest + + steps: + - name: Checkout + uses: actions/checkout@v2 + + - name: Use Node.js 16 + uses: actions/setup-node@v1 + with: + node-version: "16.x" + + - name: Use lerna + run: npm install -g lerna@6.6.2 + + - name: Bootstrap + run: lerna bootstrap --no-ci + + - name: Visual Test + run: | + cd ./packages/web-new + npm install + npm run test \ No newline at end of file From 692e77c029482b37787630d9de787b2a0c5b66cd Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Sat, 14 Oct 2023 01:19:13 +0200 Subject: [PATCH 10/68] Installing supported browsers --- .github/workflows/visual-ci-new.yaml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index a09d42583..aa54c43bb 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -27,8 +27,9 @@ jobs: - name: Bootstrap run: lerna bootstrap --no-ci - - name: Visual Test + - name: New Web Visual Test run: | cd ./packages/web-new npm install + npx playwright install npm run test \ No newline at end of file From 76ad43d164075c1454391d85149d802c956ebf81 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Mon, 20 Nov 2023 05:46:55 +0100 Subject: [PATCH 11/68] Updating to the newer version --- .github/workflows/visual-ci-new.yaml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index aa54c43bb..625736bf6 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -14,10 +14,10 @@ jobs: steps: - name: Checkout - uses: actions/checkout@v2 + uses: actions/checkout@v3 - name: Use Node.js 16 - uses: actions/setup-node@v1 + uses: actions/setup-node@v3 with: node-version: "16.x" From 4dd3caaee39858445b4a29191ab9837c573c2f37 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Thu, 21 Dec 2023 11:34:18 +0100 Subject: [PATCH 12/68] Increased the timeout limit By utilizing the information about the duration of the new tests (which should be around 15 - 16 minutes in optimal conditions), the new timeout limit has been increased to 18 minutes to account for the duration of the tests as well as a small extra leeway to account for any other possible delays --- .github/workflows/visual-ci-new.yaml | 1 + 1 file changed, 1 insertion(+) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 625736bf6..14f03bc94 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -28,6 +28,7 @@ jobs: run: lerna bootstrap --no-ci - name: New Web Visual Test + timeout-minutes: 18 run: | cd ./packages/web-new npm install From cbd11caeba699f85131d2709ea334d720e4ceb91 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Thu, 21 Dec 2023 11:35:31 +0100 Subject: [PATCH 13/68] . --- .github/workflows/visual-ci-new.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 14f03bc94..d6490ea7c 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -28,7 +28,7 @@ jobs: run: lerna bootstrap --no-ci - name: New Web Visual Test - timeout-minutes: 18 + timeout-minutes: 18 run: | cd ./packages/web-new npm install From 528ba51ca401c51e6f51dd6396e2470087e3c191 Mon Sep 17 00:00:00 2001 From: Ege Korkan Date: Wed, 27 Dec 2023 11:04:05 +0100 Subject: [PATCH 14/68] Update visual-ci-new.yaml --- .github/workflows/visual-ci-new.yaml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index d6490ea7c..f9b443b43 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -1,4 +1,4 @@ -name: Visual Testing Pipeline +name: web-new Visual Testing Pipeline on: pull_request: @@ -33,4 +33,4 @@ jobs: cd ./packages/web-new npm install npx playwright install - npm run test \ No newline at end of file + npm run test From b9c4058c0ecf648e96242b33ed3f9e21e5e152ab Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Thu, 21 Dec 2023 11:34:18 +0100 Subject: [PATCH 15/68] Increased the timeout limit By utilizing the information about the duration of the new tests (which should be around 15 - 16 minutes in optimal conditions), the new timeout limit has been increased to 18 minutes to account for the duration of the tests as well as a small extra leeway to account for any other possible delays --- .github/workflows/visual-ci-new.yaml | 1 + 1 file changed, 1 insertion(+) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 625736bf6..14f03bc94 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -28,6 +28,7 @@ jobs: run: lerna bootstrap --no-ci - name: New Web Visual Test + timeout-minutes: 18 run: | cd ./packages/web-new npm install From 4f687d8ad4cb6cc4b8210256e2795681b69b0525 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Thu, 21 Dec 2023 11:35:31 +0100 Subject: [PATCH 16/68] . --- .github/workflows/visual-ci-new.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 14f03bc94..d6490ea7c 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -28,7 +28,7 @@ jobs: run: lerna bootstrap --no-ci - name: New Web Visual Test - timeout-minutes: 18 + timeout-minutes: 18 run: | cd ./packages/web-new npm install From 270ebbdb7e63aae21cbc4c90a24bd69f315d31a6 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 06:30:40 +0100 Subject: [PATCH 17/68] Modify the playwright config file to work with the CI pipeline --- .github/workflows/visual-ci-new.yaml | 6 +- packages/web-new/package-lock.json | 92 +++++++++++++++++++++++++++ packages/web-new/package.json | 1 + packages/web-new/playwright.config.js | 38 ++++++++--- 4 files changed, 126 insertions(+), 11 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index f9b443b43..bb017b706 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -16,10 +16,10 @@ jobs: - name: Checkout uses: actions/checkout@v3 - - name: Use Node.js 16 + - name: Use Node.js 18 uses: actions/setup-node@v3 with: - node-version: "16.x" + node-version: "18.x" - name: Use lerna run: npm install -g lerna@6.6.2 @@ -32,5 +32,5 @@ jobs: run: | cd ./packages/web-new npm install - npx playwright install + npx playwright install chromium firefox npm run test diff --git a/packages/web-new/package-lock.json b/packages/web-new/package-lock.json index 8785b8049..367b4630a 100644 --- a/packages/web-new/package-lock.json +++ b/packages/web-new/package-lock.json @@ -35,6 +35,7 @@ "nodemon": "^3.0.1", "sass": "^1.64.0", "sass-loader": "^13.3.2", + "serve-handler": "^6.1.5", "style-loader": "^3.3.3", "webpack": "^5.88.2", "webpack-bundle-analyzer": "^4.9.0", @@ -4130,6 +4131,21 @@ "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==", "dev": true }, + "node_modules/fast-url-parser": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/fast-url-parser/-/fast-url-parser-1.1.3.tgz", + "integrity": "sha512-5jOCVXADYNuRkKFzNJ0dCCewsZiYo0dz8QNYljkOpFC6r2U4OBmKtvm/Tsuh4w1YYdDqDb31a8TVhBJ2OJKdqQ==", + "dev": true, + "dependencies": { + "punycode": "^1.3.2" + } + }, + "node_modules/fast-url-parser/node_modules/punycode": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz", + "integrity": "sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==", + "dev": true + }, "node_modules/fastest-levenshtein": { "version": "1.0.16", "resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz", @@ -5906,6 +5922,12 @@ "node": ">=0.10.0" } }, + "node_modules/path-is-inside": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz", + "integrity": "sha512-DUWJr3+ULp4zXmol/SZkFf3JGsS9/SIv+Y3Rt93/UjPpDpklB5f1er4O3POIbUuUJ3FXgqte2Q7SrU6zAqwk8w==", + "dev": true + }, "node_modules/path-key": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz", @@ -7065,6 +7087,76 @@ "randombytes": "^2.1.0" } }, + "node_modules/serve-handler": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/serve-handler/-/serve-handler-6.1.5.tgz", + "integrity": "sha512-ijPFle6Hwe8zfmBxJdE+5fta53fdIY0lHISJvuikXB3VYFafRjMRpOffSPvCYsbKyBA7pvy9oYr/BT1O3EArlg==", + "dev": true, + "dependencies": { + "bytes": "3.0.0", + "content-disposition": "0.5.2", + "fast-url-parser": "1.1.3", + "mime-types": "2.1.18", + "minimatch": "3.1.2", + "path-is-inside": "1.0.2", + "path-to-regexp": "2.2.1", + "range-parser": "1.2.0" + } + }, + "node_modules/serve-handler/node_modules/bytes": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz", + "integrity": "sha512-pMhOfFDPiv9t5jjIXkHosWmkSyQbvsgEVNkz0ERHbuLh2T/7j4Mqqpz523Fe8MVY89KC6Sh/QfS2sM+SjgFDcw==", + "dev": true, + "engines": { + "node": ">= 0.8" + } + }, + "node_modules/serve-handler/node_modules/content-disposition": { + "version": "0.5.2", + "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz", + "integrity": "sha512-kRGRZw3bLlFISDBgwTSA1TMBFN6J6GWDeubmDE3AF+3+yXL8hTWv8r5rkLbqYXY4RjPk/EzHnClI3zQf1cFmHA==", + "dev": true, + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/serve-handler/node_modules/mime-db": { + "version": "1.33.0", + "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.33.0.tgz", + "integrity": "sha512-BHJ/EKruNIqJf/QahvxwQZXKygOQ256myeN/Ew+THcAa5q+PjyTTMMeNQC4DZw5AwfvelsUrA6B67NKMqXDbzQ==", + "dev": true, + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/serve-handler/node_modules/mime-types": { + "version": "2.1.18", + "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.18.tgz", + "integrity": "sha512-lc/aahn+t4/SWV/qcmumYjymLsWfN3ELhpmVuUFjgsORruuZPVSwAQryq+HHGvO/SI2KVX26bx+En+zhM8g8hQ==", + "dev": true, + "dependencies": { + "mime-db": "~1.33.0" + }, + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/serve-handler/node_modules/path-to-regexp": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-2.2.1.tgz", + "integrity": "sha512-gu9bD6Ta5bwGrrU8muHzVOBFFREpp2iRkVfhBJahwJ6p6Xw20SjT0MxLnwkjOibQmGSYhiUnf2FLe7k+jcFmGQ==", + "dev": true + }, + "node_modules/serve-handler/node_modules/range-parser": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz", + "integrity": "sha512-kA5WQoNVo4t9lNx2kQNFCxKeBl5IbbSNBl1M/tLkw9WCn+hxNBAW5Qh8gdhs63CJnhjJ2zQWFoqPJP2sK1AV5A==", + "dev": true, + "engines": { + "node": ">= 0.6" + } + }, "node_modules/serve-index": { "version": "1.9.1", "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.1.tgz", diff --git a/packages/web-new/package.json b/packages/web-new/package.json index a40af23af..d47a7fe88 100644 --- a/packages/web-new/package.json +++ b/packages/web-new/package.json @@ -37,6 +37,7 @@ "nodemon": "^3.0.1", "sass": "^1.64.0", "sass-loader": "^13.3.2", + "serve-handler": "^6.1.5", "style-loader": "^3.3.3", "webpack": "^5.88.2", "webpack-bundle-analyzer": "^4.9.0", diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index 9e18e04c0..b8286bf99 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -14,8 +14,30 @@ ********************************************************************************/ // @ts-check const { defineConfig, devices } = require('@playwright/test'); +const handler = require("serve-handler"); +const http = require("http"); -// require('dotenv').config(); +const isCI = process.env.CI; +console.log(process.env); +console.log(isCI); + +if (isCI) { + const port = 3000; + const host = "http://localhost"; + const fullHost = host + ":" + port; + + const server = http.createServer((request, response) => { + // You pass two more arguments for config and middleware + // More details here: https://github.com/vercel/serve-handler#options + return handler(request, response); + }); + + /* ################### */ + /* MAIN */ + server.listen(port, () => { + console.log("Running siteTest at " + fullHost); + }); +} module.exports = defineConfig({ testDir: './tests', @@ -24,17 +46,17 @@ module.exports = defineConfig({ /* Run tests in files in parallel */ fullyParallel: true, /* Fail the build on CI if you accidentally left test.only in the source code. */ - forbidOnly: !!process.env.CI, + forbidOnly: !!isCI, /* Retry on CI only */ - retries: process.env.CI ? 2 : 0, + retries: isCI ? 2 : 0, /* Opt out of parallel tests on CI. */ - workers: process.env.CI ? 1 : undefined, + workers: isCI ? 1 : undefined, /* Reporter to use. See https://playwright.dev/docs/test-reporters */ reporter: 'html', /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: 'http://127.0.0.1:5100', + baseURL: isCI ? 'http://localhost:3000' : 'http://127.0.0.1:5100', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -66,8 +88,8 @@ module.exports = defineConfig({ /* Run your local dev server before starting the tests */ webServer: { - command: 'npm run serve', - url: 'http://127.0.0.1:5100', - reuseExistingServer: !process.env.CI, + command: isCI ? '' : 'npm run serve', + url: isCI ? 'http://localhost:3000' : 'http://127.0.0.1:5100', + reuseExistingServer: !isCI, }, }); From dfebc1070902d5acb776dbf0b05b2147ff2a320e Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 06:37:48 +0100 Subject: [PATCH 18/68] . --- packages/web-new/playwright.config.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index b8286bf99..c47b732d4 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -22,7 +22,7 @@ console.log(process.env); console.log(isCI); if (isCI) { - const port = 3000; + const port = 5101; const host = "http://localhost"; const fullHost = host + ":" + port; @@ -56,7 +56,7 @@ module.exports = defineConfig({ /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: isCI ? 'http://localhost:3000' : 'http://127.0.0.1:5100', + baseURL: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -89,7 +89,7 @@ module.exports = defineConfig({ /* Run your local dev server before starting the tests */ webServer: { command: isCI ? '' : 'npm run serve', - url: isCI ? 'http://localhost:3000' : 'http://127.0.0.1:5100', + url: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', reuseExistingServer: !isCI, }, }); From 5ebeb26449dc07da8806236a346a9a506c932f44 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 06:45:12 +0100 Subject: [PATCH 19/68] Testing different ports --- packages/web-new/playwright.config.js | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index c47b732d4..daac56143 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -18,11 +18,9 @@ const handler = require("serve-handler"); const http = require("http"); const isCI = process.env.CI; -console.log(process.env); -console.log(isCI); if (isCI) { - const port = 5101; + const port = 8080; const host = "http://localhost"; const fullHost = host + ":" + port; @@ -56,7 +54,7 @@ module.exports = defineConfig({ /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', + baseURL: isCI ? 'http://localhost:8080' : 'http://127.0.0.1:5100', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -89,7 +87,7 @@ module.exports = defineConfig({ /* Run your local dev server before starting the tests */ webServer: { command: isCI ? '' : 'npm run serve', - url: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', + url: isCI ? 'http://localhost:8080' : 'http://127.0.0.1:5100', reuseExistingServer: !isCI, }, }); From 76abc48166a471ef6421b6e418b277ed6f4e4db4 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 06:54:12 +0100 Subject: [PATCH 20/68] . --- packages/web-new/playwright.config.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index daac56143..44b0326f9 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -20,7 +20,7 @@ const http = require("http"); const isCI = process.env.CI; if (isCI) { - const port = 8080; + const port = 5101; const host = "http://localhost"; const fullHost = host + ":" + port; @@ -54,7 +54,7 @@ module.exports = defineConfig({ /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: isCI ? 'http://localhost:8080' : 'http://127.0.0.1:5100', + baseURL: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -87,7 +87,7 @@ module.exports = defineConfig({ /* Run your local dev server before starting the tests */ webServer: { command: isCI ? '' : 'npm run serve', - url: isCI ? 'http://localhost:8080' : 'http://127.0.0.1:5100', - reuseExistingServer: !isCI, - }, + url: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', + reuseExistingServer: true, + } }); From d6cf68f9f7db6e4fc16ae3e2402ef2393f933b1c Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:00:05 +0100 Subject: [PATCH 21/68] removing unnecesary dependencies --- packages/web-new/package-lock.json | 92 --------------------------- packages/web-new/package.json | 1 - packages/web-new/playwright.config.js | 26 +------- 3 files changed, 3 insertions(+), 116 deletions(-) diff --git a/packages/web-new/package-lock.json b/packages/web-new/package-lock.json index 367b4630a..8785b8049 100644 --- a/packages/web-new/package-lock.json +++ b/packages/web-new/package-lock.json @@ -35,7 +35,6 @@ "nodemon": "^3.0.1", "sass": "^1.64.0", "sass-loader": "^13.3.2", - "serve-handler": "^6.1.5", "style-loader": "^3.3.3", "webpack": "^5.88.2", "webpack-bundle-analyzer": "^4.9.0", @@ -4131,21 +4130,6 @@ "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==", "dev": true }, - "node_modules/fast-url-parser": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/fast-url-parser/-/fast-url-parser-1.1.3.tgz", - "integrity": "sha512-5jOCVXADYNuRkKFzNJ0dCCewsZiYo0dz8QNYljkOpFC6r2U4OBmKtvm/Tsuh4w1YYdDqDb31a8TVhBJ2OJKdqQ==", - "dev": true, - "dependencies": { - "punycode": "^1.3.2" - } - }, - "node_modules/fast-url-parser/node_modules/punycode": { - "version": "1.4.1", - "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz", - "integrity": "sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==", - "dev": true - }, "node_modules/fastest-levenshtein": { "version": "1.0.16", "resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz", @@ -5922,12 +5906,6 @@ "node": ">=0.10.0" } }, - "node_modules/path-is-inside": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz", - "integrity": "sha512-DUWJr3+ULp4zXmol/SZkFf3JGsS9/SIv+Y3Rt93/UjPpDpklB5f1er4O3POIbUuUJ3FXgqte2Q7SrU6zAqwk8w==", - "dev": true - }, "node_modules/path-key": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz", @@ -7087,76 +7065,6 @@ "randombytes": "^2.1.0" } }, - "node_modules/serve-handler": { - "version": "6.1.5", - "resolved": "https://registry.npmjs.org/serve-handler/-/serve-handler-6.1.5.tgz", - "integrity": "sha512-ijPFle6Hwe8zfmBxJdE+5fta53fdIY0lHISJvuikXB3VYFafRjMRpOffSPvCYsbKyBA7pvy9oYr/BT1O3EArlg==", - "dev": true, - "dependencies": { - "bytes": "3.0.0", - "content-disposition": "0.5.2", - "fast-url-parser": "1.1.3", - "mime-types": "2.1.18", - "minimatch": "3.1.2", - "path-is-inside": "1.0.2", - "path-to-regexp": "2.2.1", - "range-parser": "1.2.0" - } - }, - "node_modules/serve-handler/node_modules/bytes": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz", - "integrity": "sha512-pMhOfFDPiv9t5jjIXkHosWmkSyQbvsgEVNkz0ERHbuLh2T/7j4Mqqpz523Fe8MVY89KC6Sh/QfS2sM+SjgFDcw==", - "dev": true, - "engines": { - "node": ">= 0.8" - } - }, - "node_modules/serve-handler/node_modules/content-disposition": { - "version": "0.5.2", - "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz", - "integrity": "sha512-kRGRZw3bLlFISDBgwTSA1TMBFN6J6GWDeubmDE3AF+3+yXL8hTWv8r5rkLbqYXY4RjPk/EzHnClI3zQf1cFmHA==", - "dev": true, - "engines": { - "node": ">= 0.6" - } - }, - "node_modules/serve-handler/node_modules/mime-db": { - "version": "1.33.0", - "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.33.0.tgz", - "integrity": "sha512-BHJ/EKruNIqJf/QahvxwQZXKygOQ256myeN/Ew+THcAa5q+PjyTTMMeNQC4DZw5AwfvelsUrA6B67NKMqXDbzQ==", - "dev": true, - "engines": { - "node": ">= 0.6" - } - }, - "node_modules/serve-handler/node_modules/mime-types": { - "version": "2.1.18", - "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.18.tgz", - "integrity": "sha512-lc/aahn+t4/SWV/qcmumYjymLsWfN3ELhpmVuUFjgsORruuZPVSwAQryq+HHGvO/SI2KVX26bx+En+zhM8g8hQ==", - "dev": true, - "dependencies": { - "mime-db": "~1.33.0" - }, - "engines": { - "node": ">= 0.6" - } - }, - "node_modules/serve-handler/node_modules/path-to-regexp": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-2.2.1.tgz", - "integrity": "sha512-gu9bD6Ta5bwGrrU8muHzVOBFFREpp2iRkVfhBJahwJ6p6Xw20SjT0MxLnwkjOibQmGSYhiUnf2FLe7k+jcFmGQ==", - "dev": true - }, - "node_modules/serve-handler/node_modules/range-parser": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz", - "integrity": "sha512-kA5WQoNVo4t9lNx2kQNFCxKeBl5IbbSNBl1M/tLkw9WCn+hxNBAW5Qh8gdhs63CJnhjJ2zQWFoqPJP2sK1AV5A==", - "dev": true, - "engines": { - "node": ">= 0.6" - } - }, "node_modules/serve-index": { "version": "1.9.1", "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.1.tgz", diff --git a/packages/web-new/package.json b/packages/web-new/package.json index d47a7fe88..a40af23af 100644 --- a/packages/web-new/package.json +++ b/packages/web-new/package.json @@ -37,7 +37,6 @@ "nodemon": "^3.0.1", "sass": "^1.64.0", "sass-loader": "^13.3.2", - "serve-handler": "^6.1.5", "style-loader": "^3.3.3", "webpack": "^5.88.2", "webpack-bundle-analyzer": "^4.9.0", diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index 44b0326f9..36d9a5447 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -14,29 +14,9 @@ ********************************************************************************/ // @ts-check const { defineConfig, devices } = require('@playwright/test'); -const handler = require("serve-handler"); -const http = require("http"); const isCI = process.env.CI; -if (isCI) { - const port = 5101; - const host = "http://localhost"; - const fullHost = host + ":" + port; - - const server = http.createServer((request, response) => { - // You pass two more arguments for config and middleware - // More details here: https://github.com/vercel/serve-handler#options - return handler(request, response); - }); - - /* ################### */ - /* MAIN */ - server.listen(port, () => { - console.log("Running siteTest at " + fullHost); - }); -} - module.exports = defineConfig({ testDir: './tests', // Folder for test artifacts such as screenshots, videos, traces, etc. @@ -54,7 +34,7 @@ module.exports = defineConfig({ /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', + baseURL: isCI ? 'https://deploy-preview-515--thingweb-playground.netlify.app' : 'http://127.0.0.1:5100', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -87,7 +67,7 @@ module.exports = defineConfig({ /* Run your local dev server before starting the tests */ webServer: { command: isCI ? '' : 'npm run serve', - url: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', - reuseExistingServer: true, + url: isCI ? 'https://deploy-preview-515--thingweb-playground.netlify.app' : 'http://127.0.0.1:5100', + reuseExistingServer: !isCI, } }); From 55f4685da933acbe214c082cc8bc193837805dd1 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:09:51 +0100 Subject: [PATCH 22/68] creating the server in the playwright config file --- packages/web-new/playwright.config.js | 26 ++++++++++++++++++++------ 1 file changed, 20 insertions(+), 6 deletions(-) diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index 36d9a5447..9f446c12b 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -15,6 +15,20 @@ // @ts-check const { defineConfig, devices } = require('@playwright/test'); +//server +const express = require('express') +const port = 5100 + +const app = express() + +//Middleware +app.use(express.json()) +app.use(express.urlencoded({extended: false})) + +app.use('/', express.static('./dist/')) + +app.listen(port, () => console.log(`Running siteTest on port ${port}`)) + const isCI = process.env.CI; module.exports = defineConfig({ @@ -34,7 +48,7 @@ module.exports = defineConfig({ /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: isCI ? 'https://deploy-preview-515--thingweb-playground.netlify.app' : 'http://127.0.0.1:5100', + baseURL: 'http://127.0.0.1:5100', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -65,9 +79,9 @@ module.exports = defineConfig({ ], /* Run your local dev server before starting the tests */ - webServer: { - command: isCI ? '' : 'npm run serve', - url: isCI ? 'https://deploy-preview-515--thingweb-playground.netlify.app' : 'http://127.0.0.1:5100', - reuseExistingServer: !isCI, - } + // webServer: { + // command: isCI ? '' : 'npm run serve', + // url: isCI ? '' : 'http://127.0.0.1:5100', + // reuseExistingServer: !isCI, + // } }); From 2589c44cd0e5eb4ebaca2566234937d21f022b2a Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:23:24 +0100 Subject: [PATCH 23/68] adding a timeout --- packages/web-new/playwright.config.js | 25 ++++++------------------- 1 file changed, 6 insertions(+), 19 deletions(-) diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index 9f446c12b..bb8234249 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -15,20 +15,6 @@ // @ts-check const { defineConfig, devices } = require('@playwright/test'); -//server -const express = require('express') -const port = 5100 - -const app = express() - -//Middleware -app.use(express.json()) -app.use(express.urlencoded({extended: false})) - -app.use('/', express.static('./dist/')) - -app.listen(port, () => console.log(`Running siteTest on port ${port}`)) - const isCI = process.env.CI; module.exports = defineConfig({ @@ -79,9 +65,10 @@ module.exports = defineConfig({ ], /* Run your local dev server before starting the tests */ - // webServer: { - // command: isCI ? '' : 'npm run serve', - // url: isCI ? '' : 'http://127.0.0.1:5100', - // reuseExistingServer: !isCI, - // } + webServer: { + command: 'npm run serve', + url: 'http://127.0.0.1:5100', + timeout: 120 * 1000, + reuseExistingServer: !isCI, + } }); From e8aeeaaa47cc7e8da875a577d8d12350c7efbef7 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:40:07 +0100 Subject: [PATCH 24/68] trying default playwright settings --- .github/workflows/visual-ci-new.yaml | 85 ++++++++++++++++++---------- 1 file changed, 56 insertions(+), 29 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index bb017b706..08e313100 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -1,36 +1,63 @@ -name: web-new Visual Testing Pipeline +# name: web-new Visual Testing Pipeline -on: - pull_request: - paths-ignore: - - "**.md" - - "**.png" - - "**.drawio" - - "**.xlsx" +# on: +# pull_request: +# paths-ignore: +# - "**.md" +# - "**.png" +# - "**.drawio" +# - "**.xlsx" -jobs: - setup-and-visual-test: - runs-on: ubuntu-latest +# jobs: +# setup-and-visual-test: +# runs-on: ubuntu-latest - steps: - - name: Checkout - uses: actions/checkout@v3 +# steps: +# - name: Checkout +# uses: actions/checkout@v3 - - name: Use Node.js 18 - uses: actions/setup-node@v3 - with: - node-version: "18.x" +# - name: Use Node.js 18 +# uses: actions/setup-node@v3 +# with: +# node-version: "18.x" - - name: Use lerna - run: npm install -g lerna@6.6.2 +# - name: Use lerna +# run: npm install -g lerna@6.6.2 - - name: Bootstrap - run: lerna bootstrap --no-ci +# - name: Bootstrap +# run: lerna bootstrap --no-ci - - name: New Web Visual Test - timeout-minutes: 18 - run: | - cd ./packages/web-new - npm install - npx playwright install chromium firefox - npm run test +# - name: New Web Visual Test +# timeout-minutes: 18 +# run: | +# cd ./packages/web-new +# npm install +# npx playwright install chromium firefox +# npm run test +name: Playwright Tests +on: + push: + branches: [ main, master ] + pull_request: + branches: [ main, master ] +jobs: + test: + timeout-minutes: 60 + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v3 + - uses: actions/setup-node@v3 + with: + node-version: 18 + - name: Install dependencies + run: npm ci + - name: Install Playwright Browsers + run: npx playwright install chromium firefox + - name: Run Playwright tests + run: npx playwright test + - uses: actions/upload-artifact@v3 + if: always() + with: + name: playwright-report + path: playwright-report/ + retention-days: 30 From fecb91114ef06297efd01b0c33c69a76aa77d4b7 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:44:30 +0100 Subject: [PATCH 25/68] . --- .github/workflows/visual-ci-new.yaml | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 08e313100..25e4e19bc 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -52,9 +52,11 @@ jobs: - name: Install dependencies run: npm ci - name: Install Playwright Browsers - run: npx playwright install chromium firefox + run: + npm install + npx playwright install chromium firefox - name: Run Playwright tests - run: npx playwright test + run: npm run test - uses: actions/upload-artifact@v3 if: always() with: From 3fd0e2dabb6cbb091ae1ebcb9cc35296a9e67ff5 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:49:52 +0100 Subject: [PATCH 26/68] . --- .github/workflows/visual-ci-new.yaml | 1 + 1 file changed, 1 insertion(+) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 25e4e19bc..b629c9351 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -53,6 +53,7 @@ jobs: run: npm ci - name: Install Playwright Browsers run: + cd ./packages/web-new npm install npx playwright install chromium firefox - name: Run Playwright tests From 382db5032350550ae713cb30af9656704a01a30f Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:52:52 +0100 Subject: [PATCH 27/68] returning to original --- .github/workflows/visual-ci-new.yaml | 88 +++++++++------------------- 1 file changed, 29 insertions(+), 59 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index b629c9351..412eb4087 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -1,66 +1,36 @@ -# name: web-new Visual Testing Pipeline +name: web-new Visual Testing Pipeline -# on: -# pull_request: -# paths-ignore: -# - "**.md" -# - "**.png" -# - "**.drawio" -# - "**.xlsx" +on: + pull_request: + paths-ignore: + - "**.md" + - "**.png" + - "**.drawio" + - "**.xlsx" -# jobs: -# setup-and-visual-test: -# runs-on: ubuntu-latest +jobs: + setup-and-visual-test: + runs-on: ubuntu-latest -# steps: -# - name: Checkout -# uses: actions/checkout@v3 + steps: + - name: Checkout + uses: actions/checkout@v3 -# - name: Use Node.js 18 -# uses: actions/setup-node@v3 -# with: -# node-version: "18.x" + - name: Use Node.js 18 + uses: actions/setup-node@v3 + with: + node-version: "18.x" -# - name: Use lerna -# run: npm install -g lerna@6.6.2 + - name: Use lerna + run: npm install -g lerna@6.6.2 -# - name: Bootstrap -# run: lerna bootstrap --no-ci + - name: Bootstrap + run: lerna bootstrap --no-ci -# - name: New Web Visual Test -# timeout-minutes: 18 -# run: | -# cd ./packages/web-new -# npm install -# npx playwright install chromium firefox -# npm run test -name: Playwright Tests -on: - push: - branches: [ main, master ] - pull_request: - branches: [ main, master ] -jobs: - test: - timeout-minutes: 60 - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v3 - - uses: actions/setup-node@v3 - with: - node-version: 18 - - name: Install dependencies - run: npm ci - - name: Install Playwright Browsers - run: - cd ./packages/web-new - npm install - npx playwright install chromium firefox - - name: Run Playwright tests - run: npm run test - - uses: actions/upload-artifact@v3 - if: always() - with: - name: playwright-report - path: playwright-report/ - retention-days: 30 + - name: New Web Visual Test + timeout-minutes: 18 + run: | + cd ./packages/web-new + npm install + npx playwright install chromium firefox + npm run test \ No newline at end of file From 51ebc74cf2308c43884a8503739a9ddea059af0c Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 2 Feb 2024 15:34:02 +0100 Subject: [PATCH 28/68] added workflow changes --- .github/workflows/visual-ci-new.yaml | 74 ++++++++++++++++++++++++--- packages/web-new/playwright.config.js | 30 +++++------ 2 files changed, 83 insertions(+), 21 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 412eb4087..a9ee80361 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -1,3 +1,39 @@ +# name: web-new Visual Testing Pipeline + +# on: +# pull_request: +# paths-ignore: +# - "**.md" +# - "**.png" +# - "**.drawio" +# - "**.xlsx" + +# jobs: +# setup-and-visual-test: +# runs-on: ubuntu-latest + +# steps: +# - name: Checkout +# uses: actions/checkout@v3 + +# - name: Use Node.js 18 +# uses: actions/setup-node@v3 +# with: +# node-version: "18.x" + +# - name: Use lerna +# run: npm install -g lerna@6.6.2 + +# - name: Bootstrap +# run: lerna bootstrap --no-ci + +# - name: New Web Visual Test +# timeout-minutes: 18 +# run: | +# cd ./packages/web-new +# npm install +# npx playwright install chromium firefox +# npm run test name: web-new Visual Testing Pipeline on: @@ -26,11 +62,37 @@ jobs: - name: Bootstrap run: lerna bootstrap --no-ci + + - name: Move to folder + run: cd ./packages/web-new + + - name: Install dependencies + run: npm install - - name: New Web Visual Test - timeout-minutes: 18 + - name: Install Playwright Browsers + run: npx playwright install chromium firefox + + - name: Run server and test run: | - cd ./packages/web-new - npm install - npx playwright install chromium firefox - npm run test \ No newline at end of file + npm run serve & + sleep 10 + npm run test + + # - name: Run Playwright tests + # run: npm run test + + - uses: actions/upload-artifact@v3 + if: always() + with: + name: playwright-report + path: playwright-report/ + retention-days: 30 + + # - name: Install dependencies + # run: npm install + + # - name: Install Playwright + # run: npx playwright install chromium firefox + + # - name: Run Tests + # run: npm run test \ No newline at end of file diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index bb8234249..79bd73be2 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -54,21 +54,21 @@ module.exports = defineConfig({ name: 'webkit', use: { ...devices['Desktop Safari'] }, }, - { - name: 'Microsoft Edge', - use: { ...devices['Desktop Edge'], channel: 'msedge' }, - }, - { - name: 'Google Chrome', - use: { ...devices['Desktop Chrome'], channel: 'chrome' }, - } + // { + // name: 'Microsoft Edge', + // use: { ...devices['Desktop Edge'], channel: 'msedge' }, + // }, + // { + // name: 'Google Chrome', + // use: { ...devices['Desktop Chrome'], channel: 'chrome' }, + // } ], - /* Run your local dev server before starting the tests */ - webServer: { - command: 'npm run serve', - url: 'http://127.0.0.1:5100', - timeout: 120 * 1000, - reuseExistingServer: !isCI, - } + // /* Run your local dev server before starting the tests */ + // webServer: { + // command: 'npm run serve', + // url: 'http://127.0.0.1:5100', + // timeout: 120 * 1000, + // reuseExistingServer: !isCI, + // } }); From 53e8a8c9c20842906fb4cd3af95f03c2dd454f56 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 2 Feb 2024 15:39:02 +0100 Subject: [PATCH 29/68] Changed the yaml file --- .github/workflows/visual-ci-new.yaml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index a9ee80361..3ee4d9488 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -74,9 +74,9 @@ jobs: - name: Run server and test run: | - npm run serve & + npm serve & sleep 10 - npm run test + npm test # - name: Run Playwright tests # run: npm run test From f5e2de904bb01b9a2052b682b0eaf7741aa2487a Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 2 Feb 2024 15:49:37 +0100 Subject: [PATCH 30/68] Putting everything in one step for testing --- .github/workflows/visual-ci-new.yaml | 14 ++++---------- 1 file changed, 4 insertions(+), 10 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 3ee4d9488..2a28454f4 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -63,17 +63,11 @@ jobs: - name: Bootstrap run: lerna bootstrap --no-ci - - name: Move to folder - run: cd ./packages/web-new - - - name: Install dependencies - run: npm install - - - name: Install Playwright Browsers - run: npx playwright install chromium firefox - - - name: Run server and test + - name: Visual Tests run: | + cd ./packages/web-new + npm install + npx playwright install chromium firefox npm serve & sleep 10 npm test From 58df5edb6ed8ffbb880358befa5482eabf3992f9 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 2 Feb 2024 16:08:50 +0100 Subject: [PATCH 31/68] Fixed the new visual yaml file to run server first --- .github/workflows/visual-ci-new.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 2a28454f4..0180bf7c5 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -68,7 +68,7 @@ jobs: cd ./packages/web-new npm install npx playwright install chromium firefox - npm serve & + npm run serve & sleep 10 npm test From 9c893d234502d4a5db2d9747dcd865077dd3aede Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 2 Feb 2024 17:36:12 +0100 Subject: [PATCH 32/68] Changed the config file --- .github/workflows/visual-ci-new.yaml | 55 ++------------------------- packages/web-new/playwright.config.js | 26 +++++++------ 2 files changed, 18 insertions(+), 63 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 0180bf7c5..1097b49f0 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -1,40 +1,4 @@ -# name: web-new Visual Testing Pipeline - -# on: -# pull_request: -# paths-ignore: -# - "**.md" -# - "**.png" -# - "**.drawio" -# - "**.xlsx" - -# jobs: -# setup-and-visual-test: -# runs-on: ubuntu-latest - -# steps: -# - name: Checkout -# uses: actions/checkout@v3 - -# - name: Use Node.js 18 -# uses: actions/setup-node@v3 -# with: -# node-version: "18.x" - -# - name: Use lerna -# run: npm install -g lerna@6.6.2 - -# - name: Bootstrap -# run: lerna bootstrap --no-ci - -# - name: New Web Visual Test -# timeout-minutes: 18 -# run: | -# cd ./packages/web-new -# npm install -# npx playwright install chromium firefox -# npm run test -name: web-new Visual Testing Pipeline +name: Web-New Visual Testing Pipeline on: pull_request: @@ -64,29 +28,16 @@ jobs: run: lerna bootstrap --no-ci - name: Visual Tests + timeout-minutes: 18 run: | cd ./packages/web-new npm install npx playwright install chromium firefox - npm run serve & - sleep 10 npm test - # - name: Run Playwright tests - # run: npm run test - - uses: actions/upload-artifact@v3 if: always() with: name: playwright-report path: playwright-report/ - retention-days: 30 - - # - name: Install dependencies - # run: npm install - - # - name: Install Playwright - # run: npx playwright install chromium firefox - - # - name: Run Tests - # run: npm run test \ No newline at end of file + retention-days: 30 \ No newline at end of file diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index 79bd73be2..c2220733e 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -15,7 +15,11 @@ // @ts-check const { defineConfig, devices } = require('@playwright/test'); -const isCI = process.env.CI; +/** + * Read environment variables from file. + * https://github.com/motdotla/dotenv + */ +// require('dotenv').config(); module.exports = defineConfig({ testDir: './tests', @@ -24,11 +28,11 @@ module.exports = defineConfig({ /* Run tests in files in parallel */ fullyParallel: true, /* Fail the build on CI if you accidentally left test.only in the source code. */ - forbidOnly: !!isCI, + forbidOnly: !!process.env.CI, /* Retry on CI only */ - retries: isCI ? 2 : 0, + retries: process.env.CI ? 2 : 0, /* Opt out of parallel tests on CI. */ - workers: isCI ? 1 : undefined, + workers: process.env.CI ? 1 : undefined, /* Reporter to use. See https://playwright.dev/docs/test-reporters */ reporter: 'html', /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ @@ -64,11 +68,11 @@ module.exports = defineConfig({ // } ], - // /* Run your local dev server before starting the tests */ - // webServer: { - // command: 'npm run serve', - // url: 'http://127.0.0.1:5100', - // timeout: 120 * 1000, - // reuseExistingServer: !isCI, - // } + /* Run your local dev server before starting the tests */ + webServer: { + command: 'npm run serve', + url: 'http://127.0.0.1:5100', + // timeout: 120 * 1000, + reuseExistingServer: !process.env.CI, + } }); From c19f378b4cf1f417aa588acf73a75e15947c3da9 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Wed, 7 Feb 2024 19:19:09 +0100 Subject: [PATCH 33/68] Reduce amount of tests to 1 --- .github/workflows/visual-ci-new.yaml | 2 + packages/web-new/playwright.config.js | 12 +- packages/web-new/tests/test.spec.js | 3210 ++++++++++++------------- 3 files changed, 1613 insertions(+), 1611 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 1097b49f0..c0e981e16 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -33,6 +33,8 @@ jobs: cd ./packages/web-new npm install npx playwright install chromium firefox + npm run serve & + sleep 10 npm test - uses: actions/upload-artifact@v3 diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index c2220733e..3f6b292f7 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -69,10 +69,10 @@ module.exports = defineConfig({ ], /* Run your local dev server before starting the tests */ - webServer: { - command: 'npm run serve', - url: 'http://127.0.0.1:5100', - // timeout: 120 * 1000, - reuseExistingServer: !process.env.CI, - } + // webServer: { + // command: 'npm run serve', + // url: 'http://127.0.0.1:5100', + // // timeout: 120 * 1000, + // reuseExistingServer: !process.env.CI, + // } }); diff --git a/packages/web-new/tests/test.spec.js b/packages/web-new/tests/test.spec.js index 3a0333358..a2c69be9c 100644 --- a/packages/web-new/tests/test.spec.js +++ b/packages/web-new/tests/test.spec.js @@ -14,7 +14,7 @@ ********************************************************************************/ const { test, expect } = require('@playwright/test'); -//Open the playground app before any test is runned +//Open the playground app before any test is ran test.beforeEach(async ({ page }) => { await page.goto('/') }); @@ -24,2171 +24,2171 @@ test.describe("Load initial state", () => { await expect(page).toHaveTitle("TD Playground") }) - test('Has editor tab', async ({ page }) => { - const editorTab = page.locator('#tab') - await expect(editorTab).toHaveText("TDThing TemplateCloseCancel") - }) + // test('Has editor tab', async ({ page }) => { + // const editorTab = page.locator('#tab') + // await expect(editorTab).toHaveText("TDThing TemplateCloseCancel") + // }) - test('Has TD template', async ({ page }) => { - const editor = page.locator('#editor1').getByRole('code').locator('div').filter({ hasText: '"title": "Thing Template",' }).nth(4) - await expect(editor).toHaveText('"title": "Thing Template",') - }) + // test('Has TD template', async ({ page }) => { + // const editor = page.locator('#editor1').getByRole('code').locator('div').filter({ hasText: '"title": "Thing Template",' }).nth(4) + // await expect(editor).toHaveText('"title": "Thing Template",') + // }) - test('Validation tab is checked', async ({ page }) => { - const validationTab = page.locator('#validation-tab') - await expect(validationTab).toBeChecked() - }) + // test('Validation tab is checked', async ({ page }) => { + // const validationTab = page.locator('#validation-tab') + // await expect(validationTab).toBeChecked() + // }) - test('Validation view is opened', async ({ page }) => { - const validationView = page.locator('#validation-view') - await expect(validationView).toHaveClass("console-view validation-view") - }) + // test('Validation view is opened', async ({ page }) => { + // const validationView = page.locator('#validation-view') + // await expect(validationView).toHaveClass("console-view validation-view") + // }) - test('JSON button is checked', async ({ page }) => { - const jsonBtn = page.locator('#file-type-json') - await expect(jsonBtn).toBeChecked() - }) + // test('JSON button is checked', async ({ page }) => { + // const jsonBtn = page.locator('#file-type-json') + // await expect(jsonBtn).toBeChecked() + // }) }) -test.describe("Check all links", () => { - test("Check Thingweb logo link", async ({ page }) => { - const thingwebPromise = page.waitForEvent('popup') - await page.locator(".logo").click() - const thingwebPage = await thingwebPromise - await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") - await expect(thingwebPage).toHaveURL("https://www.thingweb.io") - }) +// test.describe("Check all links", () => { +// test("Check Thingweb logo link", async ({ page }) => { +// const thingwebPromise = page.waitForEvent('popup') +// await page.locator(".logo").click() +// const thingwebPage = await thingwebPromise +// await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") +// await expect(thingwebPage).toHaveURL("https://www.thingweb.io") +// }) + +// test("Check CLI link", async ({ page }) => { +// const cliPromise = page.waitForEvent('popup') +// await page.locator(".cli-link").click() +// const cliPage = await cliPromise +// await expect(cliPage).toHaveURL("https://github.com/eclipse-thingweb/playground/tree/master/packages/cli") +// }) + +// test("Check Github link", async ({ page }) => { +// const githubPromise = page.waitForEvent('popup') +// await page.locator(".git-link").click() +// const githubPage = await githubPromise +// await expect(githubPage).toHaveTitle(/GitHub - eclipse-thingweb/) +// await expect(githubPage).toHaveURL("https://github.com/eclipse-thingweb/playground") +// }) + +// test("Check Thingweb footer link", async ({ page }) => { +// await page.locator('#settings-btn').click() +// const thingwebPromise = page.waitForEvent('popup') +// await page.locator("#thingweb-link").click() +// const thingwebPage = await thingwebPromise +// await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") +// await expect(thingwebPage).toHaveURL("https://www.thingweb.io") +// }) + +// test("Check Eclipse footer link", async ({ page }) => { +// await page.locator('#settings-btn').click() +// const eclipsePromise = page.waitForEvent('popup') +// await page.locator("#eclipse-link").click() +// const eclipsePage = await eclipsePromise +// await expect(eclipsePage).toHaveTitle("The Community for Open Collaboration and Innovation | The Eclipse Foundation") +// await expect(eclipsePage).toHaveURL("https://www.eclipse.org") +// }) + +// test("Check privacy policy footer link", async ({ page }) => { +// await page.locator('#settings-btn').click() +// const privacyPromise = page.waitForEvent('popup') +// await page.locator("#privacy-link").click() +// const privacyPage = await privacyPromise +// await expect(privacyPage).toHaveTitle("Eclipse Foundation Website Privacy Policy | The Eclipse Foundation") +// await expect(privacyPage).toHaveURL("https://www.eclipse.org/legal/privacy.php") +// }) + +// test("Check terms of use footer link", async ({ page }) => { +// await page.locator('#settings-btn').click() +// const termsPromise = page.waitForEvent('popup') +// await page.locator("#terms-link").click() +// const termsPage = await termsPromise +// await expect(termsPage).toHaveTitle("Eclipse.org Terms of Use | The Eclipse Foundation") +// await expect(termsPage).toHaveURL("https://www.eclipse.org/legal/termsofuse.php") +// }) + +// test("Check copyright agent footer link", async ({ page }) => { +// await page.locator('#settings-btn').click() +// const copyrightPromise = page.waitForEvent('popup') +// await page.locator("#copyright-link").click() +// const copyrightPage = await copyrightPromise +// await expect(copyrightPage).toHaveTitle("Copyright Agent | The Eclipse Foundation") +// await expect(copyrightPage).toHaveURL("https://www.eclipse.org/legal/copyright.php") +// }) + +// test("Check legal footer link", async ({ page }) => { +// await page.locator('#settings-btn').click() +// const legalPromise = page.waitForEvent('popup') +// await page.locator("#legal-link").click() +// const legalPage = await legalPromise +// await expect(legalPage).toHaveTitle("Eclipse Foundation Legal Resources | The Eclipse Foundation") +// await expect(legalPage).toHaveURL("https://www.eclipse.org/legal/") +// }) +// }) + +// test.describe("Editors and Tabs creation and deletion", () => { +// test("Adding a new editor and closing it", async ({ page }) => { +// const editorTabs = page.locator("#tab") +// const editors = page.locator(".editor") +// await expect(editorTabs).toHaveCount(1) +// await expect(editors).toHaveCount(1) + +// const initialTab = page.locator("#tab").nth(0) +// await expect(initialTab).toHaveAttribute('data-tab-id', "1") +// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(initialTab).toHaveClass("active") + +// const initialEditor = page.locator("#editor1") +// await expect(initialEditor).toHaveAttribute('data-ide-id', "1") +// await expect(initialEditor).toHaveClass("editor active") + +// await page.locator("#ide-tab-add").click() +// await expect(editorTabs).toHaveCount(2) +// await expect(editors).toHaveCount(2) + +// await expect(initialTab).toHaveClass("") +// await expect(initialEditor).toHaveClass("editor") + +// const secondTab = page.locator("#tab").nth(1) +// await expect(secondTab).toHaveAttribute('data-tab-id', "2") +// await expect(secondTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(secondTab).toHaveClass("active") + +// const secondEditor = page.locator("#editor2") +// await expect(secondEditor).toHaveAttribute('data-ide-id', "2") +// await expect(secondEditor).toHaveClass("editor active") + +// await page.locator("#tab").nth(1).locator(".close-tab").click() +// await page.locator('#tab').nth(1).locator(".confirm-btns > .confirm-tab-close").click() + +// await expect(editorTabs).toHaveCount(1) +// await expect(editors).toHaveCount(1) + +// await expect(initialTab).toHaveClass("active") +// await expect(initialEditor).toHaveClass("editor active") +// }) + +// test("Opening an example and closing initial editor", async ({ page }) => { +// const editorTabs = page.locator("#tab") +// const editors = page.locator(".editor") +// await expect(editorTabs).toHaveCount(1) +// await expect(editors).toHaveCount(1) + +// const initialTab = page.locator("#tab").nth(0) +// await expect(initialTab).toHaveAttribute('data-tab-id', "1") +// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(initialTab).toHaveClass("active") + +// const initialEditor = page.locator("#editor1") +// await expect(initialEditor).toHaveAttribute('data-ide-id', "1") +// await expect(initialEditor).toHaveClass("editor active") + +// await page.locator("#examples-btn").click() +// await page.locator(".example").nth(0).click() +// await page.locator(".example").nth(0).getByRole("button", { name: /Apply/ }).click() + +// await expect(editorTabs).toHaveCount(2) +// await expect(editors).toHaveCount(2) + +// await expect(initialTab).toHaveClass("") +// await expect(initialEditor).toHaveClass("editor") + +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") + +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveClass("editor active") + +// await page.locator("#tab").nth(0).locator(".close-tab").click() +// await page.locator('#tab').nth(0).locator(".confirm-btns > .confirm-tab-close").click() + +// await expect(editorTabs).toHaveCount(1) +// await expect(editors).toHaveCount(1) +// }) +// }) + +// test.describe("JSON and YAML conversion", () => { +// test("JSON to YAML and YAML to JSON", async ({ page }) => { +// const editorTabs = page.locator("#tab") +// const editors = page.locator(".editor") +// await expect(editorTabs).toHaveCount(1) +// await expect(editors).toHaveCount(1) + +// const jsonYamlPopup = page.locator('.json-yaml-warning') +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + +// const initialEditor = page.locator("#editor1") +// const jsonBtn = page.locator('#file-type-json') +// const yamlBtn = page.locator('#file-type-yaml') - test("Check CLI link", async ({ page }) => { - const cliPromise = page.waitForEvent('popup') - await page.locator(".cli-link").click() - const cliPage = await cliPromise - await expect(cliPage).toHaveURL("https://github.com/eclipse-thingweb/playground/tree/master/packages/cli") - }) +// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) - test("Check Github link", async ({ page }) => { - const githubPromise = page.waitForEvent('popup') - await page.locator(".git-link").click() - const githubPage = await githubPromise - await expect(githubPage).toHaveTitle(/GitHub - eclipse-thingweb/) - await expect(githubPage).toHaveURL("https://github.com/eclipse-thingweb/playground") - }) +// await yamlBtn.click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - test("Check Thingweb footer link", async ({ page }) => { - await page.locator('#settings-btn').click() - const thingwebPromise = page.waitForEvent('popup') - await page.locator("#thingweb-link").click() - const thingwebPage = await thingwebPromise - await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") - await expect(thingwebPage).toHaveURL("https://www.thingweb.io") - }) +// await page.locator('#yaml-confirm-btn').click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// await expect(initialEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(jsonBtn).toBeChecked({ checked: false }) +// await expect(yamlBtn).toBeChecked({ checked: true }) - test("Check Eclipse footer link", async ({ page }) => { - await page.locator('#settings-btn').click() - const eclipsePromise = page.waitForEvent('popup') - await page.locator("#eclipse-link").click() - const eclipsePage = await eclipsePromise - await expect(eclipsePage).toHaveTitle("The Community for Open Collaboration and Innovation | The Eclipse Foundation") - await expect(eclipsePage).toHaveURL("https://www.eclipse.org") - }) +// await jsonBtn.click() +// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) +// }) - test("Check privacy policy footer link", async ({ page }) => { - await page.locator('#settings-btn').click() - const privacyPromise = page.waitForEvent('popup') - await page.locator("#privacy-link").click() - const privacyPage = await privacyPromise - await expect(privacyPage).toHaveTitle("Eclipse Foundation Website Privacy Policy | The Eclipse Foundation") - await expect(privacyPage).toHaveURL("https://www.eclipse.org/legal/privacy.php") - }) +// test("Cancel YAML conversion", async ({ page }) => { +// const editorTabs = page.locator("#tab") +// const editors = page.locator(".editor") +// await expect(editorTabs).toHaveCount(1) +// await expect(editors).toHaveCount(1) - test("Check terms of use footer link", async ({ page }) => { - await page.locator('#settings-btn').click() - const termsPromise = page.waitForEvent('popup') - await page.locator("#terms-link").click() - const termsPage = await termsPromise - await expect(termsPage).toHaveTitle("Eclipse.org Terms of Use | The Eclipse Foundation") - await expect(termsPage).toHaveURL("https://www.eclipse.org/legal/termsofuse.php") - }) +// const jsonYamlPopup = page.locator('.json-yaml-warning') +// const initialEditor = page.locator("#editor1") +// const jsonBtn = page.locator('#file-type-json') +// const yamlBtn = page.locator('#file-type-yaml') - test("Check copyright agent footer link", async ({ page }) => { - await page.locator('#settings-btn').click() - const copyrightPromise = page.waitForEvent('popup') - await page.locator("#copyright-link").click() - const copyrightPage = await copyrightPromise - await expect(copyrightPage).toHaveTitle("Copyright Agent | The Eclipse Foundation") - await expect(copyrightPage).toHaveURL("https://www.eclipse.org/legal/copyright.php") - }) +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) - test("Check legal footer link", async ({ page }) => { - await page.locator('#settings-btn').click() - const legalPromise = page.waitForEvent('popup') - await page.locator("#legal-link").click() - const legalPage = await legalPromise - await expect(legalPage).toHaveTitle("Eclipse Foundation Legal Resources | The Eclipse Foundation") - await expect(legalPage).toHaveURL("https://www.eclipse.org/legal/") - }) -}) +// await yamlBtn.click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") -test.describe("Editors and Tabs creation and deletion", () => { - test("Adding a new editor and closing it", async ({ page }) => { - const editorTabs = page.locator("#tab") - const editors = page.locator(".editor") - await expect(editorTabs).toHaveCount(1) - await expect(editors).toHaveCount(1) +// await page.locator('#yaml-cancel-btn').click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) +// }) +// }) - const initialTab = page.locator("#tab").nth(0) - await expect(initialTab).toHaveAttribute('data-tab-id', "1") - await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") - await expect(initialTab).toHaveClass("active") - const initialEditor = page.locator("#editor1") - await expect(initialEditor).toHaveAttribute('data-ide-id', "1") - await expect(initialEditor).toHaveClass("editor active") +// test.describe("Examples menu functionality", () => { +// test("Open and close examples menu", async ({ page }) => { - await page.locator("#ide-tab-add").click() - await expect(editorTabs).toHaveCount(2) - await expect(editors).toHaveCount(2) +// await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) +// await page.locator("#examples-btn").click() - await expect(initialTab).toHaveClass("") - await expect(initialEditor).toHaveClass("editor") +// await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: true }) +// await page.locator(".examples-menu-container__close > i").click() - const secondTab = page.locator("#tab").nth(1) - await expect(secondTab).toHaveAttribute('data-tab-id', "2") - await expect(secondTab).toHaveText("TDThing TemplateCloseCancel") - await expect(secondTab).toHaveClass("active") +// await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) +// }) - const secondEditor = page.locator("#editor2") - await expect(secondEditor).toHaveAttribute('data-ide-id', "2") - await expect(secondEditor).toHaveClass("editor active") +// test("Open Basic TD from quick access", async ({ page }) => { - await page.locator("#tab").nth(1).locator(".close-tab").click() - await page.locator('#tab').nth(1).locator(".confirm-btns > .confirm-tab-close").click() +// await page.locator("#examples-btn").click() - await expect(editorTabs).toHaveCount(1) - await expect(editors).toHaveCount(1) +// const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) +// await expect(basicExample).toHaveClass("example") - await expect(initialTab).toHaveClass("active") - await expect(initialEditor).toHaveClass("editor active") - }) - - test("Opening an example and closing initial editor", async ({ page }) => { - const editorTabs = page.locator("#tab") - const editors = page.locator(".editor") - await expect(editorTabs).toHaveCount(1) - await expect(editors).toHaveCount(1) - - const initialTab = page.locator("#tab").nth(0) - await expect(initialTab).toHaveAttribute('data-tab-id', "1") - await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") - await expect(initialTab).toHaveClass("active") - - const initialEditor = page.locator("#editor1") - await expect(initialEditor).toHaveAttribute('data-ide-id', "1") - await expect(initialEditor).toHaveClass("editor active") - - await page.locator("#examples-btn").click() - await page.locator(".example").nth(0).click() - await page.locator(".example").nth(0).getByRole("button", { name: /Apply/ }).click() - - await expect(editorTabs).toHaveCount(2) - await expect(editors).toHaveCount(2) - - await expect(initialTab).toHaveClass("") - await expect(initialEditor).toHaveClass("editor") +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) +// await quickAccessBtn.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveClass("editor active") +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveClass("editor active") - await page.locator("#tab").nth(0).locator(".close-tab").click() - await page.locator('#tab').nth(0).locator(".confirm-btns > .confirm-tab-close").click() +// }) - await expect(editorTabs).toHaveCount(1) - await expect(editors).toHaveCount(1) - }) -}) +// test("Open Basic TD from apply button", async ({ page }) => { -test.describe("JSON and YAML conversion", () => { - test("JSON to YAML and YAML to JSON", async ({ page }) => { - const editorTabs = page.locator("#tab") - const editors = page.locator(".editor") - await expect(editorTabs).toHaveCount(1) - await expect(editors).toHaveCount(1) - - const jsonYamlPopup = page.locator('.json-yaml-warning') - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - - const initialEditor = page.locator("#editor1") - const jsonBtn = page.locator('#file-type-json') - const yamlBtn = page.locator('#file-type-yaml') - - await expect(initialEditor).toHaveAttribute('data-mode-id', "json") - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) - - await yamlBtn.click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - - await page.locator('#yaml-confirm-btn').click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(initialEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(jsonBtn).toBeChecked({ checked: false }) - await expect(yamlBtn).toBeChecked({ checked: true }) - - await jsonBtn.click() - await expect(initialEditor).toHaveAttribute('data-mode-id', "json") - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) - }) +// await page.locator("#examples-btn").click() - test("Cancel YAML conversion", async ({ page }) => { - const editorTabs = page.locator("#tab") - const editors = page.locator(".editor") - await expect(editorTabs).toHaveCount(1) - await expect(editors).toHaveCount(1) - - const jsonYamlPopup = page.locator('.json-yaml-warning') - const initialEditor = page.locator("#editor1") - const jsonBtn = page.locator('#file-type-json') - const yamlBtn = page.locator('#file-type-yaml') - - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(initialEditor).toHaveAttribute('data-mode-id', "json") - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) - - await yamlBtn.click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - - await page.locator('#yaml-cancel-btn').click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(initialEditor).toHaveAttribute('data-mode-id', "json") - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) - }) -}) +// const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) +// await basicExample.click() +// await expect(basicExample).toHaveClass("example open") +// const applyBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Apply" }) +// await applyBtn.click() +// await expect(basicExample).toHaveClass("example") -test.describe("Examples menu functionality", () => { - test("Open and close examples menu", async ({ page }) => { +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) - await page.locator("#examples-btn").click() +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveClass("editor active") +// }) - await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: true }) - await page.locator(".examples-menu-container__close > i").click() +// test("Open Basic TD and close with cancel button", async ({ page }) => { +// await page.locator("#examples-btn").click() - await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) - }) +// const basicTDExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) +// await basicTDExample.click() +// await expect(basicTDExample).toHaveClass("example open") - test("Open Basic TD from quick access", async ({ page }) => { +// const cancelBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Cancel" }) +// await cancelBtn.click() +// await expect(basicTDExample).toHaveClass("example") +// }) - await page.locator("#examples-btn").click() +// test("Toggle between TD and TM examples", async ({ page }) => { +// await page.locator("#examples-btn").click() - const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) - await expect(basicExample).toHaveClass("example") +// const thingTypeToggle = page.locator('#thing-type-btn') +// await expect(thingTypeToggle).toBeChecked({ checked: false }) - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) - await quickAccessBtn.click() +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) +// }) - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// test("Open Basic TM and check for icon change in tab", async ({ page }) => { +// await page.locator("#examples-btn").click() - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveClass("editor active") +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - }) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - test("Open Basic TD from apply button", async ({ page }) => { +// const tabIcon = page.locator("#tab").nth(1).locator(".tab-icon") +// await expect(tabIcon).toHaveText("TM") +// }) - await page.locator("#examples-btn").click() +// test("Go to versioning in TD category and open example from quick access", async ({ page }) => { +// await page.locator("#examples-btn").click() - const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) - await basicExample.click() - await expect(basicExample).toHaveClass("example open") - - const applyBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Apply" }) - await applyBtn.click() - await expect(basicExample).toHaveClass("example") - - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") - - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveClass("editor active") - }) - - test("Open Basic TD and close with cancel button", async ({ page }) => { - await page.locator("#examples-btn").click() - - const basicTDExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) - await basicTDExample.click() - await expect(basicTDExample).toHaveClass("example open") - - const cancelBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Cancel" }) - await cancelBtn.click() - await expect(basicTDExample).toHaveClass("example") - }) - - test("Toggle between TD and TM examples", async ({ page }) => { - await page.locator("#examples-btn").click() - - const thingTypeToggle = page.locator('#thing-type-btn') - await expect(thingTypeToggle).toBeChecked({ checked: false }) - - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) - }) - - test("Open Basic TM and check for icon change in tab", async ({ page }) => { - await page.locator("#examples-btn").click() - - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) - - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() - - const tabIcon = page.locator("#tab").nth(1).locator(".tab-icon") - await expect(tabIcon).toHaveText("TM") - }) - - test("Go to versioning in TD category and open example from quick access", async ({ page }) => { - await page.locator("#examples-btn").click() - - const categoryDropDown = page.locator("#thing-category") - await categoryDropDown.selectOption('9-versioning') - - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Versioning' }).nth(0).getByRole("button").nth(0) - await quickAccessBtn.click() - - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") - }) - - test("Go to Tm Optional in TM category and open example from quick access", async ({ page }) => { - await page.locator("#examples-btn").click() - - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) - - const categoryDropDown = page.locator("#thing-category") - await categoryDropDown.selectOption('4-tm-optional') - - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Optional Interaction Affordances' }).nth(0).getByRole("button").nth(0) - await quickAccessBtn.click() - - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") - await expect(exampleTab).toHaveClass("active") - }) +// const categoryDropDown = page.locator("#thing-category") +// await categoryDropDown.selectOption('9-versioning') - test("Search for uriVariable in the TDs and open Combined URI variables in href example", async ({ page }) => { - await page.locator("#examples-btn").click() +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Versioning' }).nth(0).getByRole("button").nth(0) +// await quickAccessBtn.click() - const searchInput = page.locator(".search-input") - searchInput.fill('uriVariables') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") +// }) - const searchBtn = page.locator(".search-btn") - await searchBtn.click() +// test("Go to Tm Optional in TM category and open example from quick access", async ({ page }) => { +// await page.locator("#examples-btn").click() - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Combined URI variables in href' }).nth(0).getByRole("button").nth(0) - await quickAccessBtn.click() +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyWeatherThingCloseCancel") - await expect(exampleTab).toHaveClass("active") - }) +// const categoryDropDown = page.locator("#thing-category") +// await categoryDropDown.selectOption('4-tm-optional') - test("Search for overwrite in the TMs and open Overwrite Existing Definitions example", async ({ page }) => { - await page.locator("#examples-btn").click() +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Optional Interaction Affordances' }).nth(0).getByRole("button").nth(0) +// await quickAccessBtn.click() - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") +// }) - const searchInput = page.locator(".search-input") - searchInput.fill('overwrite') +// test("Search for uriVariable in the TDs and open Combined URI variables in href example", async ({ page }) => { +// await page.locator("#examples-btn").click() - const searchBtn = page.locator(".search-btn") - await searchBtn.click() +// const searchInput = page.locator(".search-input") +// searchInput.fill('uriVariables') - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Overwrite Existing Definitions' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// const searchBtn = page.locator(".search-btn") +// await searchBtn.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMSmart Lamp ControlCloseCancel") - await expect(exampleTab).toHaveClass("active") - }) -}) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Combined URI variables in href' }).nth(0).getByRole("button").nth(0) +// await quickAccessBtn.click() -test.describe("Save menu functionality", () => { - test("Open and close save menu", async ({ page }) => { - const saveMenu = page.locator(".save-menu") - await expect(saveMenu).toHaveClass("save-menu closed") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyWeatherThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") +// }) - await page.locator("#save-btn").click() - await expect(saveMenu).toHaveClass("save-menu") +// test("Search for overwrite in the TMs and open Overwrite Existing Definitions example", async ({ page }) => { +// await page.locator("#examples-btn").click() - const closeMenu = page.locator(".save-menu-close > i") - await closeMenu.click() - await expect(saveMenu).toHaveClass("save-menu closed") - }) +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - test("Open save menu with template thing and check for TD in menu title", async ({ page }) => { - const saveMenu = page.locator(".save-menu") +// const searchInput = page.locator(".search-input") +// searchInput.fill('overwrite') - await page.locator("#save-btn").click() - await expect(saveMenu).toHaveClass("save-menu") +// const searchBtn = page.locator(".search-btn") +// await searchBtn.click() - const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") - await expect(titleThingType).toHaveText("TD") - }) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Overwrite Existing Definitions' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - test("Open TM examples check for TM in the save menu title", async ({ page }) => { - await page.locator("#examples-btn").click() +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMSmart Lamp ControlCloseCancel") +// await expect(exampleTab).toHaveClass("active") +// }) +// }) - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// test.describe("Save menu functionality", () => { +// test("Open and close save menu", async ({ page }) => { +// const saveMenu = page.locator(".save-menu") +// await expect(saveMenu).toHaveClass("save-menu closed") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// await page.locator("#save-btn").click() +// await expect(saveMenu).toHaveClass("save-menu") - const saveMenu = page.locator(".save-menu") +// const closeMenu = page.locator(".save-menu-close > i") +// await closeMenu.click() +// await expect(saveMenu).toHaveClass("save-menu closed") +// }) - await page.locator("#save-btn").click() - await expect(saveMenu).toHaveClass("save-menu") +// test("Open save menu with template thing and check for TD in menu title", async ({ page }) => { +// const saveMenu = page.locator(".save-menu") - const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") - await expect(titleThingType).toHaveText("TM") - }) +// await page.locator("#save-btn").click() +// await expect(saveMenu).toHaveClass("save-menu") - test("Share and open in new tab functionality with an example", async ({ page }) => { +// const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") +// await expect(titleThingType).toHaveText("TD") +// }) - await page.locator("#examples-btn").click() +// test("Open TM examples check for TM in the save menu title", async ({ page }) => { +// await page.locator("#examples-btn").click() - const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) - await expect(basicExample).toHaveClass("example") +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) - await quickAccessBtn.click() +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// const saveMenu = page.locator(".save-menu") - const saveMenu = page.locator(".save-menu") +// await page.locator("#save-btn").click() +// await expect(saveMenu).toHaveClass("save-menu") - await page.locator("#save-btn").click() - await expect(saveMenu).toHaveClass("save-menu") +// const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") +// await expect(titleThingType).toHaveText("TM") +// }) - const openNewTab = page.locator("#open-url-tab") - await expect(openNewTab).toBeDisabled() +// test("Share and open in new tab functionality with an example", async ({ page }) => { - const shareUrlInput = page.locator("#share-url-input") - await expect(shareUrlInput).toHaveText("") +// await page.locator("#examples-btn").click() - const shareUrlBtn = page.locator("#share-url-btn") - await shareUrlBtn.click() +// const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) +// await expect(basicExample).toHaveClass("example") - const newPlaygroundPromise = page.waitForEvent('popup') - await openNewTab.click() - const newPlaygroundPage = await newPlaygroundPromise +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(newPlaygroundPage).toHaveTitle("TD Playground") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const newPlaygroundTab = newPlaygroundPage.locator("#tab").nth(0) - await expect(newPlaygroundTab).toHaveAttribute('data-tab-id', "1") - await expect(newPlaygroundTab).toHaveText("TDMyLampThingCloseCancel") - await expect(newPlaygroundTab).toHaveClass("active") +// const saveMenu = page.locator(".save-menu") - }) +// await page.locator("#save-btn").click() +// await expect(saveMenu).toHaveClass("save-menu") - test("Open in ediTDor functionality", async ({ page }) => { - const saveMenu = page.locator(".save-menu") +// const openNewTab = page.locator("#open-url-tab") +// await expect(openNewTab).toBeDisabled() - await page.locator("#save-btn").click() - await expect(saveMenu).toHaveClass("save-menu") +// const shareUrlInput = page.locator("#share-url-input") +// await expect(shareUrlInput).toHaveText("") - const shareUrlInput = page.locator("#share-url-input") - await expect(shareUrlInput).toHaveText("") +// const shareUrlBtn = page.locator("#share-url-btn") +// await shareUrlBtn.click() - const openEditdorBtn = page.locator("#open-editdor-btn") +// const newPlaygroundPromise = page.waitForEvent('popup') +// await openNewTab.click() +// const newPlaygroundPage = await newPlaygroundPromise - const editdorPromise = page.waitForEvent('popup') - await openEditdorBtn.click() - const editdorPage = await editdorPromise +// await expect(newPlaygroundPage).toHaveTitle("TD Playground") - await expect(editdorPage).toHaveTitle("ediTDor") +// const newPlaygroundTab = newPlaygroundPage.locator("#tab").nth(0) +// await expect(newPlaygroundTab).toHaveAttribute('data-tab-id', "1") +// await expect(newPlaygroundTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(newPlaygroundTab).toHaveClass("active") - const linkedTd = editdorPage.locator("#linkedTd > option") - await expect(linkedTd).toHaveText("Thing Template") - }) +// }) - test("Download functionality", async ({ page }) => { - const saveMenu = page.locator(".save-menu") +// test("Open in ediTDor functionality", async ({ page }) => { +// const saveMenu = page.locator(".save-menu") - const exampleTab = page.locator("#tab").nth(0) - await expect(exampleTab).toHaveAttribute('data-tab-id', "1") - await expect(exampleTab).toHaveText("TDThing TemplateCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await page.locator("#save-btn").click() +// await expect(saveMenu).toHaveClass("save-menu") - await page.locator("#save-btn").click() - await expect(saveMenu).toHaveClass("save-menu") +// const shareUrlInput = page.locator("#share-url-input") +// await expect(shareUrlInput).toHaveText("") - const downloadTdBtn = page.locator(".save-td__download") +// const openEditdorBtn = page.locator("#open-editdor-btn") - // Start waiting for download before clicking. - const downloadPromise = page.waitForEvent('download') - await downloadTdBtn.click() - const download = await downloadPromise - const expectedFilename = 'Thing-Template.json' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// const editdorPromise = page.waitForEvent('popup') +// await openEditdorBtn.click() +// const editdorPage = await editdorPromise - //* The "Save as" functionality cannot be tested because it requires to open and interact with the file system wich Playwright cannot do -}) +// await expect(editdorPage).toHaveTitle("ediTDor") -test.describe("Settings menu functionality", () => { - test("Opening and closing the settings menu", async ({ page }) => { - const settingsMenu = page.locator(".settings-menu") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// const linkedTd = editdorPage.locator("#linkedTd > option") +// await expect(linkedTd).toHaveText("Thing Template") +// }) - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// test("Download functionality", async ({ page }) => { +// const saveMenu = page.locator(".save-menu") - const closeMenu = page.locator(".settings__close > i") - await closeMenu.click() - await expect(settingsMenu).toHaveClass("settings-menu closed") - }) +// const exampleTab = page.locator("#tab").nth(0) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "1") +// await expect(exampleTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(exampleTab).toHaveClass("active") - test("Checking settings toggle buttons", async ({ page }) => { - const settingsMenu = page.locator(".settings-menu") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// await page.locator("#save-btn").click() +// await expect(saveMenu).toHaveClass("save-menu") - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// const downloadTdBtn = page.locator(".save-td__download") - const autoValidate = page.locator("#auto-validate") - const validateJsonld = page.locator("#validate-jsonld") - const tmConformance = page.locator("#tm-conformance") +// // Start waiting for download before clicking. +// const downloadPromise = page.waitForEvent('download') +// await downloadTdBtn.click() +// const download = await downloadPromise +// const expectedFilename = 'Thing-Template.json' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - await expect(autoValidate).toBeChecked({ checked: false }) - await expect(validateJsonld).toBeChecked({ checked: true }) - await expect(tmConformance).toBeChecked({ checked: true }) - }) +// //* The "Save as" functionality cannot be tested because it requires to open and interact with the file system wich Playwright cannot do +// }) - test("Changing page theme", async ({ page }) => { - const playgroundSite = page.locator("html") - await expect(playgroundSite).toHaveClass("light-mode") +// test.describe("Settings menu functionality", () => { +// test("Opening and closing the settings menu", async ({ page }) => { +// const settingsMenu = page.locator(".settings-menu") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - const settingsMenu = page.locator(".settings-menu") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// const closeMenu = page.locator(".settings__close > i") +// await closeMenu.click() +// await expect(settingsMenu).toHaveClass("settings-menu closed") +// }) - const themePicker = page.locator("#theme-picker") - await themePicker.selectOption('monochrome-mode') - await expect(playgroundSite).toHaveClass("monochrome-mode") +// test("Checking settings toggle buttons", async ({ page }) => { +// const settingsMenu = page.locator(".settings-menu") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - await themePicker.selectOption('dark-mode') - await expect(playgroundSite).toHaveClass("dark-mode") +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - await page.reload({ waitUntil: 'domcontentloaded' }) - await expect(playgroundSite).toHaveClass("dark-mode") - }) +// const autoValidate = page.locator("#auto-validate") +// const validateJsonld = page.locator("#validate-jsonld") +// const tmConformance = page.locator("#tm-conformance") - test("Changing font size", async ({ page }) => { - const settingsMenu = page.locator(".settings-menu") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// await expect(autoValidate).toBeChecked({ checked: false }) +// await expect(validateJsonld).toBeChecked({ checked: true }) +// await expect(tmConformance).toBeChecked({ checked: true }) +// }) - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// test("Changing page theme", async ({ page }) => { +// const playgroundSite = page.locator("html") +// await expect(playgroundSite).toHaveClass("light-mode") - const editorFontSize = page.locator(".editor-font-size") - await expect(editorFontSize).toHaveText("14") +// const settingsMenu = page.locator(".settings-menu") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - const fontSizeSlider = page.locator('#font-size') - await fontSizeSlider.click() +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - await expect(editorFontSize).toHaveText("23") +// const themePicker = page.locator("#theme-picker") +// await themePicker.selectOption('monochrome-mode') +// await expect(playgroundSite).toHaveClass("monochrome-mode") - await page.reload({ waitUntil: 'domcontentloaded' }) +// await themePicker.selectOption('dark-mode') +// await expect(playgroundSite).toHaveClass("dark-mode") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// await page.reload({ waitUntil: 'domcontentloaded' }) +// await expect(playgroundSite).toHaveClass("dark-mode") +// }) - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// test("Changing font size", async ({ page }) => { +// const settingsMenu = page.locator(".settings-menu") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - await expect(editorFontSize).toHaveText("23") - }) +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - test("Utilizing default settings", async ({ page }) => { - const playgroundSite = page.locator("html") - await expect(playgroundSite).toHaveClass("light-mode") +// const editorFontSize = page.locator(".editor-font-size") +// await expect(editorFontSize).toHaveText("14") - const settingsMenu = page.locator(".settings-menu") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// const fontSizeSlider = page.locator('#font-size') +// await fontSizeSlider.click() - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// await expect(editorFontSize).toHaveText("23") - const themePicker = page.locator("#theme-picker") - await themePicker.selectOption('dark-mode') - await expect(playgroundSite).toHaveClass("dark-mode") +// await page.reload({ waitUntil: 'domcontentloaded' }) - const editorFontSize = page.locator(".editor-font-size") - await expect(editorFontSize).toHaveText("14") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - const fontSizeSlider = page.locator('#font-size') - await fontSizeSlider.click() +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - await expect(editorFontSize).toHaveText("23") +// await expect(editorFontSize).toHaveText("23") +// }) - await page.reload({ waitUntil: 'domcontentloaded' }) +// test("Utilizing default settings", async ({ page }) => { +// const playgroundSite = page.locator("html") +// await expect(playgroundSite).toHaveClass("light-mode") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// const settingsMenu = page.locator(".settings-menu") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - await expect(playgroundSite).toHaveClass("dark-mode") - await expect(editorFontSize).toHaveText("23") +// const themePicker = page.locator("#theme-picker") +// await themePicker.selectOption('dark-mode') +// await expect(playgroundSite).toHaveClass("dark-mode") - const resetSettings = page.locator('.reset-settings') - await resetSettings.click() +// const editorFontSize = page.locator(".editor-font-size") +// await expect(editorFontSize).toHaveText("14") - await expect(playgroundSite).toHaveClass("light-mode") - await expect(editorFontSize).toHaveText("14") +// const fontSizeSlider = page.locator('#font-size') +// await fontSizeSlider.click() - await page.reload({ waitUntil: 'domcontentloaded' }) +// await expect(editorFontSize).toHaveText("23") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// await page.reload({ waitUntil: 'domcontentloaded' }) - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - await expect(playgroundSite).toHaveClass("light-mode") - await expect(editorFontSize).toHaveText("14") - }) -}) +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") -test.describe("Validation view functionality", () => { +// await expect(playgroundSite).toHaveClass("dark-mode") +// await expect(editorFontSize).toHaveText("23") - test("Starting the validation with the main validation button", async ({ page }) => { +// const resetSettings = page.locator('.reset-settings') +// await resetSettings.click() - const validationTab = page.locator('#validation-tab') - const validationView = page.locator('#validation-view') +// await expect(playgroundSite).toHaveClass("light-mode") +// await expect(editorFontSize).toHaveText("14") - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// await page.reload({ waitUntil: 'domcontentloaded' }) - const stateIcon = page.locator(".json-validation-section > .section-header > i").nth(0) - await expect(stateIcon).toHaveClass("fa-solid fa-circle") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - const validationBtn = page.locator("#validate-btn") - await validationBtn.click() +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - //TODO: Find a better way to wait for this event to happen - await page.waitForTimeout(5000) - await expect(stateIcon).toHaveClass("fa-solid fa-circle-check") - }) +// await expect(playgroundSite).toHaveClass("light-mode") +// await expect(editorFontSize).toHaveText("14") +// }) +// }) - test("Validating the 'All Defaults TD'", async ({ page }) => { - const validationTab = page.locator('#validation-tab') - const validationView = page.locator('#validation-view') +// test.describe("Validation view functionality", () => { - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// test("Starting the validation with the main validation button", async ({ page }) => { - await page.locator("#examples-btn").click() +// const validationTab = page.locator('#validation-tab') +// const validationView = page.locator('#validation-view') - const quickAccessBtn = page.locator(".example").filter({ hasText: 'All Default Values' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// const stateIcon = page.locator(".json-validation-section > .section-header > i").nth(0) +// await expect(stateIcon).toHaveClass("fa-solid fa-circle") - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// const validationBtn = page.locator("#validate-btn") +// await validationBtn.click() - const validationBtn = page.locator("#validate-btn") - await validationBtn.click() +// //TODO: Find a better way to wait for this event to happen +// await page.waitForTimeout(5000) +// await expect(stateIcon).toHaveClass("fa-solid fa-circle-check") +// }) - //validation section - const jsonValidationSection = page.locator(".json-validation-section") - const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) - const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") +// test("Validating the 'All Defaults TD'", async ({ page }) => { +// const validationTab = page.locator('#validation-tab') +// const validationView = page.locator('#validation-view') - await jsonValidationSection.click() - await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") - const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) - const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") +// await page.locator("#examples-btn").click() - await jsonSchemaValidationSection.click() - await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'All Default Values' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") - const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) - const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - await jsonSchemaDefaultsSection.click() - await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Validated Successfully") - await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-check") +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - const jsonlsValidationSection = page.locator(".jsonls-validation-section") - const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) - const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") +// const validationBtn = page.locator("#validate-btn") +// await validationBtn.click() - await jsonlsValidationSection.click() - await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// //validation section +// const jsonValidationSection = page.locator(".json-validation-section") +// const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) +// const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") - const additionalChecksSection = page.locator(".additional-checks-section") - const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) - const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") +// await jsonValidationSection.click() +// await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - await additionalChecksSection.click() - await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") - await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") - }) +// const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") +// const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) +// const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") - test("Validating the 'Basic TD'", async ({ page }) => { - const validationTab = page.locator('#validation-tab') - const validationView = page.locator('#validation-view') +// await jsonSchemaValidationSection.click() +// await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") +// const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) +// const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li") - await page.locator("#examples-btn").click() +// await jsonSchemaDefaultsSection.click() +// await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-check") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const jsonlsValidationSection = page.locator(".jsonls-validation-section") +// const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) +// const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await jsonlsValidationSection.click() +// await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// const additionalChecksSection = page.locator(".additional-checks-section") +// const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) +// const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") - const validationBtn = page.locator("#validate-btn") - await validationBtn.click() +// await additionalChecksSection.click() +// await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") +// await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") +// }) - //Validation section - const jsonValidationSection = page.locator(".json-validation-section") - const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) - const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") +// test("Validating the 'Basic TD'", async ({ page }) => { +// const validationTab = page.locator('#validation-tab') +// const validationView = page.locator('#validation-view') - await jsonValidationSection.click() - await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") - const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) - const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") +// await page.locator("#examples-btn").click() - await jsonSchemaValidationSection.click() - await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") - const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) - const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - await jsonSchemaDefaultsSection.click() - await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Optional validation failed:") - await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-exclamation") +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - const jsonlsValidationSection = page.locator(".jsonls-validation-section") - const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) - const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") +// const validationBtn = page.locator("#validate-btn") +// await validationBtn.click() - await jsonlsValidationSection.click() - await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// //Validation section +// const jsonValidationSection = page.locator(".json-validation-section") +// const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) +// const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") - const additionalChecksSection = page.locator(".additional-checks-section") - const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) - const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") +// await jsonValidationSection.click() +// await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - await additionalChecksSection.click() - await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") - await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") - }) +// const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") +// const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) +// const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") - test("Validating the 'Basic TM'", async ({ page }) => { +// await jsonSchemaValidationSection.click() +// await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - const validationTab = page.locator('#validation-tab') - const validationView = page.locator('#validation-view') +// const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") +// const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) +// const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// await jsonSchemaDefaultsSection.click() +// await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Optional validation failed:") +// await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-exclamation") - await page.locator("#examples-btn").click() +// const jsonlsValidationSection = page.locator(".jsonls-validation-section") +// const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) +// const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// await jsonlsValidationSection.click() +// await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// const additionalChecksSection = page.locator(".additional-checks-section") +// const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) +// const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await additionalChecksSection.click() +// await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") +// await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") +// }) - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// test("Validating the 'Basic TM'", async ({ page }) => { - const validationBtn = page.locator("#validate-btn") - await validationBtn.click() +// const validationTab = page.locator('#validation-tab') +// const validationView = page.locator('#validation-view') - //Validation section - const jsonValidationSection = page.locator(".json-validation-section") - const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) - const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - await jsonValidationSection.click() - await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// await page.locator("#examples-btn").click() - const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") - const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) - const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - await jsonSchemaValidationSection.click() - await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") - const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) - const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - await jsonSchemaDefaultsSection.click() - await expect(jsonSchemaDefaultsSectionTxt).toHaveText("A previous validation has failed or it is only available for Thing Descriptions") - await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle") +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - const jsonlsValidationSection = page.locator(".jsonls-validation-section") - const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) - const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") +// const validationBtn = page.locator("#validate-btn") +// await validationBtn.click() - await jsonlsValidationSection.click() - await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// //Validation section +// const jsonValidationSection = page.locator(".json-validation-section") +// const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) +// const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") - const additionalChecksSection = page.locator(".additional-checks-section") - const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) - const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") +// await jsonValidationSection.click() +// await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - await additionalChecksSection.click() - await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") - await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") - }) +// const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") +// const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) +// const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") -}) +// await jsonSchemaValidationSection.click() +// await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -test.describe("OpenAPI view functionality", () => { - test("Trying to open the OpenAPI view with a TD with no protocols", async ({ page }) => { +// const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") +// const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) +// const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) - const initialTab = page.locator("#tab").nth(0) - await expect(initialTab).toHaveAttribute('data-tab-id', "1") - await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") - await expect(initialTab).toHaveClass("active") +// await jsonSchemaDefaultsSection.click() +// await expect(jsonSchemaDefaultsSectionTxt).toHaveText("A previous validation has failed or it is only available for Thing Descriptions") +// await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle") - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// const jsonlsValidationSection = page.locator(".jsonls-validation-section") +// const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) +// const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) +// await jsonlsValidationSection.click() +// await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - await openAPITab.click() +// const additionalChecksSection = page.locator(".additional-checks-section") +// const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) +// const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses HTTP!") - }) +// await additionalChecksSection.click() +// await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") +// await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") +// }) - test("Trying to open the OpenAPI view with a TM", async ({ page }) => { +// }) - await page.locator("#examples-btn").click() +// test.describe("OpenAPI view functionality", () => { +// test("Trying to open the OpenAPI view with a TD with no protocols", async ({ page }) => { - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// const initialTab = page.locator("#tab").nth(0) +// await expect(initialTab).toHaveAttribute('data-tab-id', "1") +// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(initialTab).toHaveClass("active") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// await openAPITab.click() - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses HTTP!") +// }) - await openAPITab.click() +// test("Trying to open the OpenAPI view with a TM", async ({ page }) => { - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") +// await page.locator("#examples-btn").click() - }) +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - test("Open the OpenAPI view with the 'Basic TD' example", async ({ page }) => { - await page.locator("#examples-btn").click() +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// await openAPITab.click() - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") - await openAPITab.click() +// }) - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the OpenAPI view with the 'Basic TD' example", async ({ page }) => { +// await page.locator("#examples-btn").click() - const openAPIEditor = page.locator('#open-api-container') - const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") - await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const openAPIJsonBtn = page.locator('#open-api-json') +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(openAPIJsonBtn).toBeDisabled() +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - }) +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - test("Open the OpenAPI view with the 'Basic TD' example as YAML", async ({ page }) => { +// await openAPITab.click() - await page.locator("#examples-btn").click() +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const openAPIEditor = page.locator('#open-api-container') +// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") +// await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// const openAPIJsonBtn = page.locator('#open-api-json') +// await expect(openAPIJsonBtn).toBeDisabled() - const jsonYamlPopup = page.locator('.json-yaml-warning') - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// }) - const jsonBtn = page.locator('#file-type-json') - const yamlBtn = page.locator('#file-type-yaml') +// test("Open the OpenAPI view with the 'Basic TD' example as YAML", async ({ page }) => { - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) +// await page.locator("#examples-btn").click() - await yamlBtn.click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await page.locator('#yaml-confirm-btn').click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(jsonBtn).toBeChecked({ checked: false }) - await expect(yamlBtn).toBeChecked({ checked: true }) +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) - await openAPITab.click() +// const jsonYamlPopup = page.locator('.json-yaml-warning') +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// const jsonBtn = page.locator('#file-type-json') +// const yamlBtn = page.locator('#file-type-yaml') - const openAPIEditor = page.locator('#open-api-container') - const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: "3.0.3"' }).nth(4) +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(openAPIContainer).toHaveText('openapi: "3.0.3"') +// await yamlBtn.click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - const openAPIYamlBtn = page.locator('#open-api-yaml') - await expect(openAPIYamlBtn).toBeDisabled() +// await page.locator('#yaml-confirm-btn').click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(jsonBtn).toBeChecked({ checked: false }) +// await expect(yamlBtn).toBeChecked({ checked: true }) - }) +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - test("Open the OpenAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { - await page.locator("#examples-btn").click() +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// await openAPITab.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// const openAPIEditor = page.locator('#open-api-container') +// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: "3.0.3"' }).nth(4) - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(openAPIContainer).toHaveText('openapi: "3.0.3"') - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) +// const openAPIYamlBtn = page.locator('#open-api-yaml') +// await expect(openAPIYamlBtn).toBeDisabled() - await openAPITab.click() +// }) - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the OpenAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { +// await page.locator("#examples-btn").click() - const openAPIEditor = page.locator('#open-api-container') +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const openAPIJsonBtn = page.locator('#open-api-json') - const openAPIYamlBtn = page.locator('#open-api-yaml') +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(openAPIJsonBtn).toBeDisabled() +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - await openAPIYamlBtn.click() +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(openAPIYamlBtn).toBeDisabled() +// await openAPITab.click() - await openAPIJsonBtn.click() +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") - await expect(openAPIJsonBtn).toBeDisabled() - }) +// const openAPIEditor = page.locator('#open-api-container') - test("Open the OpenAPI view and downloading it as JSON", async ({ page }) => { - await page.locator("#examples-btn").click() +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const openAPIJsonBtn = page.locator('#open-api-json') +// const openAPIYamlBtn = page.locator('#open-api-yaml') - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(openAPIJsonBtn).toBeDisabled() - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// await openAPIYamlBtn.click() - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(openAPIYamlBtn).toBeDisabled() - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) +// await openAPIJsonBtn.click() - await openAPITab.click() +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") +// await expect(openAPIJsonBtn).toBeDisabled() +// }) - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the OpenAPI view and downloading it as JSON", async ({ page }) => { +// await page.locator("#examples-btn").click() - const openAPIEditor = page.locator('#open-api-container') - const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") - await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const openAPIJsonBtn = page.locator('#open-api-json') - await expect(openAPIJsonBtn).toBeDisabled() +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - // Start waiting for download before clicking. - const openAPIDownload = page.locator('#open-api-download') - const downloadPromise = page.waitForEvent('download') - await openAPIDownload.click() - const download = await downloadPromise - const expectedFilename = 'MyLampThing-OpenAPI.json' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { - await page.locator("#examples-btn").click() +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// await openAPITab.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// const openAPIEditor = page.locator('#open-api-container') +// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") +// await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) +// const openAPIJsonBtn = page.locator('#open-api-json') +// await expect(openAPIJsonBtn).toBeDisabled() - await openAPITab.click() +// // Start waiting for download before clicking. +// const openAPIDownload = page.locator('#open-api-download') +// const downloadPromise = page.waitForEvent('download') +// await openAPIDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'MyLampThing-OpenAPI.json' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { +// await page.locator("#examples-btn").click() - const openAPIEditor = page.locator('#open-api-container') +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const openAPIJsonBtn = page.locator('#open-api-json') - const openAPIYamlBtn = page.locator('#open-api-yaml') +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(openAPIJsonBtn).toBeDisabled() +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - await openAPIYamlBtn.click() +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(openAPIYamlBtn).toBeDisabled() +// await openAPITab.click() - const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: 3.0.3' }).nth(4) - await expect(openAPIContainer).toHaveText('openapi: 3.0.3') +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - // Start waiting for download before clicking. - const openAPIDownload = page.locator('#open-api-download') - const downloadPromise = page.waitForEvent('download') - await openAPIDownload.click() - const download = await downloadPromise - const expectedFilename = 'MyLampThing-OpenAPI.yaml' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) -}) +// const openAPIEditor = page.locator('#open-api-container') -test.describe("AsyncAPI view functionality", () => { - test("Trying to open the AsyncAPI view with a TD with no protocols", async ({ page }) => { +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") - const initialTab = page.locator("#tab").nth(0) - await expect(initialTab).toHaveAttribute('data-tab-id', "1") - await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") - await expect(initialTab).toHaveClass("active") +// const openAPIJsonBtn = page.locator('#open-api-json') +// const openAPIYamlBtn = page.locator('#open-api-yaml') - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// await expect(openAPIJsonBtn).toBeDisabled() - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) +// await openAPIYamlBtn.click() - await AsyncAPITab.click() +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(openAPIYamlBtn).toBeDisabled() - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses MQTT!") - }) +// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: 3.0.3' }).nth(4) +// await expect(openAPIContainer).toHaveText('openapi: 3.0.3') - test("Trying to open the AsyncAPI view with a TM", async ({ page }) => { +// // Start waiting for download before clicking. +// const openAPIDownload = page.locator('#open-api-download') +// const downloadPromise = page.waitForEvent('download') +// await openAPIDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'MyLampThing-OpenAPI.yaml' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) +// }) - await page.locator("#examples-btn").click() +// test.describe("AsyncAPI view functionality", () => { +// test("Trying to open the AsyncAPI view with a TD with no protocols", async ({ page }) => { - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// const initialTab = page.locator("#tab").nth(0) +// await expect(initialTab).toHaveAttribute('data-tab-id', "1") +// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(initialTab).toHaveClass("active") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// await AsyncAPITab.click() - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses MQTT!") +// }) - await AsyncAPITab.click() +// test("Trying to open the AsyncAPI view with a TM", async ({ page }) => { - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") +// await page.locator("#examples-btn").click() - }) +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - /** - * TODO: Do to a lack of examples that include the mqtt protocol this cannot be tested, nonetheless once - * TODO: this is added the code below should sufice with minimal adjustments - test("Open the AsyncAPI view with the '---' example", async ({ page }) => { - await page.locator("#examples-btn").click() +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TD---CloseCancel") - await expect(exampleTab).toHaveClass("active") +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// await AsyncAPITab.click() - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") - await AsyncAPITab.click() +// }) - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// /** +// * TODO: Do to a lack of examples that include the mqtt protocol this cannot be tested, nonetheless once +// * TODO: this is added the code below should sufice with minimal adjustments +// test("Open the AsyncAPI view with the '---' example", async ({ page }) => { +// await page.locator("#examples-btn").click() - const AsyncAPIEditor = page.locator('#async-api-container') - const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: '"asyncapi": "2.0.0",' }).nth(4) +// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") - await expect(AsyncAPIContainer).toHaveText('"asyncapi": "2.0.0",') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TD---CloseCancel") +// await expect(exampleTab).toHaveClass("active") - const AsyncAPIJsonBtn = page.locator('#async-api-json') +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(AsyncAPIJsonBtn).toBeDisabled() +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - test("Open the AsyncAPI view with the '---' example as YAML", async ({ page }) => { +// await AsyncAPITab.click() - await page.locator("#examples-btn").click() +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const AsyncAPIEditor = page.locator('#async-api-container') +// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: '"asyncapi": "2.0.0",' }).nth(4) - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TD---CloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") +// await expect(AsyncAPIContainer).toHaveText('"asyncapi": "2.0.0",') - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// const AsyncAPIJsonBtn = page.locator('#async-api-json') +// await expect(AsyncAPIJsonBtn).toBeDisabled() - const jsonYamlPopup = page.locator('.json-yaml-warning') - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// }) - const jsonBtn = page.locator('#file-type-json') - const yamlBtn = page.locator('#file-type-yaml') +// test("Open the AsyncAPI view with the '---' example as YAML", async ({ page }) => { - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) +// await page.locator("#examples-btn").click() - await yamlBtn.click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") +// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await page.locator('#yaml-confirm-btn').click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(jsonBtn).toBeChecked({ checked: false }) - await expect(yamlBtn).toBeChecked({ checked: true }) +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TD---CloseCancel") +// await expect(exampleTab).toHaveClass("active") - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) - await AsyncAPITab.click() +// const jsonYamlPopup = page.locator('.json-yaml-warning') +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// const jsonBtn = page.locator('#file-type-json') +// const yamlBtn = page.locator('#file-type-yaml') - const AsyncAPIEditor = page.locator('#async-api-container') - const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: 'asyncapi: 2.0.0' }).nth(4) +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(AsyncAPIContainer).toHaveText('asyncapi: 2.0.0') +// await yamlBtn.click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - const AsyncAPIYamlBtn = page.locator('#async-api-yaml') - await expect(AsyncAPIYamlBtn).toBeDisabled() +// await page.locator('#yaml-confirm-btn').click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(jsonBtn).toBeChecked({ checked: false }) +// await expect(yamlBtn).toBeChecked({ checked: true }) - }) +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - test("Open the AsyncAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { - await page.locator("#examples-btn").click() +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// await AsyncAPITab.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TD---CloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// const AsyncAPIEditor = page.locator('#async-api-container') +// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: 'asyncapi: 2.0.0' }).nth(4) - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(AsyncAPIContainer).toHaveText('asyncapi: 2.0.0') - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) +// const AsyncAPIYamlBtn = page.locator('#async-api-yaml') +// await expect(AsyncAPIYamlBtn).toBeDisabled() - await AsyncAPITab.click() +// }) - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the AsyncAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { +// await page.locator("#examples-btn").click() - const AsyncAPIEditor = page.locator('#async-api-container') +// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TD---CloseCancel") +// await expect(exampleTab).toHaveClass("active") - const AsyncAPIJsonBtn = page.locator('#async-api-json') - const AsyncAPIYamlBtn = page.locator('#async-api-yaml') +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(AsyncAPIJsonBtn).toBeDisabled() +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - await AsyncAPIYamlBtn.click() +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(AsyncAPIYamlBtn).toBeDisabled() +// await AsyncAPITab.click() - await AsyncAPIJsonBtn.click() +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") - await expect(AsyncAPIJsonBtn).toBeDisabled() - }) +// const AsyncAPIEditor = page.locator('#async-api-container') - test("Open the AsyncAPI view and downloading it as JSON", async ({ page }) => { - await page.locator("#examples-btn").click() +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") - const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const AsyncAPIJsonBtn = page.locator('#async-api-json') +// const AsyncAPIYamlBtn = page.locator('#async-api-yaml') - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TD---CloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(AsyncAPIJsonBtn).toBeDisabled() - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// await AsyncAPIYamlBtn.click() - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(AsyncAPIYamlBtn).toBeDisabled() - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) +// await AsyncAPIJsonBtn.click() - await AsyncAPITab.click() +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") +// await expect(AsyncAPIJsonBtn).toBeDisabled() +// }) - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the AsyncAPI view and downloading it as JSON", async ({ page }) => { +// await page.locator("#examples-btn").click() - const AsyncAPIEditor = page.locator('#async-api-container') - const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: '"asyncapi": "2.0.0",' }).nth(4) +// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") - await expect(AsyncAPIContainer).toHaveText('\"asyncapi\": \"2.0.0\",') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TD---CloseCancel") +// await expect(exampleTab).toHaveClass("active") - const AsyncAPIJsonBtn = page.locator('#async-api-json') - await expect(AsyncAPIJsonBtn).toBeDisabled() +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - // Start waiting for download before clicking. - const AsyncAPIDownload = page.locator('#async-api-download') - const downloadPromise = page.waitForEvent('download') - await AsyncAPIDownload.click() - const download = await downloadPromise - const expectedFilename = 'MyLampThing-AsyncAPI.json' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - test("Open the AsyncAPI view and downloading it as YAML", async ({ page }) => { - await page.locator("#examples-btn").click() +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// await AsyncAPITab.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TD---CloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// const AsyncAPIEditor = page.locator('#async-api-container') +// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: '"asyncapi": "2.0.0",' }).nth(4) - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") +// await expect(AsyncAPIContainer).toHaveText('\"asyncapi\": \"2.0.0\",') - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) +// const AsyncAPIJsonBtn = page.locator('#async-api-json') +// await expect(AsyncAPIJsonBtn).toBeDisabled() - await AsyncAPITab.click() +// // Start waiting for download before clicking. +// const AsyncAPIDownload = page.locator('#async-api-download') +// const downloadPromise = page.waitForEvent('download') +// await AsyncAPIDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'MyLampThing-AsyncAPI.json' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the AsyncAPI view and downloading it as YAML", async ({ page }) => { +// await page.locator("#examples-btn").click() - const AsyncAPIEditor = page.locator('#async-api-container') +// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TD---CloseCancel") +// await expect(exampleTab).toHaveClass("active") - const AsyncAPIJsonBtn = page.locator('#async-api-json') - const AsyncAPIYamlBtn = page.locator('#async-api-yaml') +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(AsyncAPIJsonBtn).toBeDisabled() +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - await AsyncAPIYamlBtn.click() +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(AsyncAPIYamlBtn).toBeDisabled() +// await AsyncAPITab.click() - const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: 'asyncapi: 2.0.0' }).nth(4) - await expect(AsyncAPIContainer).toHaveText('asyncapi: 2.0.0') +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - // Start waiting for download before clicking. - const AsyncAPIDownload = page.locator('#async-api-download') - const downloadPromise = page.waitForEvent('download') - await AsyncAPIDownload.click() - const download = await downloadPromise - const expectedFilename = 'MyLampThing-AsyncAPI.yaml' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) - */ -}) +// const AsyncAPIEditor = page.locator('#async-api-container') +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") -test.describe("AAS AID view functionality", () => { +// const AsyncAPIJsonBtn = page.locator('#async-api-json') +// const AsyncAPIYamlBtn = page.locator('#async-api-yaml') - test("Trying to open the AAS view with a TM", async ({ page }) => { +// await expect(AsyncAPIJsonBtn).toBeDisabled() - await page.locator("#examples-btn").click() +// await AsyncAPIYamlBtn.click() - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(AsyncAPIYamlBtn).toBeDisabled() - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: 'asyncapi: 2.0.0' }).nth(4) +// await expect(AsyncAPIContainer).toHaveText('asyncapi: 2.0.0') - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// // Start waiting for download before clicking. +// const AsyncAPIDownload = page.locator('#async-api-download') +// const downloadPromise = page.waitForEvent('download') +// await AsyncAPIDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'MyLampThing-AsyncAPI.yaml' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) +// */ +// }) - const AASView = page.locator('#aas-view') - const consoleError = page.locator('#console-error') - const AASTab = page.locator("#aas-tab") - await expect(AASView).toHaveClass("console-view aas-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AASTab).toBeChecked({ checked: false }) +// test.describe("AAS AID view functionality", () => { - await AASTab.click() +// test("Trying to open the AAS view with a TM", async ({ page }) => { - await expect(AASTab).toBeChecked({ checked: true }) - await expect(AASView).toHaveClass("console-view aas-view hidden") - await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") +// await page.locator("#examples-btn").click() - }) +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - test("Open the AAS AID view with the 'Basic TD' example", async ({ page }) => { - await page.locator("#examples-btn").click() +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// const AASView = page.locator('#aas-view') +// const consoleError = page.locator('#console-error') +// const AASTab = page.locator("#aas-tab") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// await expect(AASView).toHaveClass("console-view aas-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AASTab).toBeChecked({ checked: false }) - const AASView = page.locator('#aas-view') - const consoleError = page.locator('#console-error') - const AASTab = page.locator("#aas-tab") +// await AASTab.click() - await expect(AASView).toHaveClass("console-view aas-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AASTab).toBeChecked({ checked: false }) +// await expect(AASTab).toBeChecked({ checked: true }) +// await expect(AASView).toHaveClass("console-view aas-view hidden") +// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") - await AASTab.click() +// }) - await expect(AASTab).toBeChecked({ checked: true }) - await expect(AASView).toHaveClass("console-view aas-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the AAS AID view with the 'Basic TD' example", async ({ page }) => { +// await page.locator("#examples-btn").click() - const ASSEditor = page.locator('#aas-container') - const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") - await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - }) +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - test("Open the AAS AID view with the 'Basic TD' example and downloading it", async ({ page }) => { - await page.locator("#examples-btn").click() +// const AASView = page.locator('#aas-view') +// const consoleError = page.locator('#console-error') +// const AASTab = page.locator("#aas-tab") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// await expect(AASView).toHaveClass("console-view aas-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AASTab).toBeChecked({ checked: false }) - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await AASTab.click() - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// await expect(AASTab).toBeChecked({ checked: true }) +// await expect(AASView).toHaveClass("console-view aas-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const AASView = page.locator('#aas-view') - const consoleError = page.locator('#console-error') - const AASTab = page.locator("#aas-tab") +// const ASSEditor = page.locator('#aas-container') +// const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) - await expect(AASView).toHaveClass("console-view aas-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AASTab).toBeChecked({ checked: false }) +// await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") +// await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') - await AASTab.click() +// }) - await expect(AASTab).toBeChecked({ checked: true }) - await expect(AASView).toHaveClass("console-view aas-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the AAS AID view with the 'Basic TD' example and downloading it", async ({ page }) => { +// await page.locator("#examples-btn").click() - const ASSEditor = page.locator('#aas-container') - const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") - await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - // Start waiting for download before clicking. - const AASDownload = page.locator('#aas-download') - const downloadPromise = page.waitForEvent('download') - await AASDownload.click() - const download = await downloadPromise - const expectedFilename = 'MyLampThing-AAS.json' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) -}) +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") -test.describe("Defaults view functionality", () => { - test("Opening the Defaults view with the Thing Template", async ({ page }) => { +// const AASView = page.locator('#aas-view') +// const consoleError = page.locator('#console-error') +// const AASTab = page.locator("#aas-tab") - const initialTab = page.locator("#tab").nth(0) - await expect(initialTab).toHaveAttribute('data-tab-id', "1") - await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") - await expect(initialTab).toHaveClass("active") +// await expect(AASView).toHaveClass("console-view aas-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AASTab).toBeChecked({ checked: false }) - const DefaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const DefaultsTab = page.locator("#defaults-tab") +// await AASTab.click() - await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(DefaultsTab).toBeChecked({ checked: false }) +// await expect(AASTab).toBeChecked({ checked: true }) +// await expect(AASView).toHaveClass("console-view aas-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await DefaultsTab.click() +// const ASSEditor = page.locator('#aas-container') +// const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) - await expect(DefaultsTab).toBeChecked({ checked: true }) - await expect(DefaultsView).toHaveClass("console-view defaults-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") +// await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') - const defaultsEditor = page.locator('#defaults-container') - const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: '"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",' }).nth(4) +// // Start waiting for download before clicking. +// const AASDownload = page.locator('#aas-download') +// const downloadPromise = page.waitForEvent('download') +// await AASDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'MyLampThing-AAS.json' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) +// }) - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") - await expect(defaultsContainer).toHaveText('"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",') +// test.describe("Defaults view functionality", () => { +// test("Opening the Defaults view with the Thing Template", async ({ page }) => { - const defaultsJsonBtn = page.locator('#defaults-json') - const defaultsAddBtn = page.locator('#defaults-add') +// const initialTab = page.locator("#tab").nth(0) +// await expect(initialTab).toHaveAttribute('data-tab-id', "1") +// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(initialTab).toHaveClass("active") - await expect(defaultsJsonBtn).toBeDisabled() - await expect(defaultsAddBtn).toBeDisabled() - }) +// const DefaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const DefaultsTab = page.locator("#defaults-tab") - test("Trying to open the Defaults view with a TM", async ({ page }) => { +// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(DefaultsTab).toBeChecked({ checked: false }) - await page.locator("#examples-btn").click() +// await DefaultsTab.click() - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// await expect(DefaultsTab).toBeChecked({ checked: true }) +// await expect(DefaultsView).toHaveClass("console-view defaults-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// const defaultsEditor = page.locator('#defaults-container') +// const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: '"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",' }).nth(4) - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") +// await expect(defaultsContainer).toHaveText('"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",') - const DefaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const DefaultsTab = page.locator("#defaults-tab") +// const defaultsJsonBtn = page.locator('#defaults-json') +// const defaultsAddBtn = page.locator('#defaults-add') - await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(DefaultsTab).toBeChecked({ checked: false }) +// await expect(defaultsJsonBtn).toBeDisabled() +// await expect(defaultsAddBtn).toBeDisabled() +// }) - await DefaultsTab.click() +// test("Trying to open the Defaults view with a TM", async ({ page }) => { - await expect(DefaultsTab).toBeChecked({ checked: true }) - await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") - await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") +// await page.locator("#examples-btn").click() - }) +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - test("Open the Defaults view as YAML", async ({ page }) => { +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - const templateEditor = page.locator("#editor1") - await expect(templateEditor).toHaveAttribute('data-ide-id', "1") - await expect(templateEditor).toHaveAttribute('data-mode-id', "json") - await expect(templateEditor).toHaveClass("editor active") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const jsonYamlPopup = page.locator('.json-yaml-warning') - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// const DefaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const DefaultsTab = page.locator("#defaults-tab") - const jsonBtn = page.locator('#file-type-json') - const yamlBtn = page.locator('#file-type-yaml') +// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(DefaultsTab).toBeChecked({ checked: false }) - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) +// await DefaultsTab.click() - await yamlBtn.click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") +// await expect(DefaultsTab).toBeChecked({ checked: true }) +// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") - await page.locator('#yaml-confirm-btn').click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(templateEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(jsonBtn).toBeChecked({ checked: false }) - await expect(yamlBtn).toBeChecked({ checked: true }) +// }) - const defaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const defaultsTab = page.locator("#defaults-tab") +// test("Open the Defaults view as YAML", async ({ page }) => { - await expect(defaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(defaultsTab).toBeChecked({ checked: false }) +// const templateEditor = page.locator("#editor1") +// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") +// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") +// await expect(templateEditor).toHaveClass("editor active") - await defaultsTab.click() +// const jsonYamlPopup = page.locator('.json-yaml-warning') +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(defaultsTab).toBeChecked({ checked: true }) - await expect(defaultsView).toHaveClass("console-view defaults-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// const jsonBtn = page.locator('#file-type-json') +// const yamlBtn = page.locator('#file-type-yaml') - const defaultsEditor = page.locator('#defaults-container') - const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: 'description: >-' }).nth(4) - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(defaultsContainer).toHaveText('description: >-') +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) - const defaultsYamlBtn = page.locator('#defaults-yaml') - await expect(defaultsYamlBtn).toBeDisabled() - }) +// await yamlBtn.click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - test("Open the Defaults view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { - const templateEditor = page.locator("#editor1") - await expect(templateEditor).toHaveAttribute('data-ide-id', "1") - await expect(templateEditor).toHaveAttribute('data-mode-id', "json") - await expect(templateEditor).toHaveClass("editor active") +// await page.locator('#yaml-confirm-btn').click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// await expect(templateEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(jsonBtn).toBeChecked({ checked: false }) +// await expect(yamlBtn).toBeChecked({ checked: true }) - const defaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const defaultsTab = page.locator("#defaults-tab") +// const defaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const defaultsTab = page.locator("#defaults-tab") - await expect(defaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(defaultsTab).toBeChecked({ checked: false }) +// await expect(defaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(defaultsTab).toBeChecked({ checked: false }) - await defaultsTab.click() +// await defaultsTab.click() - await expect(defaultsTab).toBeChecked({ checked: true }) - await expect(defaultsView).toHaveClass("console-view defaults-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(defaultsTab).toBeChecked({ checked: true }) +// await expect(defaultsView).toHaveClass("console-view defaults-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const defaultsEditor = page.locator('#defaults-container') +// const defaultsEditor = page.locator('#defaults-container') +// const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: 'description: >-' }).nth(4) +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(defaultsContainer).toHaveText('description: >-') - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") +// const defaultsYamlBtn = page.locator('#defaults-yaml') +// await expect(defaultsYamlBtn).toBeDisabled() +// }) - const defaultsJsonBtn = page.locator('#defaults-json') - const defaultsYamlBtn = page.locator('#defaults-yaml') +// test("Open the Defaults view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { +// const templateEditor = page.locator("#editor1") +// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") +// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") +// await expect(templateEditor).toHaveClass("editor active") - await expect(defaultsJsonBtn).toBeDisabled() +// const defaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const defaultsTab = page.locator("#defaults-tab") - await defaultsYamlBtn.click() +// await expect(defaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(defaultsTab).toBeChecked({ checked: false }) - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(defaultsYamlBtn).toBeDisabled() +// await defaultsTab.click() - await defaultsJsonBtn.click() +// await expect(defaultsTab).toBeChecked({ checked: true }) +// await expect(defaultsView).toHaveClass("console-view defaults-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") - await expect(defaultsJsonBtn).toBeDisabled() - }) +// const defaultsEditor = page.locator('#defaults-container') - test("Open the Defaults view and removing and adding default values", async ({ page }) => { +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") - const templateEditor = page.locator("#editor1") - await expect(templateEditor).toHaveAttribute('data-ide-id', "1") - await expect(templateEditor).toHaveClass("editor active") +// const defaultsJsonBtn = page.locator('#defaults-json') +// const defaultsYamlBtn = page.locator('#defaults-yaml') - const defaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const defaultsTab = page.locator("#defaults-tab") +// await expect(defaultsJsonBtn).toBeDisabled() - await expect(defaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(defaultsTab).toBeChecked({ checked: false }) +// await defaultsYamlBtn.click() - await defaultsTab.click() +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(defaultsYamlBtn).toBeDisabled() - await expect(defaultsTab).toBeChecked({ checked: true }) - await expect(defaultsView).toHaveClass("console-view defaults-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// await defaultsJsonBtn.click() - const defaultsAddBtn = page.locator('#defaults-add') - const defaultsRemoveBtn = page.locator('#defaults-remove') +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") +// await expect(defaultsJsonBtn).toBeDisabled() +// }) - await expect(defaultsAddBtn).toBeDisabled() +// test("Open the Defaults view and removing and adding default values", async ({ page }) => { - await defaultsRemoveBtn.click() - await expect(defaultsRemoveBtn).toBeDisabled() +// const templateEditor = page.locator("#editor1") +// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") +// await expect(templateEditor).toHaveClass("editor active") - await defaultsAddBtn.click() - await expect(defaultsAddBtn).toBeDisabled() - }) +// const defaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const defaultsTab = page.locator("#defaults-tab") - test("Open the Defaults view and downloading it as JSON with defaults", async ({ page }) => { +// await expect(defaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(defaultsTab).toBeChecked({ checked: false }) - const templateEditor = page.locator("#editor1") - await expect(templateEditor).toHaveAttribute('data-ide-id', "1") - await expect(templateEditor).toHaveAttribute('data-mode-id', "json") - await expect(templateEditor).toHaveClass("editor active") +// await defaultsTab.click() - const DefaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const DefaultsTab = page.locator("#defaults-tab") +// await expect(defaultsTab).toBeChecked({ checked: true }) +// await expect(defaultsView).toHaveClass("console-view defaults-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(DefaultsTab).toBeChecked({ checked: false }) +// const defaultsAddBtn = page.locator('#defaults-add') +// const defaultsRemoveBtn = page.locator('#defaults-remove') - await DefaultsTab.click() +// await expect(defaultsAddBtn).toBeDisabled() - await expect(DefaultsTab).toBeChecked({ checked: true }) - await expect(DefaultsView).toHaveClass("console-view defaults-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// await defaultsRemoveBtn.click() +// await expect(defaultsRemoveBtn).toBeDisabled() - const defaultsEditor = page.locator('#defaults-container') - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") +// await defaultsAddBtn.click() +// await expect(defaultsAddBtn).toBeDisabled() +// }) - const DefaultsJsonBtn = page.locator('#defaults-json') - await expect(DefaultsJsonBtn).toBeDisabled() +// test("Open the Defaults view and downloading it as JSON with defaults", async ({ page }) => { - // Start waiting for download before clicking. - const DefaultsDownload = page.locator('#defaults-download') - const downloadPromise = page.waitForEvent('download') - await DefaultsDownload.click() - const download = await downloadPromise - const expectedFilename = 'Thing-Template-with-Defaults.json' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// const templateEditor = page.locator("#editor1") +// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") +// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") +// await expect(templateEditor).toHaveClass("editor active") - test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { - const templateEditor = page.locator("#editor1") - await expect(templateEditor).toHaveAttribute('data-ide-id', "1") - await expect(templateEditor).toHaveAttribute('data-mode-id', "json") - await expect(templateEditor).toHaveClass("editor active") +// const DefaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const DefaultsTab = page.locator("#defaults-tab") - const DefaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const DefaultsTab = page.locator("#defaults-tab") +// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(DefaultsTab).toBeChecked({ checked: false }) - await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(DefaultsTab).toBeChecked({ checked: false }) +// await DefaultsTab.click() - await DefaultsTab.click() +// await expect(DefaultsTab).toBeChecked({ checked: true }) +// await expect(DefaultsView).toHaveClass("console-view defaults-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(DefaultsTab).toBeChecked({ checked: true }) - await expect(DefaultsView).toHaveClass("console-view defaults-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// const defaultsEditor = page.locator('#defaults-container') +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") - const defaultsEditor = page.locator('#defaults-container') - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") +// const DefaultsJsonBtn = page.locator('#defaults-json') +// await expect(DefaultsJsonBtn).toBeDisabled() - const defaultsJsonBtn = page.locator('#defaults-json') - const defaultsYamlBtn = page.locator('#defaults-yaml') +// // Start waiting for download before clicking. +// const DefaultsDownload = page.locator('#defaults-download') +// const downloadPromise = page.waitForEvent('download') +// await DefaultsDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'Thing-Template-with-Defaults.json' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - await expect(defaultsJsonBtn).toBeDisabled() +// test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { +// const templateEditor = page.locator("#editor1") +// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") +// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") +// await expect(templateEditor).toHaveClass("editor active") - await defaultsYamlBtn.click() +// const DefaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const DefaultsTab = page.locator("#defaults-tab") - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(defaultsYamlBtn).toBeDisabled() +// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(DefaultsTab).toBeChecked({ checked: false }) - const defaultsAddBtn = page.locator('#defaults-add') - const defaultsRemoveBtn = page.locator('#defaults-remove') +// await DefaultsTab.click() - await expect(defaultsAddBtn).toBeDisabled() +// await expect(DefaultsTab).toBeChecked({ checked: true }) +// await expect(DefaultsView).toHaveClass("console-view defaults-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await defaultsRemoveBtn.click() - await expect(defaultsRemoveBtn).toBeDisabled() +// const defaultsEditor = page.locator('#defaults-container') +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") - // Start waiting for download before clicking. - const defaultsDownload = page.locator('#defaults-download') - const downloadPromise = page.waitForEvent('download') - await defaultsDownload.click() - const download = await downloadPromise - const expectedFilename = 'Thing-Template-without-Defaults.yaml' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) -}) +// const defaultsJsonBtn = page.locator('#defaults-json') +// const defaultsYamlBtn = page.locator('#defaults-yaml') -test.describe("Visualization view functionality", () => { +// await expect(defaultsJsonBtn).toBeDisabled() - test("Open the visualization view with the thing template", async ({ page }) => { +// await defaultsYamlBtn.click() - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(defaultsYamlBtn).toBeDisabled() - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// const defaultsAddBtn = page.locator('#defaults-add') +// const defaultsRemoveBtn = page.locator('#defaults-remove') - await visualizeTab.click() +// await expect(defaultsAddBtn).toBeDisabled() - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// await defaultsRemoveBtn.click() +// await expect(defaultsRemoveBtn).toBeDisabled() - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') +// // Start waiting for download before clicking. +// const defaultsDownload = page.locator('#defaults-download') +// const downloadPromise = page.waitForEvent('download') +// await defaultsDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'Thing-Template-without-Defaults.yaml' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) +// }) - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// test.describe("Visualization view functionality", () => { - const graphVisTitle = page.locator('#visualized').getByText('Thing Template', { exact: true }) - await expect(graphVisTitle).toHaveText("Thing Template") - }) +// test("Open the visualization view with the thing template", async ({ page }) => { - test("Open the visualization view with the thing template and expand and collapse the graph view", async ({ page }) => { +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// await visualizeTab.click() - await visualizeTab.click() +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') - const collapseAllBtn = page.locator('#collapse-all') - const expandAllBtn = page.locator('#expand-all') +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// const graphVisTitle = page.locator('#visualized').getByText('Thing Template', { exact: true }) +// await expect(graphVisTitle).toHaveText("Thing Template") +// }) - const svgPaths = page.locator("svg > g > path") - await expect(svgPaths).toHaveCount(9) +// test("Open the visualization view with the thing template and expand and collapse the graph view", async ({ page }) => { - await expandAllBtn.click() - await expect(expandAllBtn).toBeDisabled() +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") - await expect(svgPaths).toHaveCount(12) +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) - await collapseAllBtn.click() - await expect(collapseAllBtn).toBeDisabled() +// await visualizeTab.click() - await expect(svgPaths).toHaveCount(0) - }) +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") - test("Open the visualization view with the thing template download the graph view as SVG", async ({ page }) => { +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') +// const collapseAllBtn = page.locator('#collapse-all') +// const expandAllBtn = page.locator('#expand-all') - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// const svgPaths = page.locator("svg > g > path") +// await expect(svgPaths).toHaveCount(9) - await visualizeTab.click() +// await expandAllBtn.click() +// await expect(expandAllBtn).toBeDisabled() - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// await expect(svgPaths).toHaveCount(12) - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') +// await collapseAllBtn.click() +// await expect(collapseAllBtn).toBeDisabled() - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// await expect(svgPaths).toHaveCount(0) +// }) - // Start waiting for download before clicking. - const svgDownload = page.locator('#download-svg') - const downloadPromise = page.waitForEvent('download') - await svgDownload.click() - const download = await downloadPromise - const expectedFilename = 'Graph-visualization.svg' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// test("Open the visualization view with the thing template download the graph view as SVG", async ({ page }) => { - test("Open the visualization view with the thing template and download the graph view as PNG", async ({ page }) => { +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// await visualizeTab.click() - await visualizeTab.click() +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// // Start waiting for download before clicking. +// const svgDownload = page.locator('#download-svg') +// const downloadPromise = page.waitForEvent('download') +// await svgDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'Graph-visualization.svg' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - // Start waiting for download before clicking. - const pngDownload = page.locator('#download-png') - const downloadPromise = page.waitForEvent('download') - await pngDownload.click() - const download = await downloadPromise - const expectedFilename = 'Graph-visualization.png' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// test("Open the visualization view with the thing template and download the graph view as PNG", async ({ page }) => { - test("Open the tree visualization view with the thing template and modified the input values", async ({ page }) => { +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// await visualizeTab.click() - await visualizeTab.click() +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// // Start waiting for download before clicking. +// const pngDownload = page.locator('#download-png') +// const downloadPromise = page.waitForEvent('download') +// await pngDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'Graph-visualization.png' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - await treeViewBtn.click() - await expect(graphViewBtn).toBeChecked({ checked: false }) - await expect(treeViewBtn).toBeChecked({ checked: true }) +// test("Open the tree visualization view with the thing template and modified the input values", async ({ page }) => { - const labelBtn = page.getByLabel('labels') - const radiusSlider = page.getByLabel('radius') - const extentSlider = page.getByLabel('extent') - const rotateSlider = page.getByLabel('rotate') - const dragSlider = page.getByLabel('drag precision') - const tidyBtn = page.getByLabel('tidy') - const clusterBtn = page.getByLabel('cluster') - const linksDropDown = page.getByLabel('links') +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") - await expect(labelBtn).toBeChecked({ checked: true }) - await expect(radiusSlider).toHaveValue("350") - await expect(extentSlider).toHaveValue("360") - await expect(rotateSlider).toHaveValue("0") - await expect(dragSlider).toHaveValue("100") - await expect(tidyBtn).toBeChecked({ checked: true }) - await expect(clusterBtn).toBeChecked({ checked: false }) - await expect(linksDropDown).toHaveValue("line") +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) - await labelBtn.click() - await radiusSlider.click() - await extentSlider.click() - await rotateSlider.click() - await dragSlider.click() - await clusterBtn.check() - await linksDropDown.selectOption("diagonal") - await expect(labelBtn).toBeChecked({ checked: false }) +// await visualizeTab.click() - const radiusSliderValue = await radiusSlider.inputValue() - expect(parseInt(radiusSliderValue)).toBeLessThan(450) - expect(parseInt(radiusSliderValue)).toBeGreaterThan(330) +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") - const extentSliderValue = await extentSlider.inputValue() - expect(parseInt(extentSliderValue)).toBeLessThan(190) - expect(parseInt(extentSliderValue)).toBeGreaterThan(170) +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') - const rotateSliderValue = await rotateSlider.inputValue() - expect(parseInt(rotateSliderValue)).toBeLessThan(190) - expect(parseInt(rotateSliderValue)).toBeGreaterThan(170) +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) - const dragSliderValue = await dragSlider.inputValue() - expect(parseInt(dragSliderValue)).toBeLessThan(60) - expect(parseInt(dragSliderValue)).toBeGreaterThan(40) +// await treeViewBtn.click() +// await expect(graphViewBtn).toBeChecked({ checked: false }) +// await expect(treeViewBtn).toBeChecked({ checked: true }) - await expect(tidyBtn).toBeChecked({ checked: false }) - await expect(clusterBtn).toBeChecked({ checked: true }) - await expect(linksDropDown).toHaveValue("diagonal") +// const labelBtn = page.getByLabel('labels') +// const radiusSlider = page.getByLabel('radius') +// const extentSlider = page.getByLabel('extent') +// const rotateSlider = page.getByLabel('rotate') +// const dragSlider = page.getByLabel('drag precision') +// const tidyBtn = page.getByLabel('tidy') +// const clusterBtn = page.getByLabel('cluster') +// const linksDropDown = page.getByLabel('links') - }) +// await expect(labelBtn).toBeChecked({ checked: true }) +// await expect(radiusSlider).toHaveValue("350") +// await expect(extentSlider).toHaveValue("360") +// await expect(rotateSlider).toHaveValue("0") +// await expect(dragSlider).toHaveValue("100") +// await expect(tidyBtn).toBeChecked({ checked: true }) +// await expect(clusterBtn).toBeChecked({ checked: false }) +// await expect(linksDropDown).toHaveValue("line") - test("Open the tree visualization view with the thing template and download as SVG", async ({ page }) => { +// await labelBtn.click() +// await radiusSlider.click() +// await extentSlider.click() +// await rotateSlider.click() +// await dragSlider.click() +// await clusterBtn.check() +// await linksDropDown.selectOption("diagonal") +// await expect(labelBtn).toBeChecked({ checked: false }) - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// const radiusSliderValue = await radiusSlider.inputValue() +// expect(parseInt(radiusSliderValue)).toBeLessThan(450) +// expect(parseInt(radiusSliderValue)).toBeGreaterThan(330) - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// const extentSliderValue = await extentSlider.inputValue() +// expect(parseInt(extentSliderValue)).toBeLessThan(190) +// expect(parseInt(extentSliderValue)).toBeGreaterThan(170) - await visualizeTab.click() +// const rotateSliderValue = await rotateSlider.inputValue() +// expect(parseInt(rotateSliderValue)).toBeLessThan(190) +// expect(parseInt(rotateSliderValue)).toBeGreaterThan(170) - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// const dragSliderValue = await dragSlider.inputValue() +// expect(parseInt(dragSliderValue)).toBeLessThan(60) +// expect(parseInt(dragSliderValue)).toBeGreaterThan(40) - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') +// await expect(tidyBtn).toBeChecked({ checked: false }) +// await expect(clusterBtn).toBeChecked({ checked: true }) +// await expect(linksDropDown).toHaveValue("diagonal") - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// }) - await treeViewBtn.click() - await expect(graphViewBtn).toBeChecked({ checked: false }) - await expect(treeViewBtn).toBeChecked({ checked: true }) +// test("Open the tree visualization view with the thing template and download as SVG", async ({ page }) => { - // Start waiting for download before clicking. - const svgDownload = page.locator('#download-svg') - const downloadPromise = page.waitForEvent('download') - await svgDownload.click() - const download = await downloadPromise - const expectedFilename = 'Tree-visualization.svg' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") - test("Open the tree visualization view with the thing template and download as PNG", async ({ page }) => { +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// await visualizeTab.click() - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") - await visualizeTab.click() +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') +// await treeViewBtn.click() +// await expect(graphViewBtn).toBeChecked({ checked: false }) +// await expect(treeViewBtn).toBeChecked({ checked: true }) - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// // Start waiting for download before clicking. +// const svgDownload = page.locator('#download-svg') +// const downloadPromise = page.waitForEvent('download') +// await svgDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'Tree-visualization.svg' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - await treeViewBtn.click() - await expect(graphViewBtn).toBeChecked({ checked: false }) - await expect(treeViewBtn).toBeChecked({ checked: true }) +// test("Open the tree visualization view with the thing template and download as PNG", async ({ page }) => { - // Start waiting for download before clicking. - const pngDownload = page.locator('#download-png') - const downloadPromise = page.waitForEvent('download') - await pngDownload.click() - const download = await downloadPromise - const expectedFilename = 'Tree-visualization.png' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) -}) +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") + +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) + +// await visualizeTab.click() + +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") + +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') + +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) + +// await treeViewBtn.click() +// await expect(graphViewBtn).toBeChecked({ checked: false }) +// await expect(treeViewBtn).toBeChecked({ checked: true }) + +// // Start waiting for download before clicking. +// const pngDownload = page.locator('#download-png') +// const downloadPromise = page.waitForEvent('download') +// await pngDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'Tree-visualization.png' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) +// }) From a131f2fbfc10b577433e23665eadfdbe5a4da823 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Wed, 7 Feb 2024 19:23:56 +0100 Subject: [PATCH 34/68] Building the project before the testing --- .github/workflows/visual-ci-new.yaml | 1 + 1 file changed, 1 insertion(+) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index c0e981e16..0a1083fec 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -33,6 +33,7 @@ jobs: cd ./packages/web-new npm install npx playwright install chromium firefox + npm run build npm run serve & sleep 10 npm test From 6b3dbbec003904fda3ba69f940ba96928eaafbd1 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Wed, 7 Feb 2024 19:32:35 +0100 Subject: [PATCH 35/68] Running tests with playwrights web server --- .github/workflows/visual-ci-new.yaml | 2 -- packages/web-new/playwright.config.js | 12 ++++++------ 2 files changed, 6 insertions(+), 8 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 0a1083fec..bc81e4a9e 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -34,8 +34,6 @@ jobs: npm install npx playwright install chromium firefox npm run build - npm run serve & - sleep 10 npm test - uses: actions/upload-artifact@v3 diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index 3f6b292f7..c2220733e 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -69,10 +69,10 @@ module.exports = defineConfig({ ], /* Run your local dev server before starting the tests */ - // webServer: { - // command: 'npm run serve', - // url: 'http://127.0.0.1:5100', - // // timeout: 120 * 1000, - // reuseExistingServer: !process.env.CI, - // } + webServer: { + command: 'npm run serve', + url: 'http://127.0.0.1:5100', + // timeout: 120 * 1000, + reuseExistingServer: !process.env.CI, + } }); From 6f5ecedd270abcb5f65faaf35ab5df98f192cf17 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Wed, 7 Feb 2024 19:39:10 +0100 Subject: [PATCH 36/68] Getting playwright report in github actions --- .github/workflows/visual-ci-new.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index bc81e4a9e..aa0c0a48b 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -40,5 +40,5 @@ jobs: if: always() with: name: playwright-report - path: playwright-report/ + path: ./packages/web-new/playwright-report/ retention-days: 30 \ No newline at end of file From b896d6f13fbadcc01c2fa1bd5657be4c46060368 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Wed, 7 Feb 2024 19:45:27 +0100 Subject: [PATCH 37/68] Running all tests, and removing unnecessary tests --- packages/web-new/tests/test.spec.js | 3045 ++++++++++++--------------- 1 file changed, 1392 insertions(+), 1653 deletions(-) diff --git a/packages/web-new/tests/test.spec.js b/packages/web-new/tests/test.spec.js index a2c69be9c..d5d8f7952 100644 --- a/packages/web-new/tests/test.spec.js +++ b/packages/web-new/tests/test.spec.js @@ -24,2171 +24,1910 @@ test.describe("Load initial state", () => { await expect(page).toHaveTitle("TD Playground") }) - // test('Has editor tab', async ({ page }) => { - // const editorTab = page.locator('#tab') - // await expect(editorTab).toHaveText("TDThing TemplateCloseCancel") - // }) - - // test('Has TD template', async ({ page }) => { - // const editor = page.locator('#editor1').getByRole('code').locator('div').filter({ hasText: '"title": "Thing Template",' }).nth(4) - // await expect(editor).toHaveText('"title": "Thing Template",') - // }) - - // test('Validation tab is checked', async ({ page }) => { - // const validationTab = page.locator('#validation-tab') - // await expect(validationTab).toBeChecked() - // }) - - // test('Validation view is opened', async ({ page }) => { - // const validationView = page.locator('#validation-view') - // await expect(validationView).toHaveClass("console-view validation-view") - // }) - - // test('JSON button is checked', async ({ page }) => { - // const jsonBtn = page.locator('#file-type-json') - // await expect(jsonBtn).toBeChecked() - // }) -}) - -// test.describe("Check all links", () => { -// test("Check Thingweb logo link", async ({ page }) => { -// const thingwebPromise = page.waitForEvent('popup') -// await page.locator(".logo").click() -// const thingwebPage = await thingwebPromise -// await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") -// await expect(thingwebPage).toHaveURL("https://www.thingweb.io") -// }) - -// test("Check CLI link", async ({ page }) => { -// const cliPromise = page.waitForEvent('popup') -// await page.locator(".cli-link").click() -// const cliPage = await cliPromise -// await expect(cliPage).toHaveURL("https://github.com/eclipse-thingweb/playground/tree/master/packages/cli") -// }) - -// test("Check Github link", async ({ page }) => { -// const githubPromise = page.waitForEvent('popup') -// await page.locator(".git-link").click() -// const githubPage = await githubPromise -// await expect(githubPage).toHaveTitle(/GitHub - eclipse-thingweb/) -// await expect(githubPage).toHaveURL("https://github.com/eclipse-thingweb/playground") -// }) - -// test("Check Thingweb footer link", async ({ page }) => { -// await page.locator('#settings-btn').click() -// const thingwebPromise = page.waitForEvent('popup') -// await page.locator("#thingweb-link").click() -// const thingwebPage = await thingwebPromise -// await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") -// await expect(thingwebPage).toHaveURL("https://www.thingweb.io") -// }) - -// test("Check Eclipse footer link", async ({ page }) => { -// await page.locator('#settings-btn').click() -// const eclipsePromise = page.waitForEvent('popup') -// await page.locator("#eclipse-link").click() -// const eclipsePage = await eclipsePromise -// await expect(eclipsePage).toHaveTitle("The Community for Open Collaboration and Innovation | The Eclipse Foundation") -// await expect(eclipsePage).toHaveURL("https://www.eclipse.org") -// }) - -// test("Check privacy policy footer link", async ({ page }) => { -// await page.locator('#settings-btn').click() -// const privacyPromise = page.waitForEvent('popup') -// await page.locator("#privacy-link").click() -// const privacyPage = await privacyPromise -// await expect(privacyPage).toHaveTitle("Eclipse Foundation Website Privacy Policy | The Eclipse Foundation") -// await expect(privacyPage).toHaveURL("https://www.eclipse.org/legal/privacy.php") -// }) - -// test("Check terms of use footer link", async ({ page }) => { -// await page.locator('#settings-btn').click() -// const termsPromise = page.waitForEvent('popup') -// await page.locator("#terms-link").click() -// const termsPage = await termsPromise -// await expect(termsPage).toHaveTitle("Eclipse.org Terms of Use | The Eclipse Foundation") -// await expect(termsPage).toHaveURL("https://www.eclipse.org/legal/termsofuse.php") -// }) - -// test("Check copyright agent footer link", async ({ page }) => { -// await page.locator('#settings-btn').click() -// const copyrightPromise = page.waitForEvent('popup') -// await page.locator("#copyright-link").click() -// const copyrightPage = await copyrightPromise -// await expect(copyrightPage).toHaveTitle("Copyright Agent | The Eclipse Foundation") -// await expect(copyrightPage).toHaveURL("https://www.eclipse.org/legal/copyright.php") -// }) - -// test("Check legal footer link", async ({ page }) => { -// await page.locator('#settings-btn').click() -// const legalPromise = page.waitForEvent('popup') -// await page.locator("#legal-link").click() -// const legalPage = await legalPromise -// await expect(legalPage).toHaveTitle("Eclipse Foundation Legal Resources | The Eclipse Foundation") -// await expect(legalPage).toHaveURL("https://www.eclipse.org/legal/") -// }) -// }) - -// test.describe("Editors and Tabs creation and deletion", () => { -// test("Adding a new editor and closing it", async ({ page }) => { -// const editorTabs = page.locator("#tab") -// const editors = page.locator(".editor") -// await expect(editorTabs).toHaveCount(1) -// await expect(editors).toHaveCount(1) - -// const initialTab = page.locator("#tab").nth(0) -// await expect(initialTab).toHaveAttribute('data-tab-id', "1") -// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(initialTab).toHaveClass("active") - -// const initialEditor = page.locator("#editor1") -// await expect(initialEditor).toHaveAttribute('data-ide-id', "1") -// await expect(initialEditor).toHaveClass("editor active") - -// await page.locator("#ide-tab-add").click() -// await expect(editorTabs).toHaveCount(2) -// await expect(editors).toHaveCount(2) - -// await expect(initialTab).toHaveClass("") -// await expect(initialEditor).toHaveClass("editor") - -// const secondTab = page.locator("#tab").nth(1) -// await expect(secondTab).toHaveAttribute('data-tab-id', "2") -// await expect(secondTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(secondTab).toHaveClass("active") - -// const secondEditor = page.locator("#editor2") -// await expect(secondEditor).toHaveAttribute('data-ide-id', "2") -// await expect(secondEditor).toHaveClass("editor active") - -// await page.locator("#tab").nth(1).locator(".close-tab").click() -// await page.locator('#tab').nth(1).locator(".confirm-btns > .confirm-tab-close").click() - -// await expect(editorTabs).toHaveCount(1) -// await expect(editors).toHaveCount(1) - -// await expect(initialTab).toHaveClass("active") -// await expect(initialEditor).toHaveClass("editor active") -// }) - -// test("Opening an example and closing initial editor", async ({ page }) => { -// const editorTabs = page.locator("#tab") -// const editors = page.locator(".editor") -// await expect(editorTabs).toHaveCount(1) -// await expect(editors).toHaveCount(1) - -// const initialTab = page.locator("#tab").nth(0) -// await expect(initialTab).toHaveAttribute('data-tab-id', "1") -// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(initialTab).toHaveClass("active") - -// const initialEditor = page.locator("#editor1") -// await expect(initialEditor).toHaveAttribute('data-ide-id', "1") -// await expect(initialEditor).toHaveClass("editor active") - -// await page.locator("#examples-btn").click() -// await page.locator(".example").nth(0).click() -// await page.locator(".example").nth(0).getByRole("button", { name: /Apply/ }).click() - -// await expect(editorTabs).toHaveCount(2) -// await expect(editors).toHaveCount(2) - -// await expect(initialTab).toHaveClass("") -// await expect(initialEditor).toHaveClass("editor") - -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") - -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveClass("editor active") - -// await page.locator("#tab").nth(0).locator(".close-tab").click() -// await page.locator('#tab').nth(0).locator(".confirm-btns > .confirm-tab-close").click() - -// await expect(editorTabs).toHaveCount(1) -// await expect(editors).toHaveCount(1) -// }) -// }) - -// test.describe("JSON and YAML conversion", () => { -// test("JSON to YAML and YAML to JSON", async ({ page }) => { -// const editorTabs = page.locator("#tab") -// const editors = page.locator(".editor") -// await expect(editorTabs).toHaveCount(1) -// await expect(editors).toHaveCount(1) - -// const jsonYamlPopup = page.locator('.json-yaml-warning') -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - -// const initialEditor = page.locator("#editor1") -// const jsonBtn = page.locator('#file-type-json') -// const yamlBtn = page.locator('#file-type-yaml') - -// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) - -// await yamlBtn.click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - -// await page.locator('#yaml-confirm-btn').click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(initialEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(jsonBtn).toBeChecked({ checked: false }) -// await expect(yamlBtn).toBeChecked({ checked: true }) - -// await jsonBtn.click() -// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) -// }) - -// test("Cancel YAML conversion", async ({ page }) => { -// const editorTabs = page.locator("#tab") -// const editors = page.locator(".editor") -// await expect(editorTabs).toHaveCount(1) -// await expect(editors).toHaveCount(1) - -// const jsonYamlPopup = page.locator('.json-yaml-warning') -// const initialEditor = page.locator("#editor1") -// const jsonBtn = page.locator('#file-type-json') -// const yamlBtn = page.locator('#file-type-yaml') - -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) - -// await yamlBtn.click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - -// await page.locator('#yaml-cancel-btn').click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) -// }) -// }) - - -// test.describe("Examples menu functionality", () => { -// test("Open and close examples menu", async ({ page }) => { - -// await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) -// await page.locator("#examples-btn").click() - -// await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: true }) -// await page.locator(".examples-menu-container__close > i").click() - -// await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) -// }) - -// test("Open Basic TD from quick access", async ({ page }) => { - -// await page.locator("#examples-btn").click() - -// const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) -// await expect(basicExample).toHaveClass("example") - -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) -// await quickAccessBtn.click() - -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") - -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveClass("editor active") - -// }) - -// test("Open Basic TD from apply button", async ({ page }) => { - -// await page.locator("#examples-btn").click() - -// const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) -// await basicExample.click() -// await expect(basicExample).toHaveClass("example open") - -// const applyBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Apply" }) -// await applyBtn.click() -// await expect(basicExample).toHaveClass("example") - -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") - -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveClass("editor active") -// }) - -// test("Open Basic TD and close with cancel button", async ({ page }) => { -// await page.locator("#examples-btn").click() - -// const basicTDExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) -// await basicTDExample.click() -// await expect(basicTDExample).toHaveClass("example open") - -// const cancelBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Cancel" }) -// await cancelBtn.click() -// await expect(basicTDExample).toHaveClass("example") -// }) - -// test("Toggle between TD and TM examples", async ({ page }) => { -// await page.locator("#examples-btn").click() - -// const thingTypeToggle = page.locator('#thing-type-btn') -// await expect(thingTypeToggle).toBeChecked({ checked: false }) - -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) -// }) - -// test("Open Basic TM and check for icon change in tab", async ({ page }) => { -// await page.locator("#examples-btn").click() - -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) - -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() - -// const tabIcon = page.locator("#tab").nth(1).locator(".tab-icon") -// await expect(tabIcon).toHaveText("TM") -// }) - -// test("Go to versioning in TD category and open example from quick access", async ({ page }) => { -// await page.locator("#examples-btn").click() - -// const categoryDropDown = page.locator("#thing-category") -// await categoryDropDown.selectOption('9-versioning') - -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Versioning' }).nth(0).getByRole("button").nth(0) -// await quickAccessBtn.click() - -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") -// }) - -// test("Go to Tm Optional in TM category and open example from quick access", async ({ page }) => { -// await page.locator("#examples-btn").click() - -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + test('Has editor tab', async ({ page }) => { + const editorTab = page.locator('#tab') + await expect(editorTab).toHaveText("TDThing TemplateCloseCancel") + }) -// const categoryDropDown = page.locator("#thing-category") -// await categoryDropDown.selectOption('4-tm-optional') + test('Has TD template', async ({ page }) => { + const editor = page.locator('#editor1').getByRole('code').locator('div').filter({ hasText: '"title": "Thing Template",' }).nth(4) + await expect(editor).toHaveText('"title": "Thing Template",') + }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Optional Interaction Affordances' }).nth(0).getByRole("button").nth(0) -// await quickAccessBtn.click() + test('Validation tab is checked', async ({ page }) => { + const validationTab = page.locator('#validation-tab') + await expect(validationTab).toBeChecked() + }) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") -// }) + test('Validation view is opened', async ({ page }) => { + const validationView = page.locator('#validation-view') + await expect(validationView).toHaveClass("console-view validation-view") + }) -// test("Search for uriVariable in the TDs and open Combined URI variables in href example", async ({ page }) => { -// await page.locator("#examples-btn").click() + test('JSON button is checked', async ({ page }) => { + const jsonBtn = page.locator('#file-type-json') + await expect(jsonBtn).toBeChecked() + }) +}) -// const searchInput = page.locator(".search-input") -// searchInput.fill('uriVariables') +test.describe("Check all links", () => { + test("Check Thingweb logo link", async ({ page }) => { + const thingwebPromise = page.waitForEvent('popup') + await page.locator(".logo").click() + const thingwebPage = await thingwebPromise + await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") + await expect(thingwebPage).toHaveURL("https://www.thingweb.io") + }) -// const searchBtn = page.locator(".search-btn") -// await searchBtn.click() + test("Check CLI link", async ({ page }) => { + const cliPromise = page.waitForEvent('popup') + await page.locator(".cli-link").click() + const cliPage = await cliPromise + await expect(cliPage).toHaveURL("https://github.com/eclipse-thingweb/playground/tree/master/packages/cli") + }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Combined URI variables in href' }).nth(0).getByRole("button").nth(0) -// await quickAccessBtn.click() + test("Check Github link", async ({ page }) => { + const githubPromise = page.waitForEvent('popup') + await page.locator(".git-link").click() + const githubPage = await githubPromise + await expect(githubPage).toHaveTitle(/GitHub - eclipse-thingweb/) + await expect(githubPage).toHaveURL("https://github.com/eclipse-thingweb/playground") + }) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyWeatherThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") -// }) + test("Check Thingweb footer link", async ({ page }) => { + await page.locator('#settings-btn').click() + const thingwebPromise = page.waitForEvent('popup') + await page.locator("#thingweb-link").click() + const thingwebPage = await thingwebPromise + await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") + await expect(thingwebPage).toHaveURL("https://www.thingweb.io") + }) -// test("Search for overwrite in the TMs and open Overwrite Existing Definitions example", async ({ page }) => { -// await page.locator("#examples-btn").click() + test("Check Eclipse footer link", async ({ page }) => { + await page.locator('#settings-btn').click() + const eclipsePromise = page.waitForEvent('popup') + await page.locator("#eclipse-link").click() + const eclipsePage = await eclipsePromise + await expect(eclipsePage).toHaveTitle("The Community for Open Collaboration and Innovation | The Eclipse Foundation") + await expect(eclipsePage).toHaveURL("https://www.eclipse.org") + }) -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + test("Check privacy policy footer link", async ({ page }) => { + await page.locator('#settings-btn').click() + const privacyPromise = page.waitForEvent('popup') + await page.locator("#privacy-link").click() + const privacyPage = await privacyPromise + await expect(privacyPage).toHaveTitle("Eclipse Foundation Website Privacy Policy | The Eclipse Foundation") + await expect(privacyPage).toHaveURL("https://www.eclipse.org/legal/privacy.php") + }) -// const searchInput = page.locator(".search-input") -// searchInput.fill('overwrite') + test("Check terms of use footer link", async ({ page }) => { + await page.locator('#settings-btn').click() + const termsPromise = page.waitForEvent('popup') + await page.locator("#terms-link").click() + const termsPage = await termsPromise + await expect(termsPage).toHaveTitle("Eclipse.org Terms of Use | The Eclipse Foundation") + await expect(termsPage).toHaveURL("https://www.eclipse.org/legal/termsofuse.php") + }) -// const searchBtn = page.locator(".search-btn") -// await searchBtn.click() + test("Check copyright agent footer link", async ({ page }) => { + await page.locator('#settings-btn').click() + const copyrightPromise = page.waitForEvent('popup') + await page.locator("#copyright-link").click() + const copyrightPage = await copyrightPromise + await expect(copyrightPage).toHaveTitle("Copyright Agent | The Eclipse Foundation") + await expect(copyrightPage).toHaveURL("https://www.eclipse.org/legal/copyright.php") + }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Overwrite Existing Definitions' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + test("Check legal footer link", async ({ page }) => { + await page.locator('#settings-btn').click() + const legalPromise = page.waitForEvent('popup') + await page.locator("#legal-link").click() + const legalPage = await legalPromise + await expect(legalPage).toHaveTitle("Eclipse Foundation Legal Resources | The Eclipse Foundation") + await expect(legalPage).toHaveURL("https://www.eclipse.org/legal/") + }) +}) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMSmart Lamp ControlCloseCancel") -// await expect(exampleTab).toHaveClass("active") -// }) -// }) +test.describe("Editors and Tabs creation and deletion", () => { + test("Adding a new editor and closing it", async ({ page }) => { + const editorTabs = page.locator("#tab") + const editors = page.locator(".editor") + await expect(editorTabs).toHaveCount(1) + await expect(editors).toHaveCount(1) -// test.describe("Save menu functionality", () => { -// test("Open and close save menu", async ({ page }) => { -// const saveMenu = page.locator(".save-menu") -// await expect(saveMenu).toHaveClass("save-menu closed") + const initialTab = page.locator("#tab").nth(0) + await expect(initialTab).toHaveAttribute('data-tab-id', "1") + await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") + await expect(initialTab).toHaveClass("active") -// await page.locator("#save-btn").click() -// await expect(saveMenu).toHaveClass("save-menu") + const initialEditor = page.locator("#editor1") + await expect(initialEditor).toHaveAttribute('data-ide-id', "1") + await expect(initialEditor).toHaveClass("editor active") -// const closeMenu = page.locator(".save-menu-close > i") -// await closeMenu.click() -// await expect(saveMenu).toHaveClass("save-menu closed") -// }) + await page.locator("#ide-tab-add").click() + await expect(editorTabs).toHaveCount(2) + await expect(editors).toHaveCount(2) -// test("Open save menu with template thing and check for TD in menu title", async ({ page }) => { -// const saveMenu = page.locator(".save-menu") + await expect(initialTab).toHaveClass("") + await expect(initialEditor).toHaveClass("editor") -// await page.locator("#save-btn").click() -// await expect(saveMenu).toHaveClass("save-menu") + const secondTab = page.locator("#tab").nth(1) + await expect(secondTab).toHaveAttribute('data-tab-id', "2") + await expect(secondTab).toHaveText("TDThing TemplateCloseCancel") + await expect(secondTab).toHaveClass("active") -// const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") -// await expect(titleThingType).toHaveText("TD") -// }) + const secondEditor = page.locator("#editor2") + await expect(secondEditor).toHaveAttribute('data-ide-id', "2") + await expect(secondEditor).toHaveClass("editor active") -// test("Open TM examples check for TM in the save menu title", async ({ page }) => { -// await page.locator("#examples-btn").click() + await page.locator("#tab").nth(1).locator(".close-tab").click() + await page.locator('#tab').nth(1).locator(".confirm-btns > .confirm-tab-close").click() -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + await expect(editorTabs).toHaveCount(1) + await expect(editors).toHaveCount(1) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + await expect(initialTab).toHaveClass("active") + await expect(initialEditor).toHaveClass("editor active") + }) -// const saveMenu = page.locator(".save-menu") + test("Opening an example and closing initial editor", async ({ page }) => { + const editorTabs = page.locator("#tab") + const editors = page.locator(".editor") + await expect(editorTabs).toHaveCount(1) + await expect(editors).toHaveCount(1) -// await page.locator("#save-btn").click() -// await expect(saveMenu).toHaveClass("save-menu") + const initialTab = page.locator("#tab").nth(0) + await expect(initialTab).toHaveAttribute('data-tab-id', "1") + await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") + await expect(initialTab).toHaveClass("active") -// const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") -// await expect(titleThingType).toHaveText("TM") -// }) + const initialEditor = page.locator("#editor1") + await expect(initialEditor).toHaveAttribute('data-ide-id', "1") + await expect(initialEditor).toHaveClass("editor active") -// test("Share and open in new tab functionality with an example", async ({ page }) => { + await page.locator("#examples-btn").click() + await page.locator(".example").nth(0).click() + await page.locator(".example").nth(0).getByRole("button", { name: /Apply/ }).click() -// await page.locator("#examples-btn").click() + await expect(editorTabs).toHaveCount(2) + await expect(editors).toHaveCount(2) -// const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) -// await expect(basicExample).toHaveClass("example") + await expect(initialTab).toHaveClass("") + await expect(initialEditor).toHaveClass("editor") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) -// await quickAccessBtn.click() + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveClass("editor active") -// const saveMenu = page.locator(".save-menu") + await page.locator("#tab").nth(0).locator(".close-tab").click() + await page.locator('#tab').nth(0).locator(".confirm-btns > .confirm-tab-close").click() -// await page.locator("#save-btn").click() -// await expect(saveMenu).toHaveClass("save-menu") + await expect(editorTabs).toHaveCount(1) + await expect(editors).toHaveCount(1) + }) +}) -// const openNewTab = page.locator("#open-url-tab") -// await expect(openNewTab).toBeDisabled() +test.describe("JSON and YAML conversion", () => { + test("JSON to YAML and YAML to JSON", async ({ page }) => { + const editorTabs = page.locator("#tab") + const editors = page.locator(".editor") + await expect(editorTabs).toHaveCount(1) + await expect(editors).toHaveCount(1) + + const jsonYamlPopup = page.locator('.json-yaml-warning') + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + + const initialEditor = page.locator("#editor1") + const jsonBtn = page.locator('#file-type-json') + const yamlBtn = page.locator('#file-type-yaml') + + await expect(initialEditor).toHaveAttribute('data-mode-id', "json") + await expect(jsonBtn).toBeChecked({ checked: true }) + await expect(yamlBtn).toBeChecked({ checked: false }) + + await yamlBtn.click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") + + await page.locator('#yaml-confirm-btn').click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + await expect(initialEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(jsonBtn).toBeChecked({ checked: false }) + await expect(yamlBtn).toBeChecked({ checked: true }) + + await jsonBtn.click() + await expect(initialEditor).toHaveAttribute('data-mode-id', "json") + await expect(jsonBtn).toBeChecked({ checked: true }) + await expect(yamlBtn).toBeChecked({ checked: false }) + }) -// const shareUrlInput = page.locator("#share-url-input") -// await expect(shareUrlInput).toHaveText("") + test("Cancel YAML conversion", async ({ page }) => { + const editorTabs = page.locator("#tab") + const editors = page.locator(".editor") + await expect(editorTabs).toHaveCount(1) + await expect(editors).toHaveCount(1) + + const jsonYamlPopup = page.locator('.json-yaml-warning') + const initialEditor = page.locator("#editor1") + const jsonBtn = page.locator('#file-type-json') + const yamlBtn = page.locator('#file-type-yaml') + + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + await expect(initialEditor).toHaveAttribute('data-mode-id', "json") + await expect(jsonBtn).toBeChecked({ checked: true }) + await expect(yamlBtn).toBeChecked({ checked: false }) + + await yamlBtn.click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") + + await page.locator('#yaml-cancel-btn').click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + await expect(initialEditor).toHaveAttribute('data-mode-id', "json") + await expect(jsonBtn).toBeChecked({ checked: true }) + await expect(yamlBtn).toBeChecked({ checked: false }) + }) +}) -// const shareUrlBtn = page.locator("#share-url-btn") -// await shareUrlBtn.click() -// const newPlaygroundPromise = page.waitForEvent('popup') -// await openNewTab.click() -// const newPlaygroundPage = await newPlaygroundPromise +test.describe("Examples menu functionality", () => { + test("Open and close examples menu", async ({ page }) => { -// await expect(newPlaygroundPage).toHaveTitle("TD Playground") + await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) + await page.locator("#examples-btn").click() -// const newPlaygroundTab = newPlaygroundPage.locator("#tab").nth(0) -// await expect(newPlaygroundTab).toHaveAttribute('data-tab-id', "1") -// await expect(newPlaygroundTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(newPlaygroundTab).toHaveClass("active") + await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: true }) + await page.locator(".examples-menu-container__close > i").click() -// }) + await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) + }) -// test("Open in ediTDor functionality", async ({ page }) => { -// const saveMenu = page.locator(".save-menu") + test("Open Basic TD from quick access", async ({ page }) => { -// await page.locator("#save-btn").click() -// await expect(saveMenu).toHaveClass("save-menu") + await page.locator("#examples-btn").click() -// const shareUrlInput = page.locator("#share-url-input") -// await expect(shareUrlInput).toHaveText("") + const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) + await expect(basicExample).toHaveClass("example") -// const openEditdorBtn = page.locator("#open-editdor-btn") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) + await quickAccessBtn.click() -// const editdorPromise = page.waitForEvent('popup') -// await openEditdorBtn.click() -// const editdorPage = await editdorPromise + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await expect(editdorPage).toHaveTitle("ediTDor") + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveClass("editor active") -// const linkedTd = editdorPage.locator("#linkedTd > option") -// await expect(linkedTd).toHaveText("Thing Template") -// }) + }) -// test("Download functionality", async ({ page }) => { -// const saveMenu = page.locator(".save-menu") + test("Open Basic TD from apply button", async ({ page }) => { -// const exampleTab = page.locator("#tab").nth(0) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "1") -// await expect(exampleTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(exampleTab).toHaveClass("active") + await page.locator("#examples-btn").click() -// await page.locator("#save-btn").click() -// await expect(saveMenu).toHaveClass("save-menu") + const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) + await basicExample.click() + await expect(basicExample).toHaveClass("example open") -// const downloadTdBtn = page.locator(".save-td__download") + const applyBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Apply" }) + await applyBtn.click() + await expect(basicExample).toHaveClass("example") -// // Start waiting for download before clicking. -// const downloadPromise = page.waitForEvent('download') -// await downloadTdBtn.click() -// const download = await downloadPromise -// const expectedFilename = 'Thing-Template.json' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// //* The "Save as" functionality cannot be tested because it requires to open and interact with the file system wich Playwright cannot do -// }) + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveClass("editor active") + }) -// test.describe("Settings menu functionality", () => { -// test("Opening and closing the settings menu", async ({ page }) => { -// const settingsMenu = page.locator(".settings-menu") -// await expect(settingsMenu).toHaveClass("settings-menu closed") + test("Open Basic TD and close with cancel button", async ({ page }) => { + await page.locator("#examples-btn").click() -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + const basicTDExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) + await basicTDExample.click() + await expect(basicTDExample).toHaveClass("example open") -// const closeMenu = page.locator(".settings__close > i") -// await closeMenu.click() -// await expect(settingsMenu).toHaveClass("settings-menu closed") -// }) + const cancelBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Cancel" }) + await cancelBtn.click() + await expect(basicTDExample).toHaveClass("example") + }) -// test("Checking settings toggle buttons", async ({ page }) => { -// const settingsMenu = page.locator(".settings-menu") -// await expect(settingsMenu).toHaveClass("settings-menu closed") + test("Toggle between TD and TM examples", async ({ page }) => { + await page.locator("#examples-btn").click() -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + const thingTypeToggle = page.locator('#thing-type-btn') + await expect(thingTypeToggle).toBeChecked({ checked: false }) -// const autoValidate = page.locator("#auto-validate") -// const validateJsonld = page.locator("#validate-jsonld") -// const tmConformance = page.locator("#tm-conformance") + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) + }) -// await expect(autoValidate).toBeChecked({ checked: false }) -// await expect(validateJsonld).toBeChecked({ checked: true }) -// await expect(tmConformance).toBeChecked({ checked: true }) -// }) + test("Open Basic TM and check for icon change in tab", async ({ page }) => { + await page.locator("#examples-btn").click() -// test("Changing page theme", async ({ page }) => { -// const playgroundSite = page.locator("html") -// await expect(playgroundSite).toHaveClass("light-mode") + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const settingsMenu = page.locator(".settings-menu") -// await expect(settingsMenu).toHaveClass("settings-menu closed") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + const tabIcon = page.locator("#tab").nth(1).locator(".tab-icon") + await expect(tabIcon).toHaveText("TM") + }) -// const themePicker = page.locator("#theme-picker") -// await themePicker.selectOption('monochrome-mode') -// await expect(playgroundSite).toHaveClass("monochrome-mode") + test("Go to versioning in TD category and open example from quick access", async ({ page }) => { + await page.locator("#examples-btn").click() -// await themePicker.selectOption('dark-mode') -// await expect(playgroundSite).toHaveClass("dark-mode") + const categoryDropDown = page.locator("#thing-category") + await categoryDropDown.selectOption('9-versioning') -// await page.reload({ waitUntil: 'domcontentloaded' }) -// await expect(playgroundSite).toHaveClass("dark-mode") -// }) + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Versioning' }).nth(0).getByRole("button").nth(0) + await quickAccessBtn.click() -// test("Changing font size", async ({ page }) => { -// const settingsMenu = page.locator(".settings-menu") -// await expect(settingsMenu).toHaveClass("settings-menu closed") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") + }) -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + test("Go to Tm Optional in TM category and open example from quick access", async ({ page }) => { + await page.locator("#examples-btn").click() -// const editorFontSize = page.locator(".editor-font-size") -// await expect(editorFontSize).toHaveText("14") + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const fontSizeSlider = page.locator('#font-size') -// await fontSizeSlider.click() + const categoryDropDown = page.locator("#thing-category") + await categoryDropDown.selectOption('4-tm-optional') -// await expect(editorFontSize).toHaveText("23") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Optional Interaction Affordances' }).nth(0).getByRole("button").nth(0) + await quickAccessBtn.click() -// await page.reload({ waitUntil: 'domcontentloaded' }) + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") + await expect(exampleTab).toHaveClass("active") + }) -// await expect(settingsMenu).toHaveClass("settings-menu closed") + test("Search for uriVariable in the TDs and open Combined URI variables in href example", async ({ page }) => { + await page.locator("#examples-btn").click() -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + const searchInput = page.locator(".search-input") + searchInput.fill('uriVariables') -// await expect(editorFontSize).toHaveText("23") -// }) + const searchBtn = page.locator(".search-btn") + await searchBtn.click() -// test("Utilizing default settings", async ({ page }) => { -// const playgroundSite = page.locator("html") -// await expect(playgroundSite).toHaveClass("light-mode") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Combined URI variables in href' }).nth(0).getByRole("button").nth(0) + await quickAccessBtn.click() -// const settingsMenu = page.locator(".settings-menu") -// await expect(settingsMenu).toHaveClass("settings-menu closed") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyWeatherThingCloseCancel") + await expect(exampleTab).toHaveClass("active") + }) -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + test("Search for overwrite in the TMs and open Overwrite Existing Definitions example", async ({ page }) => { + await page.locator("#examples-btn").click() -// const themePicker = page.locator("#theme-picker") -// await themePicker.selectOption('dark-mode') -// await expect(playgroundSite).toHaveClass("dark-mode") + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const editorFontSize = page.locator(".editor-font-size") -// await expect(editorFontSize).toHaveText("14") + const searchInput = page.locator(".search-input") + searchInput.fill('overwrite') -// const fontSizeSlider = page.locator('#font-size') -// await fontSizeSlider.click() + const searchBtn = page.locator(".search-btn") + await searchBtn.click() -// await expect(editorFontSize).toHaveText("23") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Overwrite Existing Definitions' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// await page.reload({ waitUntil: 'domcontentloaded' }) + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMSmart Lamp ControlCloseCancel") + await expect(exampleTab).toHaveClass("active") + }) +}) -// await expect(settingsMenu).toHaveClass("settings-menu closed") +test.describe("Save menu functionality", () => { + test("Open and close save menu", async ({ page }) => { + const saveMenu = page.locator(".save-menu") + await expect(saveMenu).toHaveClass("save-menu closed") -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + await page.locator("#save-btn").click() + await expect(saveMenu).toHaveClass("save-menu") -// await expect(playgroundSite).toHaveClass("dark-mode") -// await expect(editorFontSize).toHaveText("23") + const closeMenu = page.locator(".save-menu-close > i") + await closeMenu.click() + await expect(saveMenu).toHaveClass("save-menu closed") + }) -// const resetSettings = page.locator('.reset-settings') -// await resetSettings.click() + test("Open save menu with template thing and check for TD in menu title", async ({ page }) => { + const saveMenu = page.locator(".save-menu") -// await expect(playgroundSite).toHaveClass("light-mode") -// await expect(editorFontSize).toHaveText("14") + await page.locator("#save-btn").click() + await expect(saveMenu).toHaveClass("save-menu") -// await page.reload({ waitUntil: 'domcontentloaded' }) + const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") + await expect(titleThingType).toHaveText("TD") + }) -// await expect(settingsMenu).toHaveClass("settings-menu closed") + test("Open TM examples check for TM in the save menu title", async ({ page }) => { + await page.locator("#examples-btn").click() -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// await expect(playgroundSite).toHaveClass("light-mode") -// await expect(editorFontSize).toHaveText("14") -// }) -// }) + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// test.describe("Validation view functionality", () => { + const saveMenu = page.locator(".save-menu") -// test("Starting the validation with the main validation button", async ({ page }) => { + await page.locator("#save-btn").click() + await expect(saveMenu).toHaveClass("save-menu") -// const validationTab = page.locator('#validation-tab') -// const validationView = page.locator('#validation-view') + const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") + await expect(titleThingType).toHaveText("TM") + }) -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + test("Share and open in new tab functionality with an example", async ({ page }) => { -// const stateIcon = page.locator(".json-validation-section > .section-header > i").nth(0) -// await expect(stateIcon).toHaveClass("fa-solid fa-circle") + await page.locator("#examples-btn").click() -// const validationBtn = page.locator("#validate-btn") -// await validationBtn.click() + const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) + await expect(basicExample).toHaveClass("example") -// //TODO: Find a better way to wait for this event to happen -// await page.waitForTimeout(5000) -// await expect(stateIcon).toHaveClass("fa-solid fa-circle-check") -// }) + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) + await quickAccessBtn.click() -// test("Validating the 'All Defaults TD'", async ({ page }) => { -// const validationTab = page.locator('#validation-tab') -// const validationView = page.locator('#validation-view') + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + const saveMenu = page.locator(".save-menu") -// await page.locator("#examples-btn").click() + await page.locator("#save-btn").click() + await expect(saveMenu).toHaveClass("save-menu") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'All Default Values' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const openNewTab = page.locator("#open-url-tab") + await expect(openNewTab).toBeDisabled() -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const shareUrlInput = page.locator("#share-url-input") + await expect(shareUrlInput).toHaveText("") -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + const shareUrlBtn = page.locator("#share-url-btn") + await shareUrlBtn.click() -// const validationBtn = page.locator("#validate-btn") -// await validationBtn.click() + const newPlaygroundPromise = page.waitForEvent('popup') + await openNewTab.click() + const newPlaygroundPage = await newPlaygroundPromise -// //validation section -// const jsonValidationSection = page.locator(".json-validation-section") -// const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) -// const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") + await expect(newPlaygroundPage).toHaveTitle("TD Playground") -// await jsonValidationSection.click() -// await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + const newPlaygroundTab = newPlaygroundPage.locator("#tab").nth(0) + await expect(newPlaygroundTab).toHaveAttribute('data-tab-id', "1") + await expect(newPlaygroundTab).toHaveText("TDMyLampThingCloseCancel") + await expect(newPlaygroundTab).toHaveClass("active") -// const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") -// const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) -// const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") + }) -// await jsonSchemaValidationSection.click() -// await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + test("Open in ediTDor functionality", async ({ page }) => { + const saveMenu = page.locator(".save-menu") -// const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") -// const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) -// const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li") + await page.locator("#save-btn").click() + await expect(saveMenu).toHaveClass("save-menu") -// await jsonSchemaDefaultsSection.click() -// await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-check") + const shareUrlInput = page.locator("#share-url-input") + await expect(shareUrlInput).toHaveText("") -// const jsonlsValidationSection = page.locator(".jsonls-validation-section") -// const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) -// const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") + const openEditdorBtn = page.locator("#open-editdor-btn") -// await jsonlsValidationSection.click() -// await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + const editdorPromise = page.waitForEvent('popup') + await openEditdorBtn.click() + const editdorPage = await editdorPromise -// const additionalChecksSection = page.locator(".additional-checks-section") -// const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) -// const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") + await expect(editdorPage).toHaveTitle("ediTDor") -// await additionalChecksSection.click() -// await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") -// await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") -// }) + const linkedTd = editdorPage.locator("#linkedTd > option") + await expect(linkedTd).toHaveText("Thing Template") + }) -// test("Validating the 'Basic TD'", async ({ page }) => { -// const validationTab = page.locator('#validation-tab') -// const validationView = page.locator('#validation-view') + test("Download functionality", async ({ page }) => { + const saveMenu = page.locator(".save-menu") -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + const exampleTab = page.locator("#tab").nth(0) + await expect(exampleTab).toHaveAttribute('data-tab-id', "1") + await expect(exampleTab).toHaveText("TDThing TemplateCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await page.locator("#examples-btn").click() + await page.locator("#save-btn").click() + await expect(saveMenu).toHaveClass("save-menu") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const downloadTdBtn = page.locator(".save-td__download") -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + // Start waiting for download before clicking. + const downloadPromise = page.waitForEvent('download') + await downloadTdBtn.click() + const download = await downloadPromise + const expectedFilename = 'Thing-Template.json' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + //* The "Save as" functionality cannot be tested because it requires to open and interact with the file system wich Playwright cannot do +}) -// const validationBtn = page.locator("#validate-btn") -// await validationBtn.click() +test.describe("Settings menu functionality", () => { + test("Opening and closing the settings menu", async ({ page }) => { + const settingsMenu = page.locator(".settings-menu") + await expect(settingsMenu).toHaveClass("settings-menu closed") -// //Validation section -// const jsonValidationSection = page.locator(".json-validation-section") -// const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) -// const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// await jsonValidationSection.click() -// await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + const closeMenu = page.locator(".settings__close > i") + await closeMenu.click() + await expect(settingsMenu).toHaveClass("settings-menu closed") + }) -// const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") -// const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) -// const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") + test("Checking settings toggle buttons", async ({ page }) => { + const settingsMenu = page.locator(".settings-menu") + await expect(settingsMenu).toHaveClass("settings-menu closed") -// await jsonSchemaValidationSection.click() -// await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") -// const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) -// const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) + const autoValidate = page.locator("#auto-validate") + const validateJsonld = page.locator("#validate-jsonld") + const tmConformance = page.locator("#tm-conformance") -// await jsonSchemaDefaultsSection.click() -// await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Optional validation failed:") -// await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-exclamation") + await expect(autoValidate).toBeChecked({ checked: false }) + await expect(validateJsonld).toBeChecked({ checked: true }) + await expect(tmConformance).toBeChecked({ checked: true }) + }) -// const jsonlsValidationSection = page.locator(".jsonls-validation-section") -// const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) -// const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") + test("Changing page theme", async ({ page }) => { + const playgroundSite = page.locator("html") + await expect(playgroundSite).toHaveClass("light-mode") -// await jsonlsValidationSection.click() -// await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + const settingsMenu = page.locator(".settings-menu") + await expect(settingsMenu).toHaveClass("settings-menu closed") -// const additionalChecksSection = page.locator(".additional-checks-section") -// const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) -// const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// await additionalChecksSection.click() -// await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") -// await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") -// }) + const themePicker = page.locator("#theme-picker") + await themePicker.selectOption('monochrome-mode') + await expect(playgroundSite).toHaveClass("monochrome-mode") -// test("Validating the 'Basic TM'", async ({ page }) => { + await themePicker.selectOption('dark-mode') + await expect(playgroundSite).toHaveClass("dark-mode") -// const validationTab = page.locator('#validation-tab') -// const validationView = page.locator('#validation-view') + await page.reload({ waitUntil: 'domcontentloaded' }) + await expect(playgroundSite).toHaveClass("dark-mode") + }) -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + test("Changing font size", async ({ page }) => { + const settingsMenu = page.locator(".settings-menu") + await expect(settingsMenu).toHaveClass("settings-menu closed") -// await page.locator("#examples-btn").click() + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + const editorFontSize = page.locator(".editor-font-size") + await expect(editorFontSize).toHaveText("14") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + const fontSizeSlider = page.locator('#font-size') + await fontSizeSlider.click() -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(editorFontSize).toHaveText("23") -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + await page.reload({ waitUntil: 'domcontentloaded' }) -// const validationBtn = page.locator("#validate-btn") -// await validationBtn.click() + await expect(settingsMenu).toHaveClass("settings-menu closed") -// //Validation section -// const jsonValidationSection = page.locator(".json-validation-section") -// const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) -// const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// await jsonValidationSection.click() -// await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(editorFontSize).toHaveText("23") + }) -// const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") -// const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) -// const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") + test("Utilizing default settings", async ({ page }) => { + const playgroundSite = page.locator("html") + await expect(playgroundSite).toHaveClass("light-mode") -// await jsonSchemaValidationSection.click() -// await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + const settingsMenu = page.locator(".settings-menu") + await expect(settingsMenu).toHaveClass("settings-menu closed") -// const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") -// const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) -// const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// await jsonSchemaDefaultsSection.click() -// await expect(jsonSchemaDefaultsSectionTxt).toHaveText("A previous validation has failed or it is only available for Thing Descriptions") -// await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle") + const themePicker = page.locator("#theme-picker") + await themePicker.selectOption('dark-mode') + await expect(playgroundSite).toHaveClass("dark-mode") -// const jsonlsValidationSection = page.locator(".jsonls-validation-section") -// const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) -// const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") + const editorFontSize = page.locator(".editor-font-size") + await expect(editorFontSize).toHaveText("14") -// await jsonlsValidationSection.click() -// await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + const fontSizeSlider = page.locator('#font-size') + await fontSizeSlider.click() -// const additionalChecksSection = page.locator(".additional-checks-section") -// const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) -// const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") + await expect(editorFontSize).toHaveText("23") -// await additionalChecksSection.click() -// await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") -// await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") -// }) + await page.reload({ waitUntil: 'domcontentloaded' }) -// }) + await expect(settingsMenu).toHaveClass("settings-menu closed") -// test.describe("OpenAPI view functionality", () => { -// test("Trying to open the OpenAPI view with a TD with no protocols", async ({ page }) => { + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// const initialTab = page.locator("#tab").nth(0) -// await expect(initialTab).toHaveAttribute('data-tab-id', "1") -// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(initialTab).toHaveClass("active") + await expect(playgroundSite).toHaveClass("dark-mode") + await expect(editorFontSize).toHaveText("23") -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") + const resetSettings = page.locator('.reset-settings') + await resetSettings.click() -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) + await expect(playgroundSite).toHaveClass("light-mode") + await expect(editorFontSize).toHaveText("14") -// await openAPITab.click() + await page.reload({ waitUntil: 'domcontentloaded' }) -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses HTTP!") -// }) + await expect(settingsMenu).toHaveClass("settings-menu closed") -// test("Trying to open the OpenAPI view with a TM", async ({ page }) => { + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// await page.locator("#examples-btn").click() + await expect(playgroundSite).toHaveClass("light-mode") + await expect(editorFontSize).toHaveText("14") + }) +}) -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) +test.describe("Validation view functionality", () => { -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + test("Starting the validation with the main validation button", async ({ page }) => { -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const validationTab = page.locator('#validation-tab') + const validationView = page.locator('#validation-view') -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) + const stateIcon = page.locator(".json-validation-section > .section-header > i").nth(0) + await expect(stateIcon).toHaveClass("fa-solid fa-circle") -// await openAPITab.click() + const validationBtn = page.locator("#validate-btn") + await validationBtn.click() -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") + //TODO: Find a better way to wait for this event to happen + await page.waitForTimeout(5000) + await expect(stateIcon).toHaveClass("fa-solid fa-circle-check") + }) -// }) + test("Validating the 'All Defaults TD'", async ({ page }) => { + const validationTab = page.locator('#validation-tab') + const validationView = page.locator('#validation-view') -// test("Open the OpenAPI view with the 'Basic TD' example", async ({ page }) => { -// await page.locator("#examples-btn").click() + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + await page.locator("#examples-btn").click() -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'All Default Values' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) + const validationBtn = page.locator("#validate-btn") + await validationBtn.click() -// await openAPITab.click() + //validation section + const jsonValidationSection = page.locator(".json-validation-section") + const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) + const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await jsonValidationSection.click() + await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// const openAPIEditor = page.locator('#open-api-container') -// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) + const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") + const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) + const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') + await jsonSchemaValidationSection.click() + await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// const openAPIJsonBtn = page.locator('#open-api-json') + const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") + const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) + const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li") -// await expect(openAPIJsonBtn).toBeDisabled() + await jsonSchemaDefaultsSection.click() + await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Validated Successfully") + await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-check") -// }) + const jsonlsValidationSection = page.locator(".jsonls-validation-section") + const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) + const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") -// test("Open the OpenAPI view with the 'Basic TD' example as YAML", async ({ page }) => { + await jsonlsValidationSection.click() + await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// await page.locator("#examples-btn").click() + const additionalChecksSection = page.locator(".additional-checks-section") + const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) + const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + await additionalChecksSection.click() + await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") + await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") + }) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + test("Validating the 'Basic TD'", async ({ page }) => { + const validationTab = page.locator('#validation-tab') + const validationView = page.locator('#validation-view') -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") + await page.locator("#examples-btn").click() -// const jsonYamlPopup = page.locator('.json-yaml-warning') -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// const jsonBtn = page.locator('#file-type-json') -// const yamlBtn = page.locator('#file-type-yaml') + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") -// await yamlBtn.click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") + const validationBtn = page.locator("#validate-btn") + await validationBtn.click() -// await page.locator('#yaml-confirm-btn').click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(jsonBtn).toBeChecked({ checked: false }) -// await expect(yamlBtn).toBeChecked({ checked: true }) + //Validation section + const jsonValidationSection = page.locator(".json-validation-section") + const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) + const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") + await jsonValidationSection.click() + await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) + const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") + const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) + const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") -// await openAPITab.click() + await jsonSchemaValidationSection.click() + await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") + const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) + const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) -// const openAPIEditor = page.locator('#open-api-container') -// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: "3.0.3"' }).nth(4) + await jsonSchemaDefaultsSection.click() + await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Optional validation failed:") + await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-exclamation") -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(openAPIContainer).toHaveText('openapi: "3.0.3"') + const jsonlsValidationSection = page.locator(".jsonls-validation-section") + const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) + const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") -// const openAPIYamlBtn = page.locator('#open-api-yaml') -// await expect(openAPIYamlBtn).toBeDisabled() + await jsonlsValidationSection.click() + await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// }) + const additionalChecksSection = page.locator(".additional-checks-section") + const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) + const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") -// test("Open the OpenAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { -// await page.locator("#examples-btn").click() + await additionalChecksSection.click() + await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") + await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") + }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + test("Validating the 'Basic TM'", async ({ page }) => { -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const validationTab = page.locator('#validation-tab') + const validationView = page.locator('#validation-view') -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") + await page.locator("#examples-btn").click() -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// await openAPITab.click() + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const openAPIEditor = page.locator('#open-api-container') + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") + const validationBtn = page.locator("#validate-btn") + await validationBtn.click() -// const openAPIJsonBtn = page.locator('#open-api-json') -// const openAPIYamlBtn = page.locator('#open-api-yaml') + //Validation section + const jsonValidationSection = page.locator(".json-validation-section") + const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) + const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") -// await expect(openAPIJsonBtn).toBeDisabled() + await jsonValidationSection.click() + await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// await openAPIYamlBtn.click() + const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") + const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) + const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(openAPIYamlBtn).toBeDisabled() + await jsonSchemaValidationSection.click() + await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// await openAPIJsonBtn.click() + const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") + const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) + const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(openAPIJsonBtn).toBeDisabled() -// }) + await jsonSchemaDefaultsSection.click() + await expect(jsonSchemaDefaultsSectionTxt).toHaveText("A previous validation has failed or it is only available for Thing Descriptions") + await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle") -// test("Open the OpenAPI view and downloading it as JSON", async ({ page }) => { -// await page.locator("#examples-btn").click() + const jsonlsValidationSection = page.locator(".jsonls-validation-section") + const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) + const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + await jsonlsValidationSection.click() + await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const additionalChecksSection = page.locator(".additional-checks-section") + const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) + const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + await additionalChecksSection.click() + await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") + await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") + }) -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") +}) -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) +test.describe("OpenAPI view functionality", () => { + test("Trying to open the OpenAPI view with a TD with no protocols", async ({ page }) => { -// await openAPITab.click() + const initialTab = page.locator("#tab").nth(0) + await expect(initialTab).toHaveAttribute('data-tab-id', "1") + await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") + await expect(initialTab).toHaveClass("active") -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// const openAPIEditor = page.locator('#open-api-container') -// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') + await openAPITab.click() -// const openAPIJsonBtn = page.locator('#open-api-json') -// await expect(openAPIJsonBtn).toBeDisabled() + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses HTTP!") + }) -// // Start waiting for download before clicking. -// const openAPIDownload = page.locator('#open-api-download') -// const downloadPromise = page.waitForEvent('download') -// await openAPIDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'MyLampThing-OpenAPI.json' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + test("Trying to open the OpenAPI view with a TM", async ({ page }) => { -// test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { -// await page.locator("#examples-btn").click() + await page.locator("#examples-btn").click() -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// await openAPITab.click() + await openAPITab.click() -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") -// const openAPIEditor = page.locator('#open-api-container') + }) -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") + test("Open the OpenAPI view with the 'Basic TD' example", async ({ page }) => { + await page.locator("#examples-btn").click() -// const openAPIJsonBtn = page.locator('#open-api-json') -// const openAPIYamlBtn = page.locator('#open-api-yaml') + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// await expect(openAPIJsonBtn).toBeDisabled() + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await openAPIYamlBtn.click() + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(openAPIYamlBtn).toBeDisabled() + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: 3.0.3' }).nth(4) -// await expect(openAPIContainer).toHaveText('openapi: 3.0.3') + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// // Start waiting for download before clicking. -// const openAPIDownload = page.locator('#open-api-download') -// const downloadPromise = page.waitForEvent('download') -// await openAPIDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'MyLampThing-OpenAPI.yaml' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) -// }) + await openAPITab.click() -// test.describe("AsyncAPI view functionality", () => { -// test("Trying to open the AsyncAPI view with a TD with no protocols", async ({ page }) => { + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const initialTab = page.locator("#tab").nth(0) -// await expect(initialTab).toHaveAttribute('data-tab-id', "1") -// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(initialTab).toHaveClass("active") + const openAPIEditor = page.locator('#open-api-container') + const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") + await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) + const openAPIJsonBtn = page.locator('#open-api-json') -// await AsyncAPITab.click() + await expect(openAPIJsonBtn).toBeDisabled() -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses MQTT!") -// }) + }) -// test("Trying to open the AsyncAPI view with a TM", async ({ page }) => { + test("Open the OpenAPI view with the 'Basic TD' example as YAML", async ({ page }) => { -// await page.locator("#examples-btn").click() + await page.locator("#examples-btn").click() -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) + const jsonYamlPopup = page.locator('.json-yaml-warning') + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await AsyncAPITab.click() + const jsonBtn = page.locator('#file-type-json') + const yamlBtn = page.locator('#file-type-yaml') -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") + await expect(jsonBtn).toBeChecked({ checked: true }) + await expect(yamlBtn).toBeChecked({ checked: false }) -// }) + await yamlBtn.click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") -// /** -// * TODO: Do to a lack of examples that include the mqtt protocol this cannot be tested, nonetheless once -// * TODO: this is added the code below should sufice with minimal adjustments -// test("Open the AsyncAPI view with the '---' example", async ({ page }) => { -// await page.locator("#examples-btn").click() + await page.locator('#yaml-confirm-btn').click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(jsonBtn).toBeChecked({ checked: false }) + await expect(yamlBtn).toBeChecked({ checked: true }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TD---CloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + await openAPITab.click() -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) + const openAPIEditor = page.locator('#open-api-container') + const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: "3.0.3"' }).nth(4) -// await AsyncAPITab.click() + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(openAPIContainer).toHaveText('openapi: "3.0.3"') -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const openAPIYamlBtn = page.locator('#open-api-yaml') + await expect(openAPIYamlBtn).toBeDisabled() -// const AsyncAPIEditor = page.locator('#async-api-container') -// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: '"asyncapi": "2.0.0",' }).nth(4) + }) -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(AsyncAPIContainer).toHaveText('"asyncapi": "2.0.0",') + test("Open the OpenAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { + await page.locator("#examples-btn").click() -// const AsyncAPIJsonBtn = page.locator('#async-api-json') + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// await expect(AsyncAPIJsonBtn).toBeDisabled() + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// }) + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// test("Open the AsyncAPI view with the '---' example as YAML", async ({ page }) => { + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// await page.locator("#examples-btn").click() + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + await openAPITab.click() -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TD---CloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + const openAPIEditor = page.locator('#open-api-container') + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") -// const jsonYamlPopup = page.locator('.json-yaml-warning') -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + const openAPIJsonBtn = page.locator('#open-api-json') + const openAPIYamlBtn = page.locator('#open-api-yaml') -// const jsonBtn = page.locator('#file-type-json') -// const yamlBtn = page.locator('#file-type-yaml') + await expect(openAPIJsonBtn).toBeDisabled() -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) + await openAPIYamlBtn.click() -// await yamlBtn.click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(openAPIYamlBtn).toBeDisabled() -// await page.locator('#yaml-confirm-btn').click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(jsonBtn).toBeChecked({ checked: false }) -// await expect(yamlBtn).toBeChecked({ checked: true }) + await openAPIJsonBtn.click() -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") + await expect(openAPIJsonBtn).toBeDisabled() + }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) + test("Open the OpenAPI view and downloading it as JSON", async ({ page }) => { + await page.locator("#examples-btn").click() -// await AsyncAPITab.click() + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const AsyncAPIEditor = page.locator('#async-api-container') -// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: 'asyncapi: 2.0.0' }).nth(4) + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(AsyncAPIContainer).toHaveText('asyncapi: 2.0.0') + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// const AsyncAPIYamlBtn = page.locator('#async-api-yaml') -// await expect(AsyncAPIYamlBtn).toBeDisabled() + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// }) + await openAPITab.click() -// test("Open the AsyncAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { -// await page.locator("#examples-btn").click() + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const openAPIEditor = page.locator('#open-api-container') + const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TD---CloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") + await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + const openAPIJsonBtn = page.locator('#open-api-json') + await expect(openAPIJsonBtn).toBeDisabled() -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") + // Start waiting for download before clicking. + const openAPIDownload = page.locator('#open-api-download') + const downloadPromise = page.waitForEvent('download') + await openAPIDownload.click() + const download = await downloadPromise + const expectedFilename = 'MyLampThing-OpenAPI.json' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) + test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { + await page.locator("#examples-btn").click() -// await AsyncAPITab.click() + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const AsyncAPIEditor = page.locator('#async-api-container') + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// const AsyncAPIJsonBtn = page.locator('#async-api-json') -// const AsyncAPIYamlBtn = page.locator('#async-api-yaml') + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// await expect(AsyncAPIJsonBtn).toBeDisabled() + await openAPITab.click() -// await AsyncAPIYamlBtn.click() + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(AsyncAPIYamlBtn).toBeDisabled() + const openAPIEditor = page.locator('#open-api-container') -// await AsyncAPIJsonBtn.click() + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(AsyncAPIJsonBtn).toBeDisabled() -// }) + const openAPIJsonBtn = page.locator('#open-api-json') + const openAPIYamlBtn = page.locator('#open-api-yaml') -// test("Open the AsyncAPI view and downloading it as JSON", async ({ page }) => { -// await page.locator("#examples-btn").click() + await expect(openAPIJsonBtn).toBeDisabled() -// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + await openAPIYamlBtn.click() -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TD---CloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(openAPIYamlBtn).toBeDisabled() -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: 3.0.3' }).nth(4) + await expect(openAPIContainer).toHaveText('openapi: 3.0.3') -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") + // Start waiting for download before clicking. + const openAPIDownload = page.locator('#open-api-download') + const downloadPromise = page.waitForEvent('download') + await openAPIDownload.click() + const download = await downloadPromise + const expectedFilename = 'MyLampThing-OpenAPI.yaml' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) +}) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) +test.describe("AsyncAPI view functionality", () => { + test("Trying to open the AsyncAPI view with a TD with no protocols", async ({ page }) => { -// await AsyncAPITab.click() + const initialTab = page.locator("#tab").nth(0) + await expect(initialTab).toHaveAttribute('data-tab-id', "1") + await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") + await expect(initialTab).toHaveClass("active") -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const AsyncAPIView = page.locator('#async-api-view') + const consoleError = page.locator('#console-error') + const AsyncAPITab = page.locator("#async-api-tab") -// const AsyncAPIEditor = page.locator('#async-api-container') -// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: '"asyncapi": "2.0.0",' }).nth(4) + await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(AsyncAPITab).toBeChecked({ checked: false }) -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(AsyncAPIContainer).toHaveText('\"asyncapi\": \"2.0.0\",') + await AsyncAPITab.click() -// const AsyncAPIJsonBtn = page.locator('#async-api-json') -// await expect(AsyncAPIJsonBtn).toBeDisabled() + await expect(AsyncAPITab).toBeChecked({ checked: true }) + await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") + await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses MQTT!") + }) -// // Start waiting for download before clicking. -// const AsyncAPIDownload = page.locator('#async-api-download') -// const downloadPromise = page.waitForEvent('download') -// await AsyncAPIDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'MyLampThing-AsyncAPI.json' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + test("Trying to open the AsyncAPI view with a TM", async ({ page }) => { -// test("Open the AsyncAPI view and downloading it as YAML", async ({ page }) => { -// await page.locator("#examples-btn").click() + await page.locator("#examples-btn").click() -// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TD---CloseCancel") -// await expect(exampleTab).toHaveClass("active") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") + const AsyncAPIView = page.locator('#async-api-view') + const consoleError = page.locator('#console-error') + const AsyncAPITab = page.locator("#async-api-tab") -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) + await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(AsyncAPITab).toBeChecked({ checked: false }) -// await AsyncAPITab.click() + await AsyncAPITab.click() -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(AsyncAPITab).toBeChecked({ checked: true }) + await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") + await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") -// const AsyncAPIEditor = page.locator('#async-api-container') + }) +}) -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") -// const AsyncAPIJsonBtn = page.locator('#async-api-json') -// const AsyncAPIYamlBtn = page.locator('#async-api-yaml') +test.describe("AAS AID view functionality", () => { -// await expect(AsyncAPIJsonBtn).toBeDisabled() + test("Trying to open the AAS view with a TM", async ({ page }) => { -// await AsyncAPIYamlBtn.click() + await page.locator("#examples-btn").click() -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(AsyncAPIYamlBtn).toBeDisabled() + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: 'asyncapi: 2.0.0' }).nth(4) -// await expect(AsyncAPIContainer).toHaveText('asyncapi: 2.0.0') + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// // Start waiting for download before clicking. -// const AsyncAPIDownload = page.locator('#async-api-download') -// const downloadPromise = page.waitForEvent('download') -// await AsyncAPIDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'MyLampThing-AsyncAPI.yaml' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) -// */ -// }) + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") + await expect(exampleTab).toHaveClass("active") + const AASView = page.locator('#aas-view') + const consoleError = page.locator('#console-error') + const AASTab = page.locator("#aas-tab") -// test.describe("AAS AID view functionality", () => { + await expect(AASView).toHaveClass("console-view aas-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(AASTab).toBeChecked({ checked: false }) -// test("Trying to open the AAS view with a TM", async ({ page }) => { + await AASTab.click() -// await page.locator("#examples-btn").click() + await expect(AASTab).toBeChecked({ checked: true }) + await expect(AASView).toHaveClass("console-view aas-view hidden") + await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + test("Open the AAS AID view with the 'Basic TD' example", async ({ page }) => { + await page.locator("#examples-btn").click() -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// const AASView = page.locator('#aas-view') -// const consoleError = page.locator('#console-error') -// const AASTab = page.locator("#aas-tab") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await expect(AASView).toHaveClass("console-view aas-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AASTab).toBeChecked({ checked: false }) + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// await AASTab.click() + const AASView = page.locator('#aas-view') + const consoleError = page.locator('#console-error') + const AASTab = page.locator("#aas-tab") -// await expect(AASTab).toBeChecked({ checked: true }) -// await expect(AASView).toHaveClass("console-view aas-view hidden") -// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") + await expect(AASView).toHaveClass("console-view aas-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(AASTab).toBeChecked({ checked: false }) -// }) + await AASTab.click() -// test("Open the AAS AID view with the 'Basic TD' example", async ({ page }) => { -// await page.locator("#examples-btn").click() + await expect(AASTab).toBeChecked({ checked: true }) + await expect(AASView).toHaveClass("console-view aas-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const ASSEditor = page.locator('#aas-container') + const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") + await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + }) -// const AASView = page.locator('#aas-view') -// const consoleError = page.locator('#console-error') -// const AASTab = page.locator("#aas-tab") + test("Open the AAS AID view with the 'Basic TD' example and downloading it", async ({ page }) => { + await page.locator("#examples-btn").click() -// await expect(AASView).toHaveClass("console-view aas-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AASTab).toBeChecked({ checked: false }) + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// await AASTab.click() + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await expect(AASTab).toBeChecked({ checked: true }) -// await expect(AASView).toHaveClass("console-view aas-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// const ASSEditor = page.locator('#aas-container') -// const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) + const AASView = page.locator('#aas-view') + const consoleError = page.locator('#console-error') + const AASTab = page.locator("#aas-tab") -// await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") -// await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') + await expect(AASView).toHaveClass("console-view aas-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(AASTab).toBeChecked({ checked: false }) -// }) + await AASTab.click() -// test("Open the AAS AID view with the 'Basic TD' example and downloading it", async ({ page }) => { -// await page.locator("#examples-btn").click() + await expect(AASTab).toBeChecked({ checked: true }) + await expect(AASView).toHaveClass("console-view aas-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const ASSEditor = page.locator('#aas-container') + const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") + await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + // Start waiting for download before clicking. + const AASDownload = page.locator('#aas-download') + const downloadPromise = page.waitForEvent('download') + await AASDownload.click() + const download = await downloadPromise + const expectedFilename = 'MyLampThing-AAS.json' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) +}) -// const AASView = page.locator('#aas-view') -// const consoleError = page.locator('#console-error') -// const AASTab = page.locator("#aas-tab") +test.describe("Defaults view functionality", () => { + test("Opening the Defaults view with the Thing Template", async ({ page }) => { -// await expect(AASView).toHaveClass("console-view aas-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AASTab).toBeChecked({ checked: false }) + const initialTab = page.locator("#tab").nth(0) + await expect(initialTab).toHaveAttribute('data-tab-id', "1") + await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") + await expect(initialTab).toHaveClass("active") -// await AASTab.click() + const DefaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const DefaultsTab = page.locator("#defaults-tab") -// await expect(AASTab).toBeChecked({ checked: true }) -// await expect(AASView).toHaveClass("console-view aas-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(DefaultsTab).toBeChecked({ checked: false }) -// const ASSEditor = page.locator('#aas-container') -// const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) + await DefaultsTab.click() -// await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") -// await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') + await expect(DefaultsTab).toBeChecked({ checked: true }) + await expect(DefaultsView).toHaveClass("console-view defaults-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// // Start waiting for download before clicking. -// const AASDownload = page.locator('#aas-download') -// const downloadPromise = page.waitForEvent('download') -// await AASDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'MyLampThing-AAS.json' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) -// }) + const defaultsEditor = page.locator('#defaults-container') + const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: '"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",' }).nth(4) -// test.describe("Defaults view functionality", () => { -// test("Opening the Defaults view with the Thing Template", async ({ page }) => { + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") + await expect(defaultsContainer).toHaveText('"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",') -// const initialTab = page.locator("#tab").nth(0) -// await expect(initialTab).toHaveAttribute('data-tab-id', "1") -// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(initialTab).toHaveClass("active") + const defaultsJsonBtn = page.locator('#defaults-json') + const defaultsAddBtn = page.locator('#defaults-add') -// const DefaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const DefaultsTab = page.locator("#defaults-tab") + await expect(defaultsJsonBtn).toBeDisabled() + await expect(defaultsAddBtn).toBeDisabled() + }) -// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(DefaultsTab).toBeChecked({ checked: false }) + test("Trying to open the Defaults view with a TM", async ({ page }) => { -// await DefaultsTab.click() + await page.locator("#examples-btn").click() -// await expect(DefaultsTab).toBeChecked({ checked: true }) -// await expect(DefaultsView).toHaveClass("console-view defaults-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const defaultsEditor = page.locator('#defaults-container') -// const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: '"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",' }).nth(4) + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") -// await expect(defaultsContainer).toHaveText('"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",') + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const defaultsJsonBtn = page.locator('#defaults-json') -// const defaultsAddBtn = page.locator('#defaults-add') + const DefaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const DefaultsTab = page.locator("#defaults-tab") -// await expect(defaultsJsonBtn).toBeDisabled() -// await expect(defaultsAddBtn).toBeDisabled() -// }) + await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(DefaultsTab).toBeChecked({ checked: false }) -// test("Trying to open the Defaults view with a TM", async ({ page }) => { + await DefaultsTab.click() -// await page.locator("#examples-btn").click() + await expect(DefaultsTab).toBeChecked({ checked: true }) + await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") + await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + test("Open the Defaults view as YAML", async ({ page }) => { -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const templateEditor = page.locator("#editor1") + await expect(templateEditor).toHaveAttribute('data-ide-id', "1") + await expect(templateEditor).toHaveAttribute('data-mode-id', "json") + await expect(templateEditor).toHaveClass("editor active") -// const DefaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const DefaultsTab = page.locator("#defaults-tab") + const jsonYamlPopup = page.locator('.json-yaml-warning') + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(DefaultsTab).toBeChecked({ checked: false }) + const jsonBtn = page.locator('#file-type-json') + const yamlBtn = page.locator('#file-type-yaml') -// await DefaultsTab.click() + await expect(jsonBtn).toBeChecked({ checked: true }) + await expect(yamlBtn).toBeChecked({ checked: false }) -// await expect(DefaultsTab).toBeChecked({ checked: true }) -// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") + await yamlBtn.click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") -// }) + await page.locator('#yaml-confirm-btn').click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + await expect(templateEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(jsonBtn).toBeChecked({ checked: false }) + await expect(yamlBtn).toBeChecked({ checked: true }) -// test("Open the Defaults view as YAML", async ({ page }) => { + const defaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const defaultsTab = page.locator("#defaults-tab") -// const templateEditor = page.locator("#editor1") -// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") -// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") -// await expect(templateEditor).toHaveClass("editor active") + await expect(defaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(defaultsTab).toBeChecked({ checked: false }) -// const jsonYamlPopup = page.locator('.json-yaml-warning') -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + await defaultsTab.click() -// const jsonBtn = page.locator('#file-type-json') -// const yamlBtn = page.locator('#file-type-yaml') + await expect(defaultsTab).toBeChecked({ checked: true }) + await expect(defaultsView).toHaveClass("console-view defaults-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) + const defaultsEditor = page.locator('#defaults-container') + const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: 'description: >-' }).nth(4) + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(defaultsContainer).toHaveText('description: >-') -// await yamlBtn.click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") + const defaultsYamlBtn = page.locator('#defaults-yaml') + await expect(defaultsYamlBtn).toBeDisabled() + }) -// await page.locator('#yaml-confirm-btn').click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(templateEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(jsonBtn).toBeChecked({ checked: false }) -// await expect(yamlBtn).toBeChecked({ checked: true }) + test("Open the Defaults view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { + const templateEditor = page.locator("#editor1") + await expect(templateEditor).toHaveAttribute('data-ide-id', "1") + await expect(templateEditor).toHaveAttribute('data-mode-id', "json") + await expect(templateEditor).toHaveClass("editor active") -// const defaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const defaultsTab = page.locator("#defaults-tab") + const defaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const defaultsTab = page.locator("#defaults-tab") -// await expect(defaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(defaultsTab).toBeChecked({ checked: false }) + await expect(defaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(defaultsTab).toBeChecked({ checked: false }) -// await defaultsTab.click() + await defaultsTab.click() -// await expect(defaultsTab).toBeChecked({ checked: true }) -// await expect(defaultsView).toHaveClass("console-view defaults-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(defaultsTab).toBeChecked({ checked: true }) + await expect(defaultsView).toHaveClass("console-view defaults-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const defaultsEditor = page.locator('#defaults-container') -// const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: 'description: >-' }).nth(4) -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(defaultsContainer).toHaveText('description: >-') + const defaultsEditor = page.locator('#defaults-container') -// const defaultsYamlBtn = page.locator('#defaults-yaml') -// await expect(defaultsYamlBtn).toBeDisabled() -// }) + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") -// test("Open the Defaults view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { -// const templateEditor = page.locator("#editor1") -// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") -// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") -// await expect(templateEditor).toHaveClass("editor active") + const defaultsJsonBtn = page.locator('#defaults-json') + const defaultsYamlBtn = page.locator('#defaults-yaml') -// const defaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const defaultsTab = page.locator("#defaults-tab") + await expect(defaultsJsonBtn).toBeDisabled() -// await expect(defaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(defaultsTab).toBeChecked({ checked: false }) + await defaultsYamlBtn.click() -// await defaultsTab.click() + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(defaultsYamlBtn).toBeDisabled() -// await expect(defaultsTab).toBeChecked({ checked: true }) -// await expect(defaultsView).toHaveClass("console-view defaults-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await defaultsJsonBtn.click() -// const defaultsEditor = page.locator('#defaults-container') + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") + await expect(defaultsJsonBtn).toBeDisabled() + }) -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") + test("Open the Defaults view and removing and adding default values", async ({ page }) => { -// const defaultsJsonBtn = page.locator('#defaults-json') -// const defaultsYamlBtn = page.locator('#defaults-yaml') + const templateEditor = page.locator("#editor1") + await expect(templateEditor).toHaveAttribute('data-ide-id', "1") + await expect(templateEditor).toHaveClass("editor active") -// await expect(defaultsJsonBtn).toBeDisabled() + const defaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const defaultsTab = page.locator("#defaults-tab") -// await defaultsYamlBtn.click() + await expect(defaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(defaultsTab).toBeChecked({ checked: false }) -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(defaultsYamlBtn).toBeDisabled() + await defaultsTab.click() -// await defaultsJsonBtn.click() + await expect(defaultsTab).toBeChecked({ checked: true }) + await expect(defaultsView).toHaveClass("console-view defaults-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") -// await expect(defaultsJsonBtn).toBeDisabled() -// }) + const defaultsAddBtn = page.locator('#defaults-add') + const defaultsRemoveBtn = page.locator('#defaults-remove') -// test("Open the Defaults view and removing and adding default values", async ({ page }) => { + await expect(defaultsAddBtn).toBeDisabled() -// const templateEditor = page.locator("#editor1") -// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") -// await expect(templateEditor).toHaveClass("editor active") + await defaultsRemoveBtn.click() + await expect(defaultsRemoveBtn).toBeDisabled() -// const defaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const defaultsTab = page.locator("#defaults-tab") + await defaultsAddBtn.click() + await expect(defaultsAddBtn).toBeDisabled() + }) -// await expect(defaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(defaultsTab).toBeChecked({ checked: false }) + test("Open the Defaults view and downloading it as JSON with defaults", async ({ page }) => { -// await defaultsTab.click() + const templateEditor = page.locator("#editor1") + await expect(templateEditor).toHaveAttribute('data-ide-id', "1") + await expect(templateEditor).toHaveAttribute('data-mode-id', "json") + await expect(templateEditor).toHaveClass("editor active") -// await expect(defaultsTab).toBeChecked({ checked: true }) -// await expect(defaultsView).toHaveClass("console-view defaults-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const DefaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const DefaultsTab = page.locator("#defaults-tab") -// const defaultsAddBtn = page.locator('#defaults-add') -// const defaultsRemoveBtn = page.locator('#defaults-remove') + await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(DefaultsTab).toBeChecked({ checked: false }) -// await expect(defaultsAddBtn).toBeDisabled() + await DefaultsTab.click() -// await defaultsRemoveBtn.click() -// await expect(defaultsRemoveBtn).toBeDisabled() + await expect(DefaultsTab).toBeChecked({ checked: true }) + await expect(DefaultsView).toHaveClass("console-view defaults-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// await defaultsAddBtn.click() -// await expect(defaultsAddBtn).toBeDisabled() -// }) + const defaultsEditor = page.locator('#defaults-container') + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") -// test("Open the Defaults view and downloading it as JSON with defaults", async ({ page }) => { + const DefaultsJsonBtn = page.locator('#defaults-json') + await expect(DefaultsJsonBtn).toBeDisabled() -// const templateEditor = page.locator("#editor1") -// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") -// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") -// await expect(templateEditor).toHaveClass("editor active") + // Start waiting for download before clicking. + const DefaultsDownload = page.locator('#defaults-download') + const downloadPromise = page.waitForEvent('download') + await DefaultsDownload.click() + const download = await downloadPromise + const expectedFilename = 'Thing-Template-with-Defaults.json' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) -// const DefaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const DefaultsTab = page.locator("#defaults-tab") + test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { + const templateEditor = page.locator("#editor1") + await expect(templateEditor).toHaveAttribute('data-ide-id', "1") + await expect(templateEditor).toHaveAttribute('data-mode-id', "json") + await expect(templateEditor).toHaveClass("editor active") -// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(DefaultsTab).toBeChecked({ checked: false }) + const DefaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const DefaultsTab = page.locator("#defaults-tab") -// await DefaultsTab.click() + await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(DefaultsTab).toBeChecked({ checked: false }) -// await expect(DefaultsTab).toBeChecked({ checked: true }) -// await expect(DefaultsView).toHaveClass("console-view defaults-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await DefaultsTab.click() -// const defaultsEditor = page.locator('#defaults-container') -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") + await expect(DefaultsTab).toBeChecked({ checked: true }) + await expect(DefaultsView).toHaveClass("console-view defaults-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const DefaultsJsonBtn = page.locator('#defaults-json') -// await expect(DefaultsJsonBtn).toBeDisabled() + const defaultsEditor = page.locator('#defaults-container') + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") -// // Start waiting for download before clicking. -// const DefaultsDownload = page.locator('#defaults-download') -// const downloadPromise = page.waitForEvent('download') -// await DefaultsDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'Thing-Template-with-Defaults.json' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + const defaultsJsonBtn = page.locator('#defaults-json') + const defaultsYamlBtn = page.locator('#defaults-yaml') -// test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { -// const templateEditor = page.locator("#editor1") -// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") -// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") -// await expect(templateEditor).toHaveClass("editor active") + await expect(defaultsJsonBtn).toBeDisabled() -// const DefaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const DefaultsTab = page.locator("#defaults-tab") + await defaultsYamlBtn.click() -// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(DefaultsTab).toBeChecked({ checked: false }) + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(defaultsYamlBtn).toBeDisabled() -// await DefaultsTab.click() + const defaultsAddBtn = page.locator('#defaults-add') + const defaultsRemoveBtn = page.locator('#defaults-remove') -// await expect(DefaultsTab).toBeChecked({ checked: true }) -// await expect(DefaultsView).toHaveClass("console-view defaults-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(defaultsAddBtn).toBeDisabled() -// const defaultsEditor = page.locator('#defaults-container') -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") + await defaultsRemoveBtn.click() + await expect(defaultsRemoveBtn).toBeDisabled() -// const defaultsJsonBtn = page.locator('#defaults-json') -// const defaultsYamlBtn = page.locator('#defaults-yaml') + // Start waiting for download before clicking. + const defaultsDownload = page.locator('#defaults-download') + const downloadPromise = page.waitForEvent('download') + await defaultsDownload.click() + const download = await downloadPromise + const expectedFilename = 'Thing-Template-without-Defaults.yaml' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) +}) -// await expect(defaultsJsonBtn).toBeDisabled() +test.describe("Visualization view functionality", () => { -// await defaultsYamlBtn.click() + test("Open the visualization view with the thing template", async ({ page }) => { -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(defaultsYamlBtn).toBeDisabled() + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// const defaultsAddBtn = page.locator('#defaults-add') -// const defaultsRemoveBtn = page.locator('#defaults-remove') + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// await expect(defaultsAddBtn).toBeDisabled() + await visualizeTab.click() -// await defaultsRemoveBtn.click() -// await expect(defaultsRemoveBtn).toBeDisabled() + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// // Start waiting for download before clicking. -// const defaultsDownload = page.locator('#defaults-download') -// const downloadPromise = page.waitForEvent('download') -// await defaultsDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'Thing-Template-without-Defaults.yaml' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) -// }) + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') -// test.describe("Visualization view functionality", () => { + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the visualization view with the thing template", async ({ page }) => { + const graphVisTitle = page.locator('#visualized').getByText('Thing Template', { exact: true }) + await expect(graphVisTitle).toHaveText("Thing Template") + }) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") + test("Open the visualization view with the thing template and expand and collapse the graph view", async ({ page }) => { -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// await visualizeTab.click() + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") + await visualizeTab.click() -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') + const collapseAllBtn = page.locator('#collapse-all') + const expandAllBtn = page.locator('#expand-all') -// const graphVisTitle = page.locator('#visualized').getByText('Thing Template', { exact: true }) -// await expect(graphVisTitle).toHaveText("Thing Template") -// }) + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the visualization view with the thing template and expand and collapse the graph view", async ({ page }) => { + const svgPaths = page.locator("svg > g > path") + await expect(svgPaths).toHaveCount(9) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") + await expandAllBtn.click() + await expect(expandAllBtn).toBeDisabled() -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) + await expect(svgPaths).toHaveCount(12) -// await visualizeTab.click() + await collapseAllBtn.click() + await expect(collapseAllBtn).toBeDisabled() -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") + await expect(svgPaths).toHaveCount(0) + }) -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') -// const collapseAllBtn = page.locator('#collapse-all') -// const expandAllBtn = page.locator('#expand-all') + test("Open the visualization view with the thing template download the graph view as SVG", async ({ page }) => { -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// const svgPaths = page.locator("svg > g > path") -// await expect(svgPaths).toHaveCount(9) + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// await expandAllBtn.click() -// await expect(expandAllBtn).toBeDisabled() + await visualizeTab.click() -// await expect(svgPaths).toHaveCount(12) + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// await collapseAllBtn.click() -// await expect(collapseAllBtn).toBeDisabled() + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') -// await expect(svgPaths).toHaveCount(0) -// }) + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the visualization view with the thing template download the graph view as SVG", async ({ page }) => { + // Start waiting for download before clicking. + const svgDownload = page.locator('#download-svg') + const downloadPromise = page.waitForEvent('download') + await svgDownload.click() + const download = await downloadPromise + const expectedFilename = 'Graph-visualization.svg' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") + test("Open the visualization view with the thing template and download the graph view as PNG", async ({ page }) => { -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// await visualizeTab.click() + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") + await visualizeTab.click() -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') -// // Start waiting for download before clicking. -// const svgDownload = page.locator('#download-svg') -// const downloadPromise = page.waitForEvent('download') -// await svgDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'Graph-visualization.svg' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the visualization view with the thing template and download the graph view as PNG", async ({ page }) => { + // Start waiting for download before clicking. + const pngDownload = page.locator('#download-png') + const downloadPromise = page.waitForEvent('download') + await pngDownload.click() + const download = await downloadPromise + const expectedFilename = 'Graph-visualization.png' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") + test("Open the tree visualization view with the thing template and modified the input values", async ({ page }) => { -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// await visualizeTab.click() + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") + await visualizeTab.click() -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') -// // Start waiting for download before clicking. -// const pngDownload = page.locator('#download-png') -// const downloadPromise = page.waitForEvent('download') -// await pngDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'Graph-visualization.png' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the tree visualization view with the thing template and modified the input values", async ({ page }) => { + await treeViewBtn.click() + await expect(graphViewBtn).toBeChecked({ checked: false }) + await expect(treeViewBtn).toBeChecked({ checked: true }) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") + const labelBtn = page.getByLabel('labels') + const radiusSlider = page.getByLabel('radius') + const extentSlider = page.getByLabel('extent') + const rotateSlider = page.getByLabel('rotate') + const dragSlider = page.getByLabel('drag precision') + const tidyBtn = page.getByLabel('tidy') + const clusterBtn = page.getByLabel('cluster') + const linksDropDown = page.getByLabel('links') -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) + await expect(labelBtn).toBeChecked({ checked: true }) + await expect(radiusSlider).toHaveValue("350") + await expect(extentSlider).toHaveValue("360") + await expect(rotateSlider).toHaveValue("0") + await expect(dragSlider).toHaveValue("100") + await expect(tidyBtn).toBeChecked({ checked: true }) + await expect(clusterBtn).toBeChecked({ checked: false }) + await expect(linksDropDown).toHaveValue("line") -// await visualizeTab.click() + await labelBtn.click() + await radiusSlider.click() + await extentSlider.click() + await rotateSlider.click() + await dragSlider.click() + await clusterBtn.check() + await linksDropDown.selectOption("diagonal") + await expect(labelBtn).toBeChecked({ checked: false }) -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") + const radiusSliderValue = await radiusSlider.inputValue() + expect(parseInt(radiusSliderValue)).toBeLessThan(450) + expect(parseInt(radiusSliderValue)).toBeGreaterThan(330) -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') + const extentSliderValue = await extentSlider.inputValue() + expect(parseInt(extentSliderValue)).toBeLessThan(190) + expect(parseInt(extentSliderValue)).toBeGreaterThan(170) -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) + const rotateSliderValue = await rotateSlider.inputValue() + expect(parseInt(rotateSliderValue)).toBeLessThan(190) + expect(parseInt(rotateSliderValue)).toBeGreaterThan(170) -// await treeViewBtn.click() -// await expect(graphViewBtn).toBeChecked({ checked: false }) -// await expect(treeViewBtn).toBeChecked({ checked: true }) + const dragSliderValue = await dragSlider.inputValue() + expect(parseInt(dragSliderValue)).toBeLessThan(60) + expect(parseInt(dragSliderValue)).toBeGreaterThan(40) -// const labelBtn = page.getByLabel('labels') -// const radiusSlider = page.getByLabel('radius') -// const extentSlider = page.getByLabel('extent') -// const rotateSlider = page.getByLabel('rotate') -// const dragSlider = page.getByLabel('drag precision') -// const tidyBtn = page.getByLabel('tidy') -// const clusterBtn = page.getByLabel('cluster') -// const linksDropDown = page.getByLabel('links') + await expect(tidyBtn).toBeChecked({ checked: false }) + await expect(clusterBtn).toBeChecked({ checked: true }) + await expect(linksDropDown).toHaveValue("diagonal") -// await expect(labelBtn).toBeChecked({ checked: true }) -// await expect(radiusSlider).toHaveValue("350") -// await expect(extentSlider).toHaveValue("360") -// await expect(rotateSlider).toHaveValue("0") -// await expect(dragSlider).toHaveValue("100") -// await expect(tidyBtn).toBeChecked({ checked: true }) -// await expect(clusterBtn).toBeChecked({ checked: false }) -// await expect(linksDropDown).toHaveValue("line") + }) -// await labelBtn.click() -// await radiusSlider.click() -// await extentSlider.click() -// await rotateSlider.click() -// await dragSlider.click() -// await clusterBtn.check() -// await linksDropDown.selectOption("diagonal") -// await expect(labelBtn).toBeChecked({ checked: false }) + test("Open the tree visualization view with the thing template and download as SVG", async ({ page }) => { -// const radiusSliderValue = await radiusSlider.inputValue() -// expect(parseInt(radiusSliderValue)).toBeLessThan(450) -// expect(parseInt(radiusSliderValue)).toBeGreaterThan(330) + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// const extentSliderValue = await extentSlider.inputValue() -// expect(parseInt(extentSliderValue)).toBeLessThan(190) -// expect(parseInt(extentSliderValue)).toBeGreaterThan(170) + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// const rotateSliderValue = await rotateSlider.inputValue() -// expect(parseInt(rotateSliderValue)).toBeLessThan(190) -// expect(parseInt(rotateSliderValue)).toBeGreaterThan(170) + await visualizeTab.click() -// const dragSliderValue = await dragSlider.inputValue() -// expect(parseInt(dragSliderValue)).toBeLessThan(60) -// expect(parseInt(dragSliderValue)).toBeGreaterThan(40) + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// await expect(tidyBtn).toBeChecked({ checked: false }) -// await expect(clusterBtn).toBeChecked({ checked: true }) -// await expect(linksDropDown).toHaveValue("diagonal") + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') -// }) + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the tree visualization view with the thing template and download as SVG", async ({ page }) => { + await treeViewBtn.click() + await expect(graphViewBtn).toBeChecked({ checked: false }) + await expect(treeViewBtn).toBeChecked({ checked: true }) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") + // Start waiting for download before clicking. + const svgDownload = page.locator('#download-svg') + const downloadPromise = page.waitForEvent('download') + await svgDownload.click() + const download = await downloadPromise + const expectedFilename = 'Tree-visualization.svg' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) + test("Open the tree visualization view with the thing template and download as PNG", async ({ page }) => { -// await visualizeTab.click() + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') + await visualizeTab.click() -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// await treeViewBtn.click() -// await expect(graphViewBtn).toBeChecked({ checked: false }) -// await expect(treeViewBtn).toBeChecked({ checked: true }) + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') -// // Start waiting for download before clicking. -// const svgDownload = page.locator('#download-svg') -// const downloadPromise = page.waitForEvent('download') -// await svgDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'Tree-visualization.svg' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the tree visualization view with the thing template and download as PNG", async ({ page }) => { + await treeViewBtn.click() + await expect(graphViewBtn).toBeChecked({ checked: false }) + await expect(treeViewBtn).toBeChecked({ checked: true }) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") - -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) - -// await visualizeTab.click() - -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") - -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') - -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) - -// await treeViewBtn.click() -// await expect(graphViewBtn).toBeChecked({ checked: false }) -// await expect(treeViewBtn).toBeChecked({ checked: true }) - -// // Start waiting for download before clicking. -// const pngDownload = page.locator('#download-png') -// const downloadPromise = page.waitForEvent('download') -// await pngDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'Tree-visualization.png' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) -// }) + // Start waiting for download before clicking. + const pngDownload = page.locator('#download-png') + const downloadPromise = page.waitForEvent('download') + await pngDownload.click() + const download = await downloadPromise + const expectedFilename = 'Tree-visualization.png' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) +}) From e1fafca945ff0279158598bf545be41f7a3c84c0 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Wed, 7 Feb 2024 20:07:32 +0100 Subject: [PATCH 38/68] increasing timeout and testing only for chromium --- .github/workflows/visual-ci-new.yaml | 2 +- packages/web-new/package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index aa0c0a48b..9c229d9f7 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -28,7 +28,7 @@ jobs: run: lerna bootstrap --no-ci - name: Visual Tests - timeout-minutes: 18 + timeout-minutes: 30 run: | cd ./packages/web-new npm install diff --git a/packages/web-new/package.json b/packages/web-new/package.json index a40af23af..ad1e10648 100644 --- a/packages/web-new/package.json +++ b/packages/web-new/package.json @@ -19,7 +19,7 @@ "dev": "webpack serve --mode development", "serve": "node server/server.js", "examples": "node external-scripts/generate-paths.js", - "test": "npx playwright test --project=chromium --project=firefox", + "test": "npx playwright test --project=chromium", "test-full": "npx playwright test" }, "devDependencies": { From 91039b044e9b6c238ab795954f6d0d5a6cc2d547 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Sat, 14 Oct 2023 01:07:09 +0200 Subject: [PATCH 39/68] Added new workflow for the new web package --- .github/workflows/visual-ci-new.yaml | 34 ++++++++++++++++++++++++++++ 1 file changed, 34 insertions(+) create mode 100644 .github/workflows/visual-ci-new.yaml diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml new file mode 100644 index 000000000..a09d42583 --- /dev/null +++ b/.github/workflows/visual-ci-new.yaml @@ -0,0 +1,34 @@ +name: Visual Testing Pipeline + +on: + pull_request: + paths-ignore: + - "**.md" + - "**.png" + - "**.drawio" + - "**.xlsx" + +jobs: + setup-and-visual-test: + runs-on: ubuntu-latest + + steps: + - name: Checkout + uses: actions/checkout@v2 + + - name: Use Node.js 16 + uses: actions/setup-node@v1 + with: + node-version: "16.x" + + - name: Use lerna + run: npm install -g lerna@6.6.2 + + - name: Bootstrap + run: lerna bootstrap --no-ci + + - name: Visual Test + run: | + cd ./packages/web-new + npm install + npm run test \ No newline at end of file From ea416f891c10c0b9ff6f193e8ee77f0a72c0ddc8 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Sat, 14 Oct 2023 01:19:13 +0200 Subject: [PATCH 40/68] Installing supported browsers --- .github/workflows/visual-ci-new.yaml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index a09d42583..aa54c43bb 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -27,8 +27,9 @@ jobs: - name: Bootstrap run: lerna bootstrap --no-ci - - name: Visual Test + - name: New Web Visual Test run: | cd ./packages/web-new npm install + npx playwright install npm run test \ No newline at end of file From 82537813b89c331c38c04fa642958162c32b250c Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Mon, 20 Nov 2023 05:46:55 +0100 Subject: [PATCH 41/68] Updating to the newer version --- .github/workflows/visual-ci-new.yaml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index aa54c43bb..625736bf6 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -14,10 +14,10 @@ jobs: steps: - name: Checkout - uses: actions/checkout@v2 + uses: actions/checkout@v3 - name: Use Node.js 16 - uses: actions/setup-node@v1 + uses: actions/setup-node@v3 with: node-version: "16.x" From c120ef28117d8f5df0e01cc43186fa6cfbac195d Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Thu, 21 Dec 2023 11:34:18 +0100 Subject: [PATCH 42/68] Increased the timeout limit By utilizing the information about the duration of the new tests (which should be around 15 - 16 minutes in optimal conditions), the new timeout limit has been increased to 18 minutes to account for the duration of the tests as well as a small extra leeway to account for any other possible delays --- .github/workflows/visual-ci-new.yaml | 1 + 1 file changed, 1 insertion(+) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 625736bf6..14f03bc94 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -28,6 +28,7 @@ jobs: run: lerna bootstrap --no-ci - name: New Web Visual Test + timeout-minutes: 18 run: | cd ./packages/web-new npm install From c76474f224026809a4c37a6453dc35d140d765bf Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Thu, 21 Dec 2023 11:35:31 +0100 Subject: [PATCH 43/68] . --- .github/workflows/visual-ci-new.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 14f03bc94..d6490ea7c 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -28,7 +28,7 @@ jobs: run: lerna bootstrap --no-ci - name: New Web Visual Test - timeout-minutes: 18 + timeout-minutes: 18 run: | cd ./packages/web-new npm install From 51925fa030d305e9456ba3a2c32133e19e3b88ac Mon Sep 17 00:00:00 2001 From: Ege Korkan Date: Wed, 27 Dec 2023 11:04:05 +0100 Subject: [PATCH 44/68] Update visual-ci-new.yaml --- .github/workflows/visual-ci-new.yaml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index d6490ea7c..f9b443b43 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -1,4 +1,4 @@ -name: Visual Testing Pipeline +name: web-new Visual Testing Pipeline on: pull_request: @@ -33,4 +33,4 @@ jobs: cd ./packages/web-new npm install npx playwright install - npm run test \ No newline at end of file + npm run test From 8a60c818bdc2f898fa3aae82939dd33f5b7070b5 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 06:30:40 +0100 Subject: [PATCH 45/68] Modify the playwright config file to work with the CI pipeline --- .github/workflows/visual-ci-new.yaml | 6 +- packages/web-new/package-lock.json | 92 +++++++++++++++++++++++++++ packages/web-new/package.json | 1 + packages/web-new/playwright.config.js | 38 ++++++++--- 4 files changed, 126 insertions(+), 11 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index f9b443b43..bb017b706 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -16,10 +16,10 @@ jobs: - name: Checkout uses: actions/checkout@v3 - - name: Use Node.js 16 + - name: Use Node.js 18 uses: actions/setup-node@v3 with: - node-version: "16.x" + node-version: "18.x" - name: Use lerna run: npm install -g lerna@6.6.2 @@ -32,5 +32,5 @@ jobs: run: | cd ./packages/web-new npm install - npx playwright install + npx playwright install chromium firefox npm run test diff --git a/packages/web-new/package-lock.json b/packages/web-new/package-lock.json index 5f045ccfa..ba6eae436 100644 --- a/packages/web-new/package-lock.json +++ b/packages/web-new/package-lock.json @@ -35,6 +35,7 @@ "nodemon": "^3.0.1", "sass": "^1.64.0", "sass-loader": "^13.3.2", + "serve-handler": "^6.1.5", "style-loader": "^3.3.3", "webpack": "^5.88.2", "webpack-bundle-analyzer": "^4.9.0", @@ -4130,6 +4131,21 @@ "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==", "dev": true }, + "node_modules/fast-url-parser": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/fast-url-parser/-/fast-url-parser-1.1.3.tgz", + "integrity": "sha512-5jOCVXADYNuRkKFzNJ0dCCewsZiYo0dz8QNYljkOpFC6r2U4OBmKtvm/Tsuh4w1YYdDqDb31a8TVhBJ2OJKdqQ==", + "dev": true, + "dependencies": { + "punycode": "^1.3.2" + } + }, + "node_modules/fast-url-parser/node_modules/punycode": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz", + "integrity": "sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==", + "dev": true + }, "node_modules/fastest-levenshtein": { "version": "1.0.16", "resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz", @@ -5906,6 +5922,12 @@ "node": ">=0.10.0" } }, + "node_modules/path-is-inside": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz", + "integrity": "sha512-DUWJr3+ULp4zXmol/SZkFf3JGsS9/SIv+Y3Rt93/UjPpDpklB5f1er4O3POIbUuUJ3FXgqte2Q7SrU6zAqwk8w==", + "dev": true + }, "node_modules/path-key": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz", @@ -7065,6 +7087,76 @@ "randombytes": "^2.1.0" } }, + "node_modules/serve-handler": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/serve-handler/-/serve-handler-6.1.5.tgz", + "integrity": "sha512-ijPFle6Hwe8zfmBxJdE+5fta53fdIY0lHISJvuikXB3VYFafRjMRpOffSPvCYsbKyBA7pvy9oYr/BT1O3EArlg==", + "dev": true, + "dependencies": { + "bytes": "3.0.0", + "content-disposition": "0.5.2", + "fast-url-parser": "1.1.3", + "mime-types": "2.1.18", + "minimatch": "3.1.2", + "path-is-inside": "1.0.2", + "path-to-regexp": "2.2.1", + "range-parser": "1.2.0" + } + }, + "node_modules/serve-handler/node_modules/bytes": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz", + "integrity": "sha512-pMhOfFDPiv9t5jjIXkHosWmkSyQbvsgEVNkz0ERHbuLh2T/7j4Mqqpz523Fe8MVY89KC6Sh/QfS2sM+SjgFDcw==", + "dev": true, + "engines": { + "node": ">= 0.8" + } + }, + "node_modules/serve-handler/node_modules/content-disposition": { + "version": "0.5.2", + "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz", + "integrity": "sha512-kRGRZw3bLlFISDBgwTSA1TMBFN6J6GWDeubmDE3AF+3+yXL8hTWv8r5rkLbqYXY4RjPk/EzHnClI3zQf1cFmHA==", + "dev": true, + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/serve-handler/node_modules/mime-db": { + "version": "1.33.0", + "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.33.0.tgz", + "integrity": "sha512-BHJ/EKruNIqJf/QahvxwQZXKygOQ256myeN/Ew+THcAa5q+PjyTTMMeNQC4DZw5AwfvelsUrA6B67NKMqXDbzQ==", + "dev": true, + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/serve-handler/node_modules/mime-types": { + "version": "2.1.18", + "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.18.tgz", + "integrity": "sha512-lc/aahn+t4/SWV/qcmumYjymLsWfN3ELhpmVuUFjgsORruuZPVSwAQryq+HHGvO/SI2KVX26bx+En+zhM8g8hQ==", + "dev": true, + "dependencies": { + "mime-db": "~1.33.0" + }, + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/serve-handler/node_modules/path-to-regexp": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-2.2.1.tgz", + "integrity": "sha512-gu9bD6Ta5bwGrrU8muHzVOBFFREpp2iRkVfhBJahwJ6p6Xw20SjT0MxLnwkjOibQmGSYhiUnf2FLe7k+jcFmGQ==", + "dev": true + }, + "node_modules/serve-handler/node_modules/range-parser": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz", + "integrity": "sha512-kA5WQoNVo4t9lNx2kQNFCxKeBl5IbbSNBl1M/tLkw9WCn+hxNBAW5Qh8gdhs63CJnhjJ2zQWFoqPJP2sK1AV5A==", + "dev": true, + "engines": { + "node": ">= 0.6" + } + }, "node_modules/serve-index": { "version": "1.9.1", "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.1.tgz", diff --git a/packages/web-new/package.json b/packages/web-new/package.json index 5914a589e..0a88d5f5a 100644 --- a/packages/web-new/package.json +++ b/packages/web-new/package.json @@ -37,6 +37,7 @@ "nodemon": "^3.0.1", "sass": "^1.64.0", "sass-loader": "^13.3.2", + "serve-handler": "^6.1.5", "style-loader": "^3.3.3", "webpack": "^5.88.2", "webpack-bundle-analyzer": "^4.9.0", diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index 9e18e04c0..b8286bf99 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -14,8 +14,30 @@ ********************************************************************************/ // @ts-check const { defineConfig, devices } = require('@playwright/test'); +const handler = require("serve-handler"); +const http = require("http"); -// require('dotenv').config(); +const isCI = process.env.CI; +console.log(process.env); +console.log(isCI); + +if (isCI) { + const port = 3000; + const host = "http://localhost"; + const fullHost = host + ":" + port; + + const server = http.createServer((request, response) => { + // You pass two more arguments for config and middleware + // More details here: https://github.com/vercel/serve-handler#options + return handler(request, response); + }); + + /* ################### */ + /* MAIN */ + server.listen(port, () => { + console.log("Running siteTest at " + fullHost); + }); +} module.exports = defineConfig({ testDir: './tests', @@ -24,17 +46,17 @@ module.exports = defineConfig({ /* Run tests in files in parallel */ fullyParallel: true, /* Fail the build on CI if you accidentally left test.only in the source code. */ - forbidOnly: !!process.env.CI, + forbidOnly: !!isCI, /* Retry on CI only */ - retries: process.env.CI ? 2 : 0, + retries: isCI ? 2 : 0, /* Opt out of parallel tests on CI. */ - workers: process.env.CI ? 1 : undefined, + workers: isCI ? 1 : undefined, /* Reporter to use. See https://playwright.dev/docs/test-reporters */ reporter: 'html', /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: 'http://127.0.0.1:5100', + baseURL: isCI ? 'http://localhost:3000' : 'http://127.0.0.1:5100', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -66,8 +88,8 @@ module.exports = defineConfig({ /* Run your local dev server before starting the tests */ webServer: { - command: 'npm run serve', - url: 'http://127.0.0.1:5100', - reuseExistingServer: !process.env.CI, + command: isCI ? '' : 'npm run serve', + url: isCI ? 'http://localhost:3000' : 'http://127.0.0.1:5100', + reuseExistingServer: !isCI, }, }); From 21f45220b730812eefa5b2adf47f5a60f6084edc Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 06:37:48 +0100 Subject: [PATCH 46/68] . --- packages/web-new/playwright.config.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index b8286bf99..c47b732d4 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -22,7 +22,7 @@ console.log(process.env); console.log(isCI); if (isCI) { - const port = 3000; + const port = 5101; const host = "http://localhost"; const fullHost = host + ":" + port; @@ -56,7 +56,7 @@ module.exports = defineConfig({ /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: isCI ? 'http://localhost:3000' : 'http://127.0.0.1:5100', + baseURL: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -89,7 +89,7 @@ module.exports = defineConfig({ /* Run your local dev server before starting the tests */ webServer: { command: isCI ? '' : 'npm run serve', - url: isCI ? 'http://localhost:3000' : 'http://127.0.0.1:5100', + url: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', reuseExistingServer: !isCI, }, }); From 46f7077097d6ce7e2e8f0566591452e7f9e3d2cf Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 06:45:12 +0100 Subject: [PATCH 47/68] Testing different ports --- packages/web-new/playwright.config.js | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index c47b732d4..daac56143 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -18,11 +18,9 @@ const handler = require("serve-handler"); const http = require("http"); const isCI = process.env.CI; -console.log(process.env); -console.log(isCI); if (isCI) { - const port = 5101; + const port = 8080; const host = "http://localhost"; const fullHost = host + ":" + port; @@ -56,7 +54,7 @@ module.exports = defineConfig({ /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', + baseURL: isCI ? 'http://localhost:8080' : 'http://127.0.0.1:5100', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -89,7 +87,7 @@ module.exports = defineConfig({ /* Run your local dev server before starting the tests */ webServer: { command: isCI ? '' : 'npm run serve', - url: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', + url: isCI ? 'http://localhost:8080' : 'http://127.0.0.1:5100', reuseExistingServer: !isCI, }, }); From 282bbc465a312857cf50b29190a97b3ae1fdbc65 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 06:54:12 +0100 Subject: [PATCH 48/68] . --- packages/web-new/playwright.config.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index daac56143..44b0326f9 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -20,7 +20,7 @@ const http = require("http"); const isCI = process.env.CI; if (isCI) { - const port = 8080; + const port = 5101; const host = "http://localhost"; const fullHost = host + ":" + port; @@ -54,7 +54,7 @@ module.exports = defineConfig({ /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: isCI ? 'http://localhost:8080' : 'http://127.0.0.1:5100', + baseURL: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -87,7 +87,7 @@ module.exports = defineConfig({ /* Run your local dev server before starting the tests */ webServer: { command: isCI ? '' : 'npm run serve', - url: isCI ? 'http://localhost:8080' : 'http://127.0.0.1:5100', - reuseExistingServer: !isCI, - }, + url: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', + reuseExistingServer: true, + } }); From 44f41067fce144acb6a1b9156f95bb01b15dda5a Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:00:05 +0100 Subject: [PATCH 49/68] removing unnecesary dependencies --- packages/web-new/package-lock.json | 92 --------------------------- packages/web-new/package.json | 1 - packages/web-new/playwright.config.js | 26 +------- 3 files changed, 3 insertions(+), 116 deletions(-) diff --git a/packages/web-new/package-lock.json b/packages/web-new/package-lock.json index ba6eae436..5f045ccfa 100644 --- a/packages/web-new/package-lock.json +++ b/packages/web-new/package-lock.json @@ -35,7 +35,6 @@ "nodemon": "^3.0.1", "sass": "^1.64.0", "sass-loader": "^13.3.2", - "serve-handler": "^6.1.5", "style-loader": "^3.3.3", "webpack": "^5.88.2", "webpack-bundle-analyzer": "^4.9.0", @@ -4131,21 +4130,6 @@ "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==", "dev": true }, - "node_modules/fast-url-parser": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/fast-url-parser/-/fast-url-parser-1.1.3.tgz", - "integrity": "sha512-5jOCVXADYNuRkKFzNJ0dCCewsZiYo0dz8QNYljkOpFC6r2U4OBmKtvm/Tsuh4w1YYdDqDb31a8TVhBJ2OJKdqQ==", - "dev": true, - "dependencies": { - "punycode": "^1.3.2" - } - }, - "node_modules/fast-url-parser/node_modules/punycode": { - "version": "1.4.1", - "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz", - "integrity": "sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==", - "dev": true - }, "node_modules/fastest-levenshtein": { "version": "1.0.16", "resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz", @@ -5922,12 +5906,6 @@ "node": ">=0.10.0" } }, - "node_modules/path-is-inside": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz", - "integrity": "sha512-DUWJr3+ULp4zXmol/SZkFf3JGsS9/SIv+Y3Rt93/UjPpDpklB5f1er4O3POIbUuUJ3FXgqte2Q7SrU6zAqwk8w==", - "dev": true - }, "node_modules/path-key": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz", @@ -7087,76 +7065,6 @@ "randombytes": "^2.1.0" } }, - "node_modules/serve-handler": { - "version": "6.1.5", - "resolved": "https://registry.npmjs.org/serve-handler/-/serve-handler-6.1.5.tgz", - "integrity": "sha512-ijPFle6Hwe8zfmBxJdE+5fta53fdIY0lHISJvuikXB3VYFafRjMRpOffSPvCYsbKyBA7pvy9oYr/BT1O3EArlg==", - "dev": true, - "dependencies": { - "bytes": "3.0.0", - "content-disposition": "0.5.2", - "fast-url-parser": "1.1.3", - "mime-types": "2.1.18", - "minimatch": "3.1.2", - "path-is-inside": "1.0.2", - "path-to-regexp": "2.2.1", - "range-parser": "1.2.0" - } - }, - "node_modules/serve-handler/node_modules/bytes": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz", - "integrity": "sha512-pMhOfFDPiv9t5jjIXkHosWmkSyQbvsgEVNkz0ERHbuLh2T/7j4Mqqpz523Fe8MVY89KC6Sh/QfS2sM+SjgFDcw==", - "dev": true, - "engines": { - "node": ">= 0.8" - } - }, - "node_modules/serve-handler/node_modules/content-disposition": { - "version": "0.5.2", - "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz", - "integrity": "sha512-kRGRZw3bLlFISDBgwTSA1TMBFN6J6GWDeubmDE3AF+3+yXL8hTWv8r5rkLbqYXY4RjPk/EzHnClI3zQf1cFmHA==", - "dev": true, - "engines": { - "node": ">= 0.6" - } - }, - "node_modules/serve-handler/node_modules/mime-db": { - "version": "1.33.0", - "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.33.0.tgz", - "integrity": "sha512-BHJ/EKruNIqJf/QahvxwQZXKygOQ256myeN/Ew+THcAa5q+PjyTTMMeNQC4DZw5AwfvelsUrA6B67NKMqXDbzQ==", - "dev": true, - "engines": { - "node": ">= 0.6" - } - }, - "node_modules/serve-handler/node_modules/mime-types": { - "version": "2.1.18", - "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.18.tgz", - "integrity": "sha512-lc/aahn+t4/SWV/qcmumYjymLsWfN3ELhpmVuUFjgsORruuZPVSwAQryq+HHGvO/SI2KVX26bx+En+zhM8g8hQ==", - "dev": true, - "dependencies": { - "mime-db": "~1.33.0" - }, - "engines": { - "node": ">= 0.6" - } - }, - "node_modules/serve-handler/node_modules/path-to-regexp": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-2.2.1.tgz", - "integrity": "sha512-gu9bD6Ta5bwGrrU8muHzVOBFFREpp2iRkVfhBJahwJ6p6Xw20SjT0MxLnwkjOibQmGSYhiUnf2FLe7k+jcFmGQ==", - "dev": true - }, - "node_modules/serve-handler/node_modules/range-parser": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz", - "integrity": "sha512-kA5WQoNVo4t9lNx2kQNFCxKeBl5IbbSNBl1M/tLkw9WCn+hxNBAW5Qh8gdhs63CJnhjJ2zQWFoqPJP2sK1AV5A==", - "dev": true, - "engines": { - "node": ">= 0.6" - } - }, "node_modules/serve-index": { "version": "1.9.1", "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.1.tgz", diff --git a/packages/web-new/package.json b/packages/web-new/package.json index 0a88d5f5a..5914a589e 100644 --- a/packages/web-new/package.json +++ b/packages/web-new/package.json @@ -37,7 +37,6 @@ "nodemon": "^3.0.1", "sass": "^1.64.0", "sass-loader": "^13.3.2", - "serve-handler": "^6.1.5", "style-loader": "^3.3.3", "webpack": "^5.88.2", "webpack-bundle-analyzer": "^4.9.0", diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index 44b0326f9..36d9a5447 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -14,29 +14,9 @@ ********************************************************************************/ // @ts-check const { defineConfig, devices } = require('@playwright/test'); -const handler = require("serve-handler"); -const http = require("http"); const isCI = process.env.CI; -if (isCI) { - const port = 5101; - const host = "http://localhost"; - const fullHost = host + ":" + port; - - const server = http.createServer((request, response) => { - // You pass two more arguments for config and middleware - // More details here: https://github.com/vercel/serve-handler#options - return handler(request, response); - }); - - /* ################### */ - /* MAIN */ - server.listen(port, () => { - console.log("Running siteTest at " + fullHost); - }); -} - module.exports = defineConfig({ testDir: './tests', // Folder for test artifacts such as screenshots, videos, traces, etc. @@ -54,7 +34,7 @@ module.exports = defineConfig({ /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', + baseURL: isCI ? 'https://deploy-preview-515--thingweb-playground.netlify.app' : 'http://127.0.0.1:5100', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -87,7 +67,7 @@ module.exports = defineConfig({ /* Run your local dev server before starting the tests */ webServer: { command: isCI ? '' : 'npm run serve', - url: isCI ? 'http://localhost:5101' : 'http://127.0.0.1:5100', - reuseExistingServer: true, + url: isCI ? 'https://deploy-preview-515--thingweb-playground.netlify.app' : 'http://127.0.0.1:5100', + reuseExistingServer: !isCI, } }); From 0d30e28e06c20809756972dd3d84c3bdec4df5c5 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:09:51 +0100 Subject: [PATCH 50/68] creating the server in the playwright config file --- packages/web-new/playwright.config.js | 26 ++++++++++++++++++++------ 1 file changed, 20 insertions(+), 6 deletions(-) diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index 36d9a5447..9f446c12b 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -15,6 +15,20 @@ // @ts-check const { defineConfig, devices } = require('@playwright/test'); +//server +const express = require('express') +const port = 5100 + +const app = express() + +//Middleware +app.use(express.json()) +app.use(express.urlencoded({extended: false})) + +app.use('/', express.static('./dist/')) + +app.listen(port, () => console.log(`Running siteTest on port ${port}`)) + const isCI = process.env.CI; module.exports = defineConfig({ @@ -34,7 +48,7 @@ module.exports = defineConfig({ /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: isCI ? 'https://deploy-preview-515--thingweb-playground.netlify.app' : 'http://127.0.0.1:5100', + baseURL: 'http://127.0.0.1:5100', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -65,9 +79,9 @@ module.exports = defineConfig({ ], /* Run your local dev server before starting the tests */ - webServer: { - command: isCI ? '' : 'npm run serve', - url: isCI ? 'https://deploy-preview-515--thingweb-playground.netlify.app' : 'http://127.0.0.1:5100', - reuseExistingServer: !isCI, - } + // webServer: { + // command: isCI ? '' : 'npm run serve', + // url: isCI ? '' : 'http://127.0.0.1:5100', + // reuseExistingServer: !isCI, + // } }); From 38175e76af08d9a1c68cb52c7ff226c79d289ee9 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:23:24 +0100 Subject: [PATCH 51/68] adding a timeout --- packages/web-new/playwright.config.js | 25 ++++++------------------- 1 file changed, 6 insertions(+), 19 deletions(-) diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index 9f446c12b..bb8234249 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -15,20 +15,6 @@ // @ts-check const { defineConfig, devices } = require('@playwright/test'); -//server -const express = require('express') -const port = 5100 - -const app = express() - -//Middleware -app.use(express.json()) -app.use(express.urlencoded({extended: false})) - -app.use('/', express.static('./dist/')) - -app.listen(port, () => console.log(`Running siteTest on port ${port}`)) - const isCI = process.env.CI; module.exports = defineConfig({ @@ -79,9 +65,10 @@ module.exports = defineConfig({ ], /* Run your local dev server before starting the tests */ - // webServer: { - // command: isCI ? '' : 'npm run serve', - // url: isCI ? '' : 'http://127.0.0.1:5100', - // reuseExistingServer: !isCI, - // } + webServer: { + command: 'npm run serve', + url: 'http://127.0.0.1:5100', + timeout: 120 * 1000, + reuseExistingServer: !isCI, + } }); From bc4e930a184dfecba76904cbb52716b3e9d75b40 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:40:07 +0100 Subject: [PATCH 52/68] trying default playwright settings --- .github/workflows/visual-ci-new.yaml | 85 ++++++++++++++++++---------- 1 file changed, 56 insertions(+), 29 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index bb017b706..08e313100 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -1,36 +1,63 @@ -name: web-new Visual Testing Pipeline +# name: web-new Visual Testing Pipeline -on: - pull_request: - paths-ignore: - - "**.md" - - "**.png" - - "**.drawio" - - "**.xlsx" +# on: +# pull_request: +# paths-ignore: +# - "**.md" +# - "**.png" +# - "**.drawio" +# - "**.xlsx" -jobs: - setup-and-visual-test: - runs-on: ubuntu-latest +# jobs: +# setup-and-visual-test: +# runs-on: ubuntu-latest - steps: - - name: Checkout - uses: actions/checkout@v3 +# steps: +# - name: Checkout +# uses: actions/checkout@v3 - - name: Use Node.js 18 - uses: actions/setup-node@v3 - with: - node-version: "18.x" +# - name: Use Node.js 18 +# uses: actions/setup-node@v3 +# with: +# node-version: "18.x" - - name: Use lerna - run: npm install -g lerna@6.6.2 +# - name: Use lerna +# run: npm install -g lerna@6.6.2 - - name: Bootstrap - run: lerna bootstrap --no-ci +# - name: Bootstrap +# run: lerna bootstrap --no-ci - - name: New Web Visual Test - timeout-minutes: 18 - run: | - cd ./packages/web-new - npm install - npx playwright install chromium firefox - npm run test +# - name: New Web Visual Test +# timeout-minutes: 18 +# run: | +# cd ./packages/web-new +# npm install +# npx playwright install chromium firefox +# npm run test +name: Playwright Tests +on: + push: + branches: [ main, master ] + pull_request: + branches: [ main, master ] +jobs: + test: + timeout-minutes: 60 + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v3 + - uses: actions/setup-node@v3 + with: + node-version: 18 + - name: Install dependencies + run: npm ci + - name: Install Playwright Browsers + run: npx playwright install chromium firefox + - name: Run Playwright tests + run: npx playwright test + - uses: actions/upload-artifact@v3 + if: always() + with: + name: playwright-report + path: playwright-report/ + retention-days: 30 From 0c981bf72ed4342c9ffaf5b0de996c2d89f1bf8b Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:44:30 +0100 Subject: [PATCH 53/68] . --- .github/workflows/visual-ci-new.yaml | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 08e313100..25e4e19bc 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -52,9 +52,11 @@ jobs: - name: Install dependencies run: npm ci - name: Install Playwright Browsers - run: npx playwright install chromium firefox + run: + npm install + npx playwright install chromium firefox - name: Run Playwright tests - run: npx playwright test + run: npm run test - uses: actions/upload-artifact@v3 if: always() with: From c8dc8a10b30abfed22f09363d17939da15bb482d Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:49:52 +0100 Subject: [PATCH 54/68] . --- .github/workflows/visual-ci-new.yaml | 1 + 1 file changed, 1 insertion(+) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 25e4e19bc..b629c9351 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -53,6 +53,7 @@ jobs: run: npm ci - name: Install Playwright Browsers run: + cd ./packages/web-new npm install npx playwright install chromium firefox - name: Run Playwright tests From ea1c106af253512bd35852bee508c66b928ec6a4 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 5 Jan 2024 07:52:52 +0100 Subject: [PATCH 55/68] returning to original --- .github/workflows/visual-ci-new.yaml | 88 +++++++++------------------- 1 file changed, 29 insertions(+), 59 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index b629c9351..412eb4087 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -1,66 +1,36 @@ -# name: web-new Visual Testing Pipeline +name: web-new Visual Testing Pipeline -# on: -# pull_request: -# paths-ignore: -# - "**.md" -# - "**.png" -# - "**.drawio" -# - "**.xlsx" +on: + pull_request: + paths-ignore: + - "**.md" + - "**.png" + - "**.drawio" + - "**.xlsx" -# jobs: -# setup-and-visual-test: -# runs-on: ubuntu-latest +jobs: + setup-and-visual-test: + runs-on: ubuntu-latest -# steps: -# - name: Checkout -# uses: actions/checkout@v3 + steps: + - name: Checkout + uses: actions/checkout@v3 -# - name: Use Node.js 18 -# uses: actions/setup-node@v3 -# with: -# node-version: "18.x" + - name: Use Node.js 18 + uses: actions/setup-node@v3 + with: + node-version: "18.x" -# - name: Use lerna -# run: npm install -g lerna@6.6.2 + - name: Use lerna + run: npm install -g lerna@6.6.2 -# - name: Bootstrap -# run: lerna bootstrap --no-ci + - name: Bootstrap + run: lerna bootstrap --no-ci -# - name: New Web Visual Test -# timeout-minutes: 18 -# run: | -# cd ./packages/web-new -# npm install -# npx playwright install chromium firefox -# npm run test -name: Playwright Tests -on: - push: - branches: [ main, master ] - pull_request: - branches: [ main, master ] -jobs: - test: - timeout-minutes: 60 - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v3 - - uses: actions/setup-node@v3 - with: - node-version: 18 - - name: Install dependencies - run: npm ci - - name: Install Playwright Browsers - run: - cd ./packages/web-new - npm install - npx playwright install chromium firefox - - name: Run Playwright tests - run: npm run test - - uses: actions/upload-artifact@v3 - if: always() - with: - name: playwright-report - path: playwright-report/ - retention-days: 30 + - name: New Web Visual Test + timeout-minutes: 18 + run: | + cd ./packages/web-new + npm install + npx playwright install chromium firefox + npm run test \ No newline at end of file From 4c3443319045acf6c1aee224319756f32f33ca69 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 2 Feb 2024 15:34:02 +0100 Subject: [PATCH 56/68] added workflow changes --- .github/workflows/visual-ci-new.yaml | 74 ++++++++++++++++++++++++--- packages/web-new/playwright.config.js | 30 +++++------ 2 files changed, 83 insertions(+), 21 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 412eb4087..a9ee80361 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -1,3 +1,39 @@ +# name: web-new Visual Testing Pipeline + +# on: +# pull_request: +# paths-ignore: +# - "**.md" +# - "**.png" +# - "**.drawio" +# - "**.xlsx" + +# jobs: +# setup-and-visual-test: +# runs-on: ubuntu-latest + +# steps: +# - name: Checkout +# uses: actions/checkout@v3 + +# - name: Use Node.js 18 +# uses: actions/setup-node@v3 +# with: +# node-version: "18.x" + +# - name: Use lerna +# run: npm install -g lerna@6.6.2 + +# - name: Bootstrap +# run: lerna bootstrap --no-ci + +# - name: New Web Visual Test +# timeout-minutes: 18 +# run: | +# cd ./packages/web-new +# npm install +# npx playwright install chromium firefox +# npm run test name: web-new Visual Testing Pipeline on: @@ -26,11 +62,37 @@ jobs: - name: Bootstrap run: lerna bootstrap --no-ci + + - name: Move to folder + run: cd ./packages/web-new + + - name: Install dependencies + run: npm install - - name: New Web Visual Test - timeout-minutes: 18 + - name: Install Playwright Browsers + run: npx playwright install chromium firefox + + - name: Run server and test run: | - cd ./packages/web-new - npm install - npx playwright install chromium firefox - npm run test \ No newline at end of file + npm run serve & + sleep 10 + npm run test + + # - name: Run Playwright tests + # run: npm run test + + - uses: actions/upload-artifact@v3 + if: always() + with: + name: playwright-report + path: playwright-report/ + retention-days: 30 + + # - name: Install dependencies + # run: npm install + + # - name: Install Playwright + # run: npx playwright install chromium firefox + + # - name: Run Tests + # run: npm run test \ No newline at end of file diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index bb8234249..79bd73be2 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -54,21 +54,21 @@ module.exports = defineConfig({ name: 'webkit', use: { ...devices['Desktop Safari'] }, }, - { - name: 'Microsoft Edge', - use: { ...devices['Desktop Edge'], channel: 'msedge' }, - }, - { - name: 'Google Chrome', - use: { ...devices['Desktop Chrome'], channel: 'chrome' }, - } + // { + // name: 'Microsoft Edge', + // use: { ...devices['Desktop Edge'], channel: 'msedge' }, + // }, + // { + // name: 'Google Chrome', + // use: { ...devices['Desktop Chrome'], channel: 'chrome' }, + // } ], - /* Run your local dev server before starting the tests */ - webServer: { - command: 'npm run serve', - url: 'http://127.0.0.1:5100', - timeout: 120 * 1000, - reuseExistingServer: !isCI, - } + // /* Run your local dev server before starting the tests */ + // webServer: { + // command: 'npm run serve', + // url: 'http://127.0.0.1:5100', + // timeout: 120 * 1000, + // reuseExistingServer: !isCI, + // } }); From 91092c2dca02266d4de354d1d31e56478928126f Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 2 Feb 2024 15:39:02 +0100 Subject: [PATCH 57/68] Changed the yaml file --- .github/workflows/visual-ci-new.yaml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index a9ee80361..3ee4d9488 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -74,9 +74,9 @@ jobs: - name: Run server and test run: | - npm run serve & + npm serve & sleep 10 - npm run test + npm test # - name: Run Playwright tests # run: npm run test From a47a61abe8c85e85cb6f5e46f4dfc48ab73b4290 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 2 Feb 2024 15:49:37 +0100 Subject: [PATCH 58/68] Putting everything in one step for testing --- .github/workflows/visual-ci-new.yaml | 14 ++++---------- 1 file changed, 4 insertions(+), 10 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 3ee4d9488..2a28454f4 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -63,17 +63,11 @@ jobs: - name: Bootstrap run: lerna bootstrap --no-ci - - name: Move to folder - run: cd ./packages/web-new - - - name: Install dependencies - run: npm install - - - name: Install Playwright Browsers - run: npx playwright install chromium firefox - - - name: Run server and test + - name: Visual Tests run: | + cd ./packages/web-new + npm install + npx playwright install chromium firefox npm serve & sleep 10 npm test From f07fe3f16b357ef1a9cf68e464b2a43dc25ee97d Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 2 Feb 2024 16:08:50 +0100 Subject: [PATCH 59/68] Fixed the new visual yaml file to run server first --- .github/workflows/visual-ci-new.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 2a28454f4..0180bf7c5 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -68,7 +68,7 @@ jobs: cd ./packages/web-new npm install npx playwright install chromium firefox - npm serve & + npm run serve & sleep 10 npm test From 28b2ad6c59a5f4ae55324a1a666d1d85ce6d0c67 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Fri, 2 Feb 2024 17:36:12 +0100 Subject: [PATCH 60/68] Changed the config file --- .github/workflows/visual-ci-new.yaml | 55 ++------------------------- packages/web-new/playwright.config.js | 26 +++++++------ 2 files changed, 18 insertions(+), 63 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 0180bf7c5..1097b49f0 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -1,40 +1,4 @@ -# name: web-new Visual Testing Pipeline - -# on: -# pull_request: -# paths-ignore: -# - "**.md" -# - "**.png" -# - "**.drawio" -# - "**.xlsx" - -# jobs: -# setup-and-visual-test: -# runs-on: ubuntu-latest - -# steps: -# - name: Checkout -# uses: actions/checkout@v3 - -# - name: Use Node.js 18 -# uses: actions/setup-node@v3 -# with: -# node-version: "18.x" - -# - name: Use lerna -# run: npm install -g lerna@6.6.2 - -# - name: Bootstrap -# run: lerna bootstrap --no-ci - -# - name: New Web Visual Test -# timeout-minutes: 18 -# run: | -# cd ./packages/web-new -# npm install -# npx playwright install chromium firefox -# npm run test -name: web-new Visual Testing Pipeline +name: Web-New Visual Testing Pipeline on: pull_request: @@ -64,29 +28,16 @@ jobs: run: lerna bootstrap --no-ci - name: Visual Tests + timeout-minutes: 18 run: | cd ./packages/web-new npm install npx playwright install chromium firefox - npm run serve & - sleep 10 npm test - # - name: Run Playwright tests - # run: npm run test - - uses: actions/upload-artifact@v3 if: always() with: name: playwright-report path: playwright-report/ - retention-days: 30 - - # - name: Install dependencies - # run: npm install - - # - name: Install Playwright - # run: npx playwright install chromium firefox - - # - name: Run Tests - # run: npm run test \ No newline at end of file + retention-days: 30 \ No newline at end of file diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index 79bd73be2..c2220733e 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -15,7 +15,11 @@ // @ts-check const { defineConfig, devices } = require('@playwright/test'); -const isCI = process.env.CI; +/** + * Read environment variables from file. + * https://github.com/motdotla/dotenv + */ +// require('dotenv').config(); module.exports = defineConfig({ testDir: './tests', @@ -24,11 +28,11 @@ module.exports = defineConfig({ /* Run tests in files in parallel */ fullyParallel: true, /* Fail the build on CI if you accidentally left test.only in the source code. */ - forbidOnly: !!isCI, + forbidOnly: !!process.env.CI, /* Retry on CI only */ - retries: isCI ? 2 : 0, + retries: process.env.CI ? 2 : 0, /* Opt out of parallel tests on CI. */ - workers: isCI ? 1 : undefined, + workers: process.env.CI ? 1 : undefined, /* Reporter to use. See https://playwright.dev/docs/test-reporters */ reporter: 'html', /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ @@ -64,11 +68,11 @@ module.exports = defineConfig({ // } ], - // /* Run your local dev server before starting the tests */ - // webServer: { - // command: 'npm run serve', - // url: 'http://127.0.0.1:5100', - // timeout: 120 * 1000, - // reuseExistingServer: !isCI, - // } + /* Run your local dev server before starting the tests */ + webServer: { + command: 'npm run serve', + url: 'http://127.0.0.1:5100', + // timeout: 120 * 1000, + reuseExistingServer: !process.env.CI, + } }); From e024fa92575cdcbd42bf08be69c523cd40632f5f Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Wed, 7 Feb 2024 19:19:09 +0100 Subject: [PATCH 61/68] Reduce amount of tests to 1 --- .github/workflows/visual-ci-new.yaml | 2 + packages/web-new/playwright.config.js | 12 +- packages/web-new/tests/test.spec.js | 3210 ++++++++++++------------- 3 files changed, 1613 insertions(+), 1611 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 1097b49f0..c0e981e16 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -33,6 +33,8 @@ jobs: cd ./packages/web-new npm install npx playwright install chromium firefox + npm run serve & + sleep 10 npm test - uses: actions/upload-artifact@v3 diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index c2220733e..3f6b292f7 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -69,10 +69,10 @@ module.exports = defineConfig({ ], /* Run your local dev server before starting the tests */ - webServer: { - command: 'npm run serve', - url: 'http://127.0.0.1:5100', - // timeout: 120 * 1000, - reuseExistingServer: !process.env.CI, - } + // webServer: { + // command: 'npm run serve', + // url: 'http://127.0.0.1:5100', + // // timeout: 120 * 1000, + // reuseExistingServer: !process.env.CI, + // } }); diff --git a/packages/web-new/tests/test.spec.js b/packages/web-new/tests/test.spec.js index 3a0333358..a2c69be9c 100644 --- a/packages/web-new/tests/test.spec.js +++ b/packages/web-new/tests/test.spec.js @@ -14,7 +14,7 @@ ********************************************************************************/ const { test, expect } = require('@playwright/test'); -//Open the playground app before any test is runned +//Open the playground app before any test is ran test.beforeEach(async ({ page }) => { await page.goto('/') }); @@ -24,2171 +24,2171 @@ test.describe("Load initial state", () => { await expect(page).toHaveTitle("TD Playground") }) - test('Has editor tab', async ({ page }) => { - const editorTab = page.locator('#tab') - await expect(editorTab).toHaveText("TDThing TemplateCloseCancel") - }) + // test('Has editor tab', async ({ page }) => { + // const editorTab = page.locator('#tab') + // await expect(editorTab).toHaveText("TDThing TemplateCloseCancel") + // }) - test('Has TD template', async ({ page }) => { - const editor = page.locator('#editor1').getByRole('code').locator('div').filter({ hasText: '"title": "Thing Template",' }).nth(4) - await expect(editor).toHaveText('"title": "Thing Template",') - }) + // test('Has TD template', async ({ page }) => { + // const editor = page.locator('#editor1').getByRole('code').locator('div').filter({ hasText: '"title": "Thing Template",' }).nth(4) + // await expect(editor).toHaveText('"title": "Thing Template",') + // }) - test('Validation tab is checked', async ({ page }) => { - const validationTab = page.locator('#validation-tab') - await expect(validationTab).toBeChecked() - }) + // test('Validation tab is checked', async ({ page }) => { + // const validationTab = page.locator('#validation-tab') + // await expect(validationTab).toBeChecked() + // }) - test('Validation view is opened', async ({ page }) => { - const validationView = page.locator('#validation-view') - await expect(validationView).toHaveClass("console-view validation-view") - }) + // test('Validation view is opened', async ({ page }) => { + // const validationView = page.locator('#validation-view') + // await expect(validationView).toHaveClass("console-view validation-view") + // }) - test('JSON button is checked', async ({ page }) => { - const jsonBtn = page.locator('#file-type-json') - await expect(jsonBtn).toBeChecked() - }) + // test('JSON button is checked', async ({ page }) => { + // const jsonBtn = page.locator('#file-type-json') + // await expect(jsonBtn).toBeChecked() + // }) }) -test.describe("Check all links", () => { - test("Check Thingweb logo link", async ({ page }) => { - const thingwebPromise = page.waitForEvent('popup') - await page.locator(".logo").click() - const thingwebPage = await thingwebPromise - await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") - await expect(thingwebPage).toHaveURL("https://www.thingweb.io") - }) +// test.describe("Check all links", () => { +// test("Check Thingweb logo link", async ({ page }) => { +// const thingwebPromise = page.waitForEvent('popup') +// await page.locator(".logo").click() +// const thingwebPage = await thingwebPromise +// await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") +// await expect(thingwebPage).toHaveURL("https://www.thingweb.io") +// }) + +// test("Check CLI link", async ({ page }) => { +// const cliPromise = page.waitForEvent('popup') +// await page.locator(".cli-link").click() +// const cliPage = await cliPromise +// await expect(cliPage).toHaveURL("https://github.com/eclipse-thingweb/playground/tree/master/packages/cli") +// }) + +// test("Check Github link", async ({ page }) => { +// const githubPromise = page.waitForEvent('popup') +// await page.locator(".git-link").click() +// const githubPage = await githubPromise +// await expect(githubPage).toHaveTitle(/GitHub - eclipse-thingweb/) +// await expect(githubPage).toHaveURL("https://github.com/eclipse-thingweb/playground") +// }) + +// test("Check Thingweb footer link", async ({ page }) => { +// await page.locator('#settings-btn').click() +// const thingwebPromise = page.waitForEvent('popup') +// await page.locator("#thingweb-link").click() +// const thingwebPage = await thingwebPromise +// await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") +// await expect(thingwebPage).toHaveURL("https://www.thingweb.io") +// }) + +// test("Check Eclipse footer link", async ({ page }) => { +// await page.locator('#settings-btn').click() +// const eclipsePromise = page.waitForEvent('popup') +// await page.locator("#eclipse-link").click() +// const eclipsePage = await eclipsePromise +// await expect(eclipsePage).toHaveTitle("The Community for Open Collaboration and Innovation | The Eclipse Foundation") +// await expect(eclipsePage).toHaveURL("https://www.eclipse.org") +// }) + +// test("Check privacy policy footer link", async ({ page }) => { +// await page.locator('#settings-btn').click() +// const privacyPromise = page.waitForEvent('popup') +// await page.locator("#privacy-link").click() +// const privacyPage = await privacyPromise +// await expect(privacyPage).toHaveTitle("Eclipse Foundation Website Privacy Policy | The Eclipse Foundation") +// await expect(privacyPage).toHaveURL("https://www.eclipse.org/legal/privacy.php") +// }) + +// test("Check terms of use footer link", async ({ page }) => { +// await page.locator('#settings-btn').click() +// const termsPromise = page.waitForEvent('popup') +// await page.locator("#terms-link").click() +// const termsPage = await termsPromise +// await expect(termsPage).toHaveTitle("Eclipse.org Terms of Use | The Eclipse Foundation") +// await expect(termsPage).toHaveURL("https://www.eclipse.org/legal/termsofuse.php") +// }) + +// test("Check copyright agent footer link", async ({ page }) => { +// await page.locator('#settings-btn').click() +// const copyrightPromise = page.waitForEvent('popup') +// await page.locator("#copyright-link").click() +// const copyrightPage = await copyrightPromise +// await expect(copyrightPage).toHaveTitle("Copyright Agent | The Eclipse Foundation") +// await expect(copyrightPage).toHaveURL("https://www.eclipse.org/legal/copyright.php") +// }) + +// test("Check legal footer link", async ({ page }) => { +// await page.locator('#settings-btn').click() +// const legalPromise = page.waitForEvent('popup') +// await page.locator("#legal-link").click() +// const legalPage = await legalPromise +// await expect(legalPage).toHaveTitle("Eclipse Foundation Legal Resources | The Eclipse Foundation") +// await expect(legalPage).toHaveURL("https://www.eclipse.org/legal/") +// }) +// }) + +// test.describe("Editors and Tabs creation and deletion", () => { +// test("Adding a new editor and closing it", async ({ page }) => { +// const editorTabs = page.locator("#tab") +// const editors = page.locator(".editor") +// await expect(editorTabs).toHaveCount(1) +// await expect(editors).toHaveCount(1) + +// const initialTab = page.locator("#tab").nth(0) +// await expect(initialTab).toHaveAttribute('data-tab-id', "1") +// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(initialTab).toHaveClass("active") + +// const initialEditor = page.locator("#editor1") +// await expect(initialEditor).toHaveAttribute('data-ide-id', "1") +// await expect(initialEditor).toHaveClass("editor active") + +// await page.locator("#ide-tab-add").click() +// await expect(editorTabs).toHaveCount(2) +// await expect(editors).toHaveCount(2) + +// await expect(initialTab).toHaveClass("") +// await expect(initialEditor).toHaveClass("editor") + +// const secondTab = page.locator("#tab").nth(1) +// await expect(secondTab).toHaveAttribute('data-tab-id', "2") +// await expect(secondTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(secondTab).toHaveClass("active") + +// const secondEditor = page.locator("#editor2") +// await expect(secondEditor).toHaveAttribute('data-ide-id', "2") +// await expect(secondEditor).toHaveClass("editor active") + +// await page.locator("#tab").nth(1).locator(".close-tab").click() +// await page.locator('#tab').nth(1).locator(".confirm-btns > .confirm-tab-close").click() + +// await expect(editorTabs).toHaveCount(1) +// await expect(editors).toHaveCount(1) + +// await expect(initialTab).toHaveClass("active") +// await expect(initialEditor).toHaveClass("editor active") +// }) + +// test("Opening an example and closing initial editor", async ({ page }) => { +// const editorTabs = page.locator("#tab") +// const editors = page.locator(".editor") +// await expect(editorTabs).toHaveCount(1) +// await expect(editors).toHaveCount(1) + +// const initialTab = page.locator("#tab").nth(0) +// await expect(initialTab).toHaveAttribute('data-tab-id', "1") +// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(initialTab).toHaveClass("active") + +// const initialEditor = page.locator("#editor1") +// await expect(initialEditor).toHaveAttribute('data-ide-id', "1") +// await expect(initialEditor).toHaveClass("editor active") + +// await page.locator("#examples-btn").click() +// await page.locator(".example").nth(0).click() +// await page.locator(".example").nth(0).getByRole("button", { name: /Apply/ }).click() + +// await expect(editorTabs).toHaveCount(2) +// await expect(editors).toHaveCount(2) + +// await expect(initialTab).toHaveClass("") +// await expect(initialEditor).toHaveClass("editor") + +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") + +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveClass("editor active") + +// await page.locator("#tab").nth(0).locator(".close-tab").click() +// await page.locator('#tab').nth(0).locator(".confirm-btns > .confirm-tab-close").click() + +// await expect(editorTabs).toHaveCount(1) +// await expect(editors).toHaveCount(1) +// }) +// }) + +// test.describe("JSON and YAML conversion", () => { +// test("JSON to YAML and YAML to JSON", async ({ page }) => { +// const editorTabs = page.locator("#tab") +// const editors = page.locator(".editor") +// await expect(editorTabs).toHaveCount(1) +// await expect(editors).toHaveCount(1) + +// const jsonYamlPopup = page.locator('.json-yaml-warning') +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + +// const initialEditor = page.locator("#editor1") +// const jsonBtn = page.locator('#file-type-json') +// const yamlBtn = page.locator('#file-type-yaml') - test("Check CLI link", async ({ page }) => { - const cliPromise = page.waitForEvent('popup') - await page.locator(".cli-link").click() - const cliPage = await cliPromise - await expect(cliPage).toHaveURL("https://github.com/eclipse-thingweb/playground/tree/master/packages/cli") - }) +// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) - test("Check Github link", async ({ page }) => { - const githubPromise = page.waitForEvent('popup') - await page.locator(".git-link").click() - const githubPage = await githubPromise - await expect(githubPage).toHaveTitle(/GitHub - eclipse-thingweb/) - await expect(githubPage).toHaveURL("https://github.com/eclipse-thingweb/playground") - }) +// await yamlBtn.click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - test("Check Thingweb footer link", async ({ page }) => { - await page.locator('#settings-btn').click() - const thingwebPromise = page.waitForEvent('popup') - await page.locator("#thingweb-link").click() - const thingwebPage = await thingwebPromise - await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") - await expect(thingwebPage).toHaveURL("https://www.thingweb.io") - }) +// await page.locator('#yaml-confirm-btn').click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// await expect(initialEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(jsonBtn).toBeChecked({ checked: false }) +// await expect(yamlBtn).toBeChecked({ checked: true }) - test("Check Eclipse footer link", async ({ page }) => { - await page.locator('#settings-btn').click() - const eclipsePromise = page.waitForEvent('popup') - await page.locator("#eclipse-link").click() - const eclipsePage = await eclipsePromise - await expect(eclipsePage).toHaveTitle("The Community for Open Collaboration and Innovation | The Eclipse Foundation") - await expect(eclipsePage).toHaveURL("https://www.eclipse.org") - }) +// await jsonBtn.click() +// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) +// }) - test("Check privacy policy footer link", async ({ page }) => { - await page.locator('#settings-btn').click() - const privacyPromise = page.waitForEvent('popup') - await page.locator("#privacy-link").click() - const privacyPage = await privacyPromise - await expect(privacyPage).toHaveTitle("Eclipse Foundation Website Privacy Policy | The Eclipse Foundation") - await expect(privacyPage).toHaveURL("https://www.eclipse.org/legal/privacy.php") - }) +// test("Cancel YAML conversion", async ({ page }) => { +// const editorTabs = page.locator("#tab") +// const editors = page.locator(".editor") +// await expect(editorTabs).toHaveCount(1) +// await expect(editors).toHaveCount(1) - test("Check terms of use footer link", async ({ page }) => { - await page.locator('#settings-btn').click() - const termsPromise = page.waitForEvent('popup') - await page.locator("#terms-link").click() - const termsPage = await termsPromise - await expect(termsPage).toHaveTitle("Eclipse.org Terms of Use | The Eclipse Foundation") - await expect(termsPage).toHaveURL("https://www.eclipse.org/legal/termsofuse.php") - }) +// const jsonYamlPopup = page.locator('.json-yaml-warning') +// const initialEditor = page.locator("#editor1") +// const jsonBtn = page.locator('#file-type-json') +// const yamlBtn = page.locator('#file-type-yaml') - test("Check copyright agent footer link", async ({ page }) => { - await page.locator('#settings-btn').click() - const copyrightPromise = page.waitForEvent('popup') - await page.locator("#copyright-link").click() - const copyrightPage = await copyrightPromise - await expect(copyrightPage).toHaveTitle("Copyright Agent | The Eclipse Foundation") - await expect(copyrightPage).toHaveURL("https://www.eclipse.org/legal/copyright.php") - }) +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) - test("Check legal footer link", async ({ page }) => { - await page.locator('#settings-btn').click() - const legalPromise = page.waitForEvent('popup') - await page.locator("#legal-link").click() - const legalPage = await legalPromise - await expect(legalPage).toHaveTitle("Eclipse Foundation Legal Resources | The Eclipse Foundation") - await expect(legalPage).toHaveURL("https://www.eclipse.org/legal/") - }) -}) +// await yamlBtn.click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") -test.describe("Editors and Tabs creation and deletion", () => { - test("Adding a new editor and closing it", async ({ page }) => { - const editorTabs = page.locator("#tab") - const editors = page.locator(".editor") - await expect(editorTabs).toHaveCount(1) - await expect(editors).toHaveCount(1) +// await page.locator('#yaml-cancel-btn').click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) +// }) +// }) - const initialTab = page.locator("#tab").nth(0) - await expect(initialTab).toHaveAttribute('data-tab-id', "1") - await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") - await expect(initialTab).toHaveClass("active") - const initialEditor = page.locator("#editor1") - await expect(initialEditor).toHaveAttribute('data-ide-id', "1") - await expect(initialEditor).toHaveClass("editor active") +// test.describe("Examples menu functionality", () => { +// test("Open and close examples menu", async ({ page }) => { - await page.locator("#ide-tab-add").click() - await expect(editorTabs).toHaveCount(2) - await expect(editors).toHaveCount(2) +// await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) +// await page.locator("#examples-btn").click() - await expect(initialTab).toHaveClass("") - await expect(initialEditor).toHaveClass("editor") +// await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: true }) +// await page.locator(".examples-menu-container__close > i").click() - const secondTab = page.locator("#tab").nth(1) - await expect(secondTab).toHaveAttribute('data-tab-id', "2") - await expect(secondTab).toHaveText("TDThing TemplateCloseCancel") - await expect(secondTab).toHaveClass("active") +// await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) +// }) - const secondEditor = page.locator("#editor2") - await expect(secondEditor).toHaveAttribute('data-ide-id', "2") - await expect(secondEditor).toHaveClass("editor active") +// test("Open Basic TD from quick access", async ({ page }) => { - await page.locator("#tab").nth(1).locator(".close-tab").click() - await page.locator('#tab').nth(1).locator(".confirm-btns > .confirm-tab-close").click() +// await page.locator("#examples-btn").click() - await expect(editorTabs).toHaveCount(1) - await expect(editors).toHaveCount(1) +// const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) +// await expect(basicExample).toHaveClass("example") - await expect(initialTab).toHaveClass("active") - await expect(initialEditor).toHaveClass("editor active") - }) - - test("Opening an example and closing initial editor", async ({ page }) => { - const editorTabs = page.locator("#tab") - const editors = page.locator(".editor") - await expect(editorTabs).toHaveCount(1) - await expect(editors).toHaveCount(1) - - const initialTab = page.locator("#tab").nth(0) - await expect(initialTab).toHaveAttribute('data-tab-id', "1") - await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") - await expect(initialTab).toHaveClass("active") - - const initialEditor = page.locator("#editor1") - await expect(initialEditor).toHaveAttribute('data-ide-id', "1") - await expect(initialEditor).toHaveClass("editor active") - - await page.locator("#examples-btn").click() - await page.locator(".example").nth(0).click() - await page.locator(".example").nth(0).getByRole("button", { name: /Apply/ }).click() - - await expect(editorTabs).toHaveCount(2) - await expect(editors).toHaveCount(2) - - await expect(initialTab).toHaveClass("") - await expect(initialEditor).toHaveClass("editor") +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) +// await quickAccessBtn.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveClass("editor active") +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveClass("editor active") - await page.locator("#tab").nth(0).locator(".close-tab").click() - await page.locator('#tab').nth(0).locator(".confirm-btns > .confirm-tab-close").click() +// }) - await expect(editorTabs).toHaveCount(1) - await expect(editors).toHaveCount(1) - }) -}) +// test("Open Basic TD from apply button", async ({ page }) => { -test.describe("JSON and YAML conversion", () => { - test("JSON to YAML and YAML to JSON", async ({ page }) => { - const editorTabs = page.locator("#tab") - const editors = page.locator(".editor") - await expect(editorTabs).toHaveCount(1) - await expect(editors).toHaveCount(1) - - const jsonYamlPopup = page.locator('.json-yaml-warning') - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - - const initialEditor = page.locator("#editor1") - const jsonBtn = page.locator('#file-type-json') - const yamlBtn = page.locator('#file-type-yaml') - - await expect(initialEditor).toHaveAttribute('data-mode-id', "json") - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) - - await yamlBtn.click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - - await page.locator('#yaml-confirm-btn').click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(initialEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(jsonBtn).toBeChecked({ checked: false }) - await expect(yamlBtn).toBeChecked({ checked: true }) - - await jsonBtn.click() - await expect(initialEditor).toHaveAttribute('data-mode-id', "json") - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) - }) +// await page.locator("#examples-btn").click() - test("Cancel YAML conversion", async ({ page }) => { - const editorTabs = page.locator("#tab") - const editors = page.locator(".editor") - await expect(editorTabs).toHaveCount(1) - await expect(editors).toHaveCount(1) - - const jsonYamlPopup = page.locator('.json-yaml-warning') - const initialEditor = page.locator("#editor1") - const jsonBtn = page.locator('#file-type-json') - const yamlBtn = page.locator('#file-type-yaml') - - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(initialEditor).toHaveAttribute('data-mode-id', "json") - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) - - await yamlBtn.click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - - await page.locator('#yaml-cancel-btn').click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(initialEditor).toHaveAttribute('data-mode-id', "json") - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) - }) -}) +// const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) +// await basicExample.click() +// await expect(basicExample).toHaveClass("example open") +// const applyBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Apply" }) +// await applyBtn.click() +// await expect(basicExample).toHaveClass("example") -test.describe("Examples menu functionality", () => { - test("Open and close examples menu", async ({ page }) => { +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) - await page.locator("#examples-btn").click() +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveClass("editor active") +// }) - await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: true }) - await page.locator(".examples-menu-container__close > i").click() +// test("Open Basic TD and close with cancel button", async ({ page }) => { +// await page.locator("#examples-btn").click() - await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) - }) +// const basicTDExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) +// await basicTDExample.click() +// await expect(basicTDExample).toHaveClass("example open") - test("Open Basic TD from quick access", async ({ page }) => { +// const cancelBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Cancel" }) +// await cancelBtn.click() +// await expect(basicTDExample).toHaveClass("example") +// }) - await page.locator("#examples-btn").click() +// test("Toggle between TD and TM examples", async ({ page }) => { +// await page.locator("#examples-btn").click() - const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) - await expect(basicExample).toHaveClass("example") +// const thingTypeToggle = page.locator('#thing-type-btn') +// await expect(thingTypeToggle).toBeChecked({ checked: false }) - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) - await quickAccessBtn.click() +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) +// }) - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// test("Open Basic TM and check for icon change in tab", async ({ page }) => { +// await page.locator("#examples-btn").click() - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveClass("editor active") +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - }) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - test("Open Basic TD from apply button", async ({ page }) => { +// const tabIcon = page.locator("#tab").nth(1).locator(".tab-icon") +// await expect(tabIcon).toHaveText("TM") +// }) - await page.locator("#examples-btn").click() +// test("Go to versioning in TD category and open example from quick access", async ({ page }) => { +// await page.locator("#examples-btn").click() - const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) - await basicExample.click() - await expect(basicExample).toHaveClass("example open") - - const applyBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Apply" }) - await applyBtn.click() - await expect(basicExample).toHaveClass("example") - - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") - - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveClass("editor active") - }) - - test("Open Basic TD and close with cancel button", async ({ page }) => { - await page.locator("#examples-btn").click() - - const basicTDExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) - await basicTDExample.click() - await expect(basicTDExample).toHaveClass("example open") - - const cancelBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Cancel" }) - await cancelBtn.click() - await expect(basicTDExample).toHaveClass("example") - }) - - test("Toggle between TD and TM examples", async ({ page }) => { - await page.locator("#examples-btn").click() - - const thingTypeToggle = page.locator('#thing-type-btn') - await expect(thingTypeToggle).toBeChecked({ checked: false }) - - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) - }) - - test("Open Basic TM and check for icon change in tab", async ({ page }) => { - await page.locator("#examples-btn").click() - - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) - - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() - - const tabIcon = page.locator("#tab").nth(1).locator(".tab-icon") - await expect(tabIcon).toHaveText("TM") - }) - - test("Go to versioning in TD category and open example from quick access", async ({ page }) => { - await page.locator("#examples-btn").click() - - const categoryDropDown = page.locator("#thing-category") - await categoryDropDown.selectOption('9-versioning') - - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Versioning' }).nth(0).getByRole("button").nth(0) - await quickAccessBtn.click() - - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") - }) - - test("Go to Tm Optional in TM category and open example from quick access", async ({ page }) => { - await page.locator("#examples-btn").click() - - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) - - const categoryDropDown = page.locator("#thing-category") - await categoryDropDown.selectOption('4-tm-optional') - - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Optional Interaction Affordances' }).nth(0).getByRole("button").nth(0) - await quickAccessBtn.click() - - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") - await expect(exampleTab).toHaveClass("active") - }) +// const categoryDropDown = page.locator("#thing-category") +// await categoryDropDown.selectOption('9-versioning') - test("Search for uriVariable in the TDs and open Combined URI variables in href example", async ({ page }) => { - await page.locator("#examples-btn").click() +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Versioning' }).nth(0).getByRole("button").nth(0) +// await quickAccessBtn.click() - const searchInput = page.locator(".search-input") - searchInput.fill('uriVariables') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") +// }) - const searchBtn = page.locator(".search-btn") - await searchBtn.click() +// test("Go to Tm Optional in TM category and open example from quick access", async ({ page }) => { +// await page.locator("#examples-btn").click() - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Combined URI variables in href' }).nth(0).getByRole("button").nth(0) - await quickAccessBtn.click() +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyWeatherThingCloseCancel") - await expect(exampleTab).toHaveClass("active") - }) +// const categoryDropDown = page.locator("#thing-category") +// await categoryDropDown.selectOption('4-tm-optional') - test("Search for overwrite in the TMs and open Overwrite Existing Definitions example", async ({ page }) => { - await page.locator("#examples-btn").click() +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Optional Interaction Affordances' }).nth(0).getByRole("button").nth(0) +// await quickAccessBtn.click() - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") +// }) - const searchInput = page.locator(".search-input") - searchInput.fill('overwrite') +// test("Search for uriVariable in the TDs and open Combined URI variables in href example", async ({ page }) => { +// await page.locator("#examples-btn").click() - const searchBtn = page.locator(".search-btn") - await searchBtn.click() +// const searchInput = page.locator(".search-input") +// searchInput.fill('uriVariables') - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Overwrite Existing Definitions' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// const searchBtn = page.locator(".search-btn") +// await searchBtn.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMSmart Lamp ControlCloseCancel") - await expect(exampleTab).toHaveClass("active") - }) -}) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Combined URI variables in href' }).nth(0).getByRole("button").nth(0) +// await quickAccessBtn.click() -test.describe("Save menu functionality", () => { - test("Open and close save menu", async ({ page }) => { - const saveMenu = page.locator(".save-menu") - await expect(saveMenu).toHaveClass("save-menu closed") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyWeatherThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") +// }) - await page.locator("#save-btn").click() - await expect(saveMenu).toHaveClass("save-menu") +// test("Search for overwrite in the TMs and open Overwrite Existing Definitions example", async ({ page }) => { +// await page.locator("#examples-btn").click() - const closeMenu = page.locator(".save-menu-close > i") - await closeMenu.click() - await expect(saveMenu).toHaveClass("save-menu closed") - }) +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - test("Open save menu with template thing and check for TD in menu title", async ({ page }) => { - const saveMenu = page.locator(".save-menu") +// const searchInput = page.locator(".search-input") +// searchInput.fill('overwrite') - await page.locator("#save-btn").click() - await expect(saveMenu).toHaveClass("save-menu") +// const searchBtn = page.locator(".search-btn") +// await searchBtn.click() - const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") - await expect(titleThingType).toHaveText("TD") - }) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Overwrite Existing Definitions' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - test("Open TM examples check for TM in the save menu title", async ({ page }) => { - await page.locator("#examples-btn").click() +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMSmart Lamp ControlCloseCancel") +// await expect(exampleTab).toHaveClass("active") +// }) +// }) - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// test.describe("Save menu functionality", () => { +// test("Open and close save menu", async ({ page }) => { +// const saveMenu = page.locator(".save-menu") +// await expect(saveMenu).toHaveClass("save-menu closed") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// await page.locator("#save-btn").click() +// await expect(saveMenu).toHaveClass("save-menu") - const saveMenu = page.locator(".save-menu") +// const closeMenu = page.locator(".save-menu-close > i") +// await closeMenu.click() +// await expect(saveMenu).toHaveClass("save-menu closed") +// }) - await page.locator("#save-btn").click() - await expect(saveMenu).toHaveClass("save-menu") +// test("Open save menu with template thing and check for TD in menu title", async ({ page }) => { +// const saveMenu = page.locator(".save-menu") - const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") - await expect(titleThingType).toHaveText("TM") - }) +// await page.locator("#save-btn").click() +// await expect(saveMenu).toHaveClass("save-menu") - test("Share and open in new tab functionality with an example", async ({ page }) => { +// const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") +// await expect(titleThingType).toHaveText("TD") +// }) - await page.locator("#examples-btn").click() +// test("Open TM examples check for TM in the save menu title", async ({ page }) => { +// await page.locator("#examples-btn").click() - const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) - await expect(basicExample).toHaveClass("example") +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) - await quickAccessBtn.click() +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// const saveMenu = page.locator(".save-menu") - const saveMenu = page.locator(".save-menu") +// await page.locator("#save-btn").click() +// await expect(saveMenu).toHaveClass("save-menu") - await page.locator("#save-btn").click() - await expect(saveMenu).toHaveClass("save-menu") +// const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") +// await expect(titleThingType).toHaveText("TM") +// }) - const openNewTab = page.locator("#open-url-tab") - await expect(openNewTab).toBeDisabled() +// test("Share and open in new tab functionality with an example", async ({ page }) => { - const shareUrlInput = page.locator("#share-url-input") - await expect(shareUrlInput).toHaveText("") +// await page.locator("#examples-btn").click() - const shareUrlBtn = page.locator("#share-url-btn") - await shareUrlBtn.click() +// const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) +// await expect(basicExample).toHaveClass("example") - const newPlaygroundPromise = page.waitForEvent('popup') - await openNewTab.click() - const newPlaygroundPage = await newPlaygroundPromise +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(newPlaygroundPage).toHaveTitle("TD Playground") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const newPlaygroundTab = newPlaygroundPage.locator("#tab").nth(0) - await expect(newPlaygroundTab).toHaveAttribute('data-tab-id', "1") - await expect(newPlaygroundTab).toHaveText("TDMyLampThingCloseCancel") - await expect(newPlaygroundTab).toHaveClass("active") +// const saveMenu = page.locator(".save-menu") - }) +// await page.locator("#save-btn").click() +// await expect(saveMenu).toHaveClass("save-menu") - test("Open in ediTDor functionality", async ({ page }) => { - const saveMenu = page.locator(".save-menu") +// const openNewTab = page.locator("#open-url-tab") +// await expect(openNewTab).toBeDisabled() - await page.locator("#save-btn").click() - await expect(saveMenu).toHaveClass("save-menu") +// const shareUrlInput = page.locator("#share-url-input") +// await expect(shareUrlInput).toHaveText("") - const shareUrlInput = page.locator("#share-url-input") - await expect(shareUrlInput).toHaveText("") +// const shareUrlBtn = page.locator("#share-url-btn") +// await shareUrlBtn.click() - const openEditdorBtn = page.locator("#open-editdor-btn") +// const newPlaygroundPromise = page.waitForEvent('popup') +// await openNewTab.click() +// const newPlaygroundPage = await newPlaygroundPromise - const editdorPromise = page.waitForEvent('popup') - await openEditdorBtn.click() - const editdorPage = await editdorPromise +// await expect(newPlaygroundPage).toHaveTitle("TD Playground") - await expect(editdorPage).toHaveTitle("ediTDor") +// const newPlaygroundTab = newPlaygroundPage.locator("#tab").nth(0) +// await expect(newPlaygroundTab).toHaveAttribute('data-tab-id', "1") +// await expect(newPlaygroundTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(newPlaygroundTab).toHaveClass("active") - const linkedTd = editdorPage.locator("#linkedTd > option") - await expect(linkedTd).toHaveText("Thing Template") - }) +// }) - test("Download functionality", async ({ page }) => { - const saveMenu = page.locator(".save-menu") +// test("Open in ediTDor functionality", async ({ page }) => { +// const saveMenu = page.locator(".save-menu") - const exampleTab = page.locator("#tab").nth(0) - await expect(exampleTab).toHaveAttribute('data-tab-id', "1") - await expect(exampleTab).toHaveText("TDThing TemplateCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await page.locator("#save-btn").click() +// await expect(saveMenu).toHaveClass("save-menu") - await page.locator("#save-btn").click() - await expect(saveMenu).toHaveClass("save-menu") +// const shareUrlInput = page.locator("#share-url-input") +// await expect(shareUrlInput).toHaveText("") - const downloadTdBtn = page.locator(".save-td__download") +// const openEditdorBtn = page.locator("#open-editdor-btn") - // Start waiting for download before clicking. - const downloadPromise = page.waitForEvent('download') - await downloadTdBtn.click() - const download = await downloadPromise - const expectedFilename = 'Thing-Template.json' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// const editdorPromise = page.waitForEvent('popup') +// await openEditdorBtn.click() +// const editdorPage = await editdorPromise - //* The "Save as" functionality cannot be tested because it requires to open and interact with the file system wich Playwright cannot do -}) +// await expect(editdorPage).toHaveTitle("ediTDor") -test.describe("Settings menu functionality", () => { - test("Opening and closing the settings menu", async ({ page }) => { - const settingsMenu = page.locator(".settings-menu") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// const linkedTd = editdorPage.locator("#linkedTd > option") +// await expect(linkedTd).toHaveText("Thing Template") +// }) - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// test("Download functionality", async ({ page }) => { +// const saveMenu = page.locator(".save-menu") - const closeMenu = page.locator(".settings__close > i") - await closeMenu.click() - await expect(settingsMenu).toHaveClass("settings-menu closed") - }) +// const exampleTab = page.locator("#tab").nth(0) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "1") +// await expect(exampleTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(exampleTab).toHaveClass("active") - test("Checking settings toggle buttons", async ({ page }) => { - const settingsMenu = page.locator(".settings-menu") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// await page.locator("#save-btn").click() +// await expect(saveMenu).toHaveClass("save-menu") - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// const downloadTdBtn = page.locator(".save-td__download") - const autoValidate = page.locator("#auto-validate") - const validateJsonld = page.locator("#validate-jsonld") - const tmConformance = page.locator("#tm-conformance") +// // Start waiting for download before clicking. +// const downloadPromise = page.waitForEvent('download') +// await downloadTdBtn.click() +// const download = await downloadPromise +// const expectedFilename = 'Thing-Template.json' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - await expect(autoValidate).toBeChecked({ checked: false }) - await expect(validateJsonld).toBeChecked({ checked: true }) - await expect(tmConformance).toBeChecked({ checked: true }) - }) +// //* The "Save as" functionality cannot be tested because it requires to open and interact with the file system wich Playwright cannot do +// }) - test("Changing page theme", async ({ page }) => { - const playgroundSite = page.locator("html") - await expect(playgroundSite).toHaveClass("light-mode") +// test.describe("Settings menu functionality", () => { +// test("Opening and closing the settings menu", async ({ page }) => { +// const settingsMenu = page.locator(".settings-menu") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - const settingsMenu = page.locator(".settings-menu") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// const closeMenu = page.locator(".settings__close > i") +// await closeMenu.click() +// await expect(settingsMenu).toHaveClass("settings-menu closed") +// }) - const themePicker = page.locator("#theme-picker") - await themePicker.selectOption('monochrome-mode') - await expect(playgroundSite).toHaveClass("monochrome-mode") +// test("Checking settings toggle buttons", async ({ page }) => { +// const settingsMenu = page.locator(".settings-menu") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - await themePicker.selectOption('dark-mode') - await expect(playgroundSite).toHaveClass("dark-mode") +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - await page.reload({ waitUntil: 'domcontentloaded' }) - await expect(playgroundSite).toHaveClass("dark-mode") - }) +// const autoValidate = page.locator("#auto-validate") +// const validateJsonld = page.locator("#validate-jsonld") +// const tmConformance = page.locator("#tm-conformance") - test("Changing font size", async ({ page }) => { - const settingsMenu = page.locator(".settings-menu") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// await expect(autoValidate).toBeChecked({ checked: false }) +// await expect(validateJsonld).toBeChecked({ checked: true }) +// await expect(tmConformance).toBeChecked({ checked: true }) +// }) - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// test("Changing page theme", async ({ page }) => { +// const playgroundSite = page.locator("html") +// await expect(playgroundSite).toHaveClass("light-mode") - const editorFontSize = page.locator(".editor-font-size") - await expect(editorFontSize).toHaveText("14") +// const settingsMenu = page.locator(".settings-menu") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - const fontSizeSlider = page.locator('#font-size') - await fontSizeSlider.click() +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - await expect(editorFontSize).toHaveText("23") +// const themePicker = page.locator("#theme-picker") +// await themePicker.selectOption('monochrome-mode') +// await expect(playgroundSite).toHaveClass("monochrome-mode") - await page.reload({ waitUntil: 'domcontentloaded' }) +// await themePicker.selectOption('dark-mode') +// await expect(playgroundSite).toHaveClass("dark-mode") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// await page.reload({ waitUntil: 'domcontentloaded' }) +// await expect(playgroundSite).toHaveClass("dark-mode") +// }) - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// test("Changing font size", async ({ page }) => { +// const settingsMenu = page.locator(".settings-menu") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - await expect(editorFontSize).toHaveText("23") - }) +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - test("Utilizing default settings", async ({ page }) => { - const playgroundSite = page.locator("html") - await expect(playgroundSite).toHaveClass("light-mode") +// const editorFontSize = page.locator(".editor-font-size") +// await expect(editorFontSize).toHaveText("14") - const settingsMenu = page.locator(".settings-menu") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// const fontSizeSlider = page.locator('#font-size') +// await fontSizeSlider.click() - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// await expect(editorFontSize).toHaveText("23") - const themePicker = page.locator("#theme-picker") - await themePicker.selectOption('dark-mode') - await expect(playgroundSite).toHaveClass("dark-mode") +// await page.reload({ waitUntil: 'domcontentloaded' }) - const editorFontSize = page.locator(".editor-font-size") - await expect(editorFontSize).toHaveText("14") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - const fontSizeSlider = page.locator('#font-size') - await fontSizeSlider.click() +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - await expect(editorFontSize).toHaveText("23") +// await expect(editorFontSize).toHaveText("23") +// }) - await page.reload({ waitUntil: 'domcontentloaded' }) +// test("Utilizing default settings", async ({ page }) => { +// const playgroundSite = page.locator("html") +// await expect(playgroundSite).toHaveClass("light-mode") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// const settingsMenu = page.locator(".settings-menu") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - await expect(playgroundSite).toHaveClass("dark-mode") - await expect(editorFontSize).toHaveText("23") +// const themePicker = page.locator("#theme-picker") +// await themePicker.selectOption('dark-mode') +// await expect(playgroundSite).toHaveClass("dark-mode") - const resetSettings = page.locator('.reset-settings') - await resetSettings.click() +// const editorFontSize = page.locator(".editor-font-size") +// await expect(editorFontSize).toHaveText("14") - await expect(playgroundSite).toHaveClass("light-mode") - await expect(editorFontSize).toHaveText("14") +// const fontSizeSlider = page.locator('#font-size') +// await fontSizeSlider.click() - await page.reload({ waitUntil: 'domcontentloaded' }) +// await expect(editorFontSize).toHaveText("23") - await expect(settingsMenu).toHaveClass("settings-menu closed") +// await page.reload({ waitUntil: 'domcontentloaded' }) - await page.locator("#settings-btn").click() - await expect(settingsMenu).toHaveClass("settings-menu") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - await expect(playgroundSite).toHaveClass("light-mode") - await expect(editorFontSize).toHaveText("14") - }) -}) +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") -test.describe("Validation view functionality", () => { +// await expect(playgroundSite).toHaveClass("dark-mode") +// await expect(editorFontSize).toHaveText("23") - test("Starting the validation with the main validation button", async ({ page }) => { +// const resetSettings = page.locator('.reset-settings') +// await resetSettings.click() - const validationTab = page.locator('#validation-tab') - const validationView = page.locator('#validation-view') +// await expect(playgroundSite).toHaveClass("light-mode") +// await expect(editorFontSize).toHaveText("14") - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// await page.reload({ waitUntil: 'domcontentloaded' }) - const stateIcon = page.locator(".json-validation-section > .section-header > i").nth(0) - await expect(stateIcon).toHaveClass("fa-solid fa-circle") +// await expect(settingsMenu).toHaveClass("settings-menu closed") - const validationBtn = page.locator("#validate-btn") - await validationBtn.click() +// await page.locator("#settings-btn").click() +// await expect(settingsMenu).toHaveClass("settings-menu") - //TODO: Find a better way to wait for this event to happen - await page.waitForTimeout(5000) - await expect(stateIcon).toHaveClass("fa-solid fa-circle-check") - }) +// await expect(playgroundSite).toHaveClass("light-mode") +// await expect(editorFontSize).toHaveText("14") +// }) +// }) - test("Validating the 'All Defaults TD'", async ({ page }) => { - const validationTab = page.locator('#validation-tab') - const validationView = page.locator('#validation-view') +// test.describe("Validation view functionality", () => { - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// test("Starting the validation with the main validation button", async ({ page }) => { - await page.locator("#examples-btn").click() +// const validationTab = page.locator('#validation-tab') +// const validationView = page.locator('#validation-view') - const quickAccessBtn = page.locator(".example").filter({ hasText: 'All Default Values' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// const stateIcon = page.locator(".json-validation-section > .section-header > i").nth(0) +// await expect(stateIcon).toHaveClass("fa-solid fa-circle") - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// const validationBtn = page.locator("#validate-btn") +// await validationBtn.click() - const validationBtn = page.locator("#validate-btn") - await validationBtn.click() +// //TODO: Find a better way to wait for this event to happen +// await page.waitForTimeout(5000) +// await expect(stateIcon).toHaveClass("fa-solid fa-circle-check") +// }) - //validation section - const jsonValidationSection = page.locator(".json-validation-section") - const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) - const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") +// test("Validating the 'All Defaults TD'", async ({ page }) => { +// const validationTab = page.locator('#validation-tab') +// const validationView = page.locator('#validation-view') - await jsonValidationSection.click() - await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") - const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) - const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") +// await page.locator("#examples-btn").click() - await jsonSchemaValidationSection.click() - await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'All Default Values' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") - const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) - const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - await jsonSchemaDefaultsSection.click() - await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Validated Successfully") - await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-check") +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - const jsonlsValidationSection = page.locator(".jsonls-validation-section") - const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) - const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") +// const validationBtn = page.locator("#validate-btn") +// await validationBtn.click() - await jsonlsValidationSection.click() - await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// //validation section +// const jsonValidationSection = page.locator(".json-validation-section") +// const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) +// const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") - const additionalChecksSection = page.locator(".additional-checks-section") - const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) - const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") +// await jsonValidationSection.click() +// await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - await additionalChecksSection.click() - await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") - await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") - }) +// const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") +// const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) +// const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") - test("Validating the 'Basic TD'", async ({ page }) => { - const validationTab = page.locator('#validation-tab') - const validationView = page.locator('#validation-view') +// await jsonSchemaValidationSection.click() +// await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") +// const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) +// const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li") - await page.locator("#examples-btn").click() +// await jsonSchemaDefaultsSection.click() +// await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-check") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const jsonlsValidationSection = page.locator(".jsonls-validation-section") +// const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) +// const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await jsonlsValidationSection.click() +// await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// const additionalChecksSection = page.locator(".additional-checks-section") +// const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) +// const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") - const validationBtn = page.locator("#validate-btn") - await validationBtn.click() +// await additionalChecksSection.click() +// await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") +// await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") +// }) - //Validation section - const jsonValidationSection = page.locator(".json-validation-section") - const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) - const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") +// test("Validating the 'Basic TD'", async ({ page }) => { +// const validationTab = page.locator('#validation-tab') +// const validationView = page.locator('#validation-view') - await jsonValidationSection.click() - await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") - const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) - const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") +// await page.locator("#examples-btn").click() - await jsonSchemaValidationSection.click() - await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") - const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) - const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - await jsonSchemaDefaultsSection.click() - await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Optional validation failed:") - await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-exclamation") +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - const jsonlsValidationSection = page.locator(".jsonls-validation-section") - const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) - const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") +// const validationBtn = page.locator("#validate-btn") +// await validationBtn.click() - await jsonlsValidationSection.click() - await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// //Validation section +// const jsonValidationSection = page.locator(".json-validation-section") +// const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) +// const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") - const additionalChecksSection = page.locator(".additional-checks-section") - const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) - const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") +// await jsonValidationSection.click() +// await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - await additionalChecksSection.click() - await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") - await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") - }) +// const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") +// const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) +// const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") - test("Validating the 'Basic TM'", async ({ page }) => { +// await jsonSchemaValidationSection.click() +// await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - const validationTab = page.locator('#validation-tab') - const validationView = page.locator('#validation-view') +// const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") +// const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) +// const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// await jsonSchemaDefaultsSection.click() +// await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Optional validation failed:") +// await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-exclamation") - await page.locator("#examples-btn").click() +// const jsonlsValidationSection = page.locator(".jsonls-validation-section") +// const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) +// const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// await jsonlsValidationSection.click() +// await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// const additionalChecksSection = page.locator(".additional-checks-section") +// const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) +// const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await additionalChecksSection.click() +// await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") +// await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") +// }) - await expect(validationTab).toBeChecked() - await expect(validationView).toHaveClass("console-view validation-view") +// test("Validating the 'Basic TM'", async ({ page }) => { - const validationBtn = page.locator("#validate-btn") - await validationBtn.click() +// const validationTab = page.locator('#validation-tab') +// const validationView = page.locator('#validation-view') - //Validation section - const jsonValidationSection = page.locator(".json-validation-section") - const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) - const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - await jsonValidationSection.click() - await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// await page.locator("#examples-btn").click() - const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") - const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) - const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - await jsonSchemaValidationSection.click() - await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") - const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) - const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - await jsonSchemaDefaultsSection.click() - await expect(jsonSchemaDefaultsSectionTxt).toHaveText("A previous validation has failed or it is only available for Thing Descriptions") - await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle") +// await expect(validationTab).toBeChecked() +// await expect(validationView).toHaveClass("console-view validation-view") - const jsonlsValidationSection = page.locator(".jsonls-validation-section") - const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) - const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") +// const validationBtn = page.locator("#validate-btn") +// await validationBtn.click() - await jsonlsValidationSection.click() - await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") +// //Validation section +// const jsonValidationSection = page.locator(".json-validation-section") +// const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) +// const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") - const additionalChecksSection = page.locator(".additional-checks-section") - const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) - const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") +// await jsonValidationSection.click() +// await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - await additionalChecksSection.click() - await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") - await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") - }) +// const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") +// const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) +// const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") -}) +// await jsonSchemaValidationSection.click() +// await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -test.describe("OpenAPI view functionality", () => { - test("Trying to open the OpenAPI view with a TD with no protocols", async ({ page }) => { +// const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") +// const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) +// const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) - const initialTab = page.locator("#tab").nth(0) - await expect(initialTab).toHaveAttribute('data-tab-id', "1") - await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") - await expect(initialTab).toHaveClass("active") +// await jsonSchemaDefaultsSection.click() +// await expect(jsonSchemaDefaultsSectionTxt).toHaveText("A previous validation has failed or it is only available for Thing Descriptions") +// await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle") - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// const jsonlsValidationSection = page.locator(".jsonls-validation-section") +// const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) +// const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) +// await jsonlsValidationSection.click() +// await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") +// await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") - await openAPITab.click() +// const additionalChecksSection = page.locator(".additional-checks-section") +// const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) +// const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses HTTP!") - }) +// await additionalChecksSection.click() +// await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") +// await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") +// }) - test("Trying to open the OpenAPI view with a TM", async ({ page }) => { +// }) - await page.locator("#examples-btn").click() +// test.describe("OpenAPI view functionality", () => { +// test("Trying to open the OpenAPI view with a TD with no protocols", async ({ page }) => { - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// const initialTab = page.locator("#tab").nth(0) +// await expect(initialTab).toHaveAttribute('data-tab-id', "1") +// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(initialTab).toHaveClass("active") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// await openAPITab.click() - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses HTTP!") +// }) - await openAPITab.click() +// test("Trying to open the OpenAPI view with a TM", async ({ page }) => { - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") +// await page.locator("#examples-btn").click() - }) +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - test("Open the OpenAPI view with the 'Basic TD' example", async ({ page }) => { - await page.locator("#examples-btn").click() +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// await openAPITab.click() - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") - await openAPITab.click() +// }) - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the OpenAPI view with the 'Basic TD' example", async ({ page }) => { +// await page.locator("#examples-btn").click() - const openAPIEditor = page.locator('#open-api-container') - const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") - await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const openAPIJsonBtn = page.locator('#open-api-json') +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(openAPIJsonBtn).toBeDisabled() +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - }) +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - test("Open the OpenAPI view with the 'Basic TD' example as YAML", async ({ page }) => { +// await openAPITab.click() - await page.locator("#examples-btn").click() +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const openAPIEditor = page.locator('#open-api-container') +// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") +// await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// const openAPIJsonBtn = page.locator('#open-api-json') +// await expect(openAPIJsonBtn).toBeDisabled() - const jsonYamlPopup = page.locator('.json-yaml-warning') - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// }) - const jsonBtn = page.locator('#file-type-json') - const yamlBtn = page.locator('#file-type-yaml') +// test("Open the OpenAPI view with the 'Basic TD' example as YAML", async ({ page }) => { - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) +// await page.locator("#examples-btn").click() - await yamlBtn.click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await page.locator('#yaml-confirm-btn').click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(jsonBtn).toBeChecked({ checked: false }) - await expect(yamlBtn).toBeChecked({ checked: true }) +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) - await openAPITab.click() +// const jsonYamlPopup = page.locator('.json-yaml-warning') +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// const jsonBtn = page.locator('#file-type-json') +// const yamlBtn = page.locator('#file-type-yaml') - const openAPIEditor = page.locator('#open-api-container') - const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: "3.0.3"' }).nth(4) +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(openAPIContainer).toHaveText('openapi: "3.0.3"') +// await yamlBtn.click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - const openAPIYamlBtn = page.locator('#open-api-yaml') - await expect(openAPIYamlBtn).toBeDisabled() +// await page.locator('#yaml-confirm-btn').click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(jsonBtn).toBeChecked({ checked: false }) +// await expect(yamlBtn).toBeChecked({ checked: true }) - }) +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - test("Open the OpenAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { - await page.locator("#examples-btn").click() +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// await openAPITab.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// const openAPIEditor = page.locator('#open-api-container') +// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: "3.0.3"' }).nth(4) - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(openAPIContainer).toHaveText('openapi: "3.0.3"') - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) +// const openAPIYamlBtn = page.locator('#open-api-yaml') +// await expect(openAPIYamlBtn).toBeDisabled() - await openAPITab.click() +// }) - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the OpenAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { +// await page.locator("#examples-btn").click() - const openAPIEditor = page.locator('#open-api-container') +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const openAPIJsonBtn = page.locator('#open-api-json') - const openAPIYamlBtn = page.locator('#open-api-yaml') +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(openAPIJsonBtn).toBeDisabled() +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - await openAPIYamlBtn.click() +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(openAPIYamlBtn).toBeDisabled() +// await openAPITab.click() - await openAPIJsonBtn.click() +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") - await expect(openAPIJsonBtn).toBeDisabled() - }) +// const openAPIEditor = page.locator('#open-api-container') - test("Open the OpenAPI view and downloading it as JSON", async ({ page }) => { - await page.locator("#examples-btn").click() +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const openAPIJsonBtn = page.locator('#open-api-json') +// const openAPIYamlBtn = page.locator('#open-api-yaml') - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(openAPIJsonBtn).toBeDisabled() - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// await openAPIYamlBtn.click() - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(openAPIYamlBtn).toBeDisabled() - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) +// await openAPIJsonBtn.click() - await openAPITab.click() +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") +// await expect(openAPIJsonBtn).toBeDisabled() +// }) - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the OpenAPI view and downloading it as JSON", async ({ page }) => { +// await page.locator("#examples-btn").click() - const openAPIEditor = page.locator('#open-api-container') - const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") - await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const openAPIJsonBtn = page.locator('#open-api-json') - await expect(openAPIJsonBtn).toBeDisabled() +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - // Start waiting for download before clicking. - const openAPIDownload = page.locator('#open-api-download') - const downloadPromise = page.waitForEvent('download') - await openAPIDownload.click() - const download = await downloadPromise - const expectedFilename = 'MyLampThing-OpenAPI.json' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { - await page.locator("#examples-btn").click() +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// await openAPITab.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// const openAPIEditor = page.locator('#open-api-container') +// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) - const openAPIView = page.locator('#open-api-view') - const consoleError = page.locator('#console-error') - const openAPITab = page.locator("#open-api-tab") +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") +// await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') - await expect(openAPIView).toHaveClass("console-view open-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(openAPITab).toBeChecked({ checked: false }) +// const openAPIJsonBtn = page.locator('#open-api-json') +// await expect(openAPIJsonBtn).toBeDisabled() - await openAPITab.click() +// // Start waiting for download before clicking. +// const openAPIDownload = page.locator('#open-api-download') +// const downloadPromise = page.waitForEvent('download') +// await openAPIDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'MyLampThing-OpenAPI.json' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - await expect(openAPITab).toBeChecked({ checked: true }) - await expect(openAPIView).toHaveClass("console-view open-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { +// await page.locator("#examples-btn").click() - const openAPIEditor = page.locator('#open-api-container') +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const openAPIJsonBtn = page.locator('#open-api-json') - const openAPIYamlBtn = page.locator('#open-api-yaml') +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(openAPIJsonBtn).toBeDisabled() +// const openAPIView = page.locator('#open-api-view') +// const consoleError = page.locator('#console-error') +// const openAPITab = page.locator("#open-api-tab") - await openAPIYamlBtn.click() +// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(openAPITab).toBeChecked({ checked: false }) - await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(openAPIYamlBtn).toBeDisabled() +// await openAPITab.click() - const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: 3.0.3' }).nth(4) - await expect(openAPIContainer).toHaveText('openapi: 3.0.3') +// await expect(openAPITab).toBeChecked({ checked: true }) +// await expect(openAPIView).toHaveClass("console-view open-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - // Start waiting for download before clicking. - const openAPIDownload = page.locator('#open-api-download') - const downloadPromise = page.waitForEvent('download') - await openAPIDownload.click() - const download = await downloadPromise - const expectedFilename = 'MyLampThing-OpenAPI.yaml' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) -}) +// const openAPIEditor = page.locator('#open-api-container') -test.describe("AsyncAPI view functionality", () => { - test("Trying to open the AsyncAPI view with a TD with no protocols", async ({ page }) => { +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") - const initialTab = page.locator("#tab").nth(0) - await expect(initialTab).toHaveAttribute('data-tab-id', "1") - await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") - await expect(initialTab).toHaveClass("active") +// const openAPIJsonBtn = page.locator('#open-api-json') +// const openAPIYamlBtn = page.locator('#open-api-yaml') - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// await expect(openAPIJsonBtn).toBeDisabled() - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) +// await openAPIYamlBtn.click() - await AsyncAPITab.click() +// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(openAPIYamlBtn).toBeDisabled() - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses MQTT!") - }) +// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: 3.0.3' }).nth(4) +// await expect(openAPIContainer).toHaveText('openapi: 3.0.3') - test("Trying to open the AsyncAPI view with a TM", async ({ page }) => { +// // Start waiting for download before clicking. +// const openAPIDownload = page.locator('#open-api-download') +// const downloadPromise = page.waitForEvent('download') +// await openAPIDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'MyLampThing-OpenAPI.yaml' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) +// }) - await page.locator("#examples-btn").click() +// test.describe("AsyncAPI view functionality", () => { +// test("Trying to open the AsyncAPI view with a TD with no protocols", async ({ page }) => { - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// const initialTab = page.locator("#tab").nth(0) +// await expect(initialTab).toHaveAttribute('data-tab-id', "1") +// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(initialTab).toHaveClass("active") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// await AsyncAPITab.click() - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses MQTT!") +// }) - await AsyncAPITab.click() +// test("Trying to open the AsyncAPI view with a TM", async ({ page }) => { - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") +// await page.locator("#examples-btn").click() - }) +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - /** - * TODO: Do to a lack of examples that include the mqtt protocol this cannot be tested, nonetheless once - * TODO: this is added the code below should sufice with minimal adjustments - test("Open the AsyncAPI view with the '---' example", async ({ page }) => { - await page.locator("#examples-btn").click() +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TD---CloseCancel") - await expect(exampleTab).toHaveClass("active") +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// await AsyncAPITab.click() - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") - await AsyncAPITab.click() +// }) - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// /** +// * TODO: Do to a lack of examples that include the mqtt protocol this cannot be tested, nonetheless once +// * TODO: this is added the code below should sufice with minimal adjustments +// test("Open the AsyncAPI view with the '---' example", async ({ page }) => { +// await page.locator("#examples-btn").click() - const AsyncAPIEditor = page.locator('#async-api-container') - const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: '"asyncapi": "2.0.0",' }).nth(4) +// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") - await expect(AsyncAPIContainer).toHaveText('"asyncapi": "2.0.0",') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TD---CloseCancel") +// await expect(exampleTab).toHaveClass("active") - const AsyncAPIJsonBtn = page.locator('#async-api-json') +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(AsyncAPIJsonBtn).toBeDisabled() +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - test("Open the AsyncAPI view with the '---' example as YAML", async ({ page }) => { +// await AsyncAPITab.click() - await page.locator("#examples-btn").click() +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const AsyncAPIEditor = page.locator('#async-api-container') +// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: '"asyncapi": "2.0.0",' }).nth(4) - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TD---CloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") +// await expect(AsyncAPIContainer).toHaveText('"asyncapi": "2.0.0",') - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// const AsyncAPIJsonBtn = page.locator('#async-api-json') +// await expect(AsyncAPIJsonBtn).toBeDisabled() - const jsonYamlPopup = page.locator('.json-yaml-warning') - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// }) - const jsonBtn = page.locator('#file-type-json') - const yamlBtn = page.locator('#file-type-yaml') +// test("Open the AsyncAPI view with the '---' example as YAML", async ({ page }) => { - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) +// await page.locator("#examples-btn").click() - await yamlBtn.click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") +// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await page.locator('#yaml-confirm-btn').click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(jsonBtn).toBeChecked({ checked: false }) - await expect(yamlBtn).toBeChecked({ checked: true }) +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TD---CloseCancel") +// await expect(exampleTab).toHaveClass("active") - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) - await AsyncAPITab.click() +// const jsonYamlPopup = page.locator('.json-yaml-warning') +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// const jsonBtn = page.locator('#file-type-json') +// const yamlBtn = page.locator('#file-type-yaml') - const AsyncAPIEditor = page.locator('#async-api-container') - const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: 'asyncapi: 2.0.0' }).nth(4) +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(AsyncAPIContainer).toHaveText('asyncapi: 2.0.0') +// await yamlBtn.click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - const AsyncAPIYamlBtn = page.locator('#async-api-yaml') - await expect(AsyncAPIYamlBtn).toBeDisabled() +// await page.locator('#yaml-confirm-btn').click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(jsonBtn).toBeChecked({ checked: false }) +// await expect(yamlBtn).toBeChecked({ checked: true }) - }) +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - test("Open the AsyncAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { - await page.locator("#examples-btn").click() +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// await AsyncAPITab.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TD---CloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// const AsyncAPIEditor = page.locator('#async-api-container') +// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: 'asyncapi: 2.0.0' }).nth(4) - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(AsyncAPIContainer).toHaveText('asyncapi: 2.0.0') - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) +// const AsyncAPIYamlBtn = page.locator('#async-api-yaml') +// await expect(AsyncAPIYamlBtn).toBeDisabled() - await AsyncAPITab.click() +// }) - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the AsyncAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { +// await page.locator("#examples-btn").click() - const AsyncAPIEditor = page.locator('#async-api-container') +// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TD---CloseCancel") +// await expect(exampleTab).toHaveClass("active") - const AsyncAPIJsonBtn = page.locator('#async-api-json') - const AsyncAPIYamlBtn = page.locator('#async-api-yaml') +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(AsyncAPIJsonBtn).toBeDisabled() +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - await AsyncAPIYamlBtn.click() +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(AsyncAPIYamlBtn).toBeDisabled() +// await AsyncAPITab.click() - await AsyncAPIJsonBtn.click() +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") - await expect(AsyncAPIJsonBtn).toBeDisabled() - }) +// const AsyncAPIEditor = page.locator('#async-api-container') - test("Open the AsyncAPI view and downloading it as JSON", async ({ page }) => { - await page.locator("#examples-btn").click() +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") - const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const AsyncAPIJsonBtn = page.locator('#async-api-json') +// const AsyncAPIYamlBtn = page.locator('#async-api-yaml') - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TD---CloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(AsyncAPIJsonBtn).toBeDisabled() - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// await AsyncAPIYamlBtn.click() - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(AsyncAPIYamlBtn).toBeDisabled() - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) +// await AsyncAPIJsonBtn.click() - await AsyncAPITab.click() +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") +// await expect(AsyncAPIJsonBtn).toBeDisabled() +// }) - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the AsyncAPI view and downloading it as JSON", async ({ page }) => { +// await page.locator("#examples-btn").click() - const AsyncAPIEditor = page.locator('#async-api-container') - const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: '"asyncapi": "2.0.0",' }).nth(4) +// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") - await expect(AsyncAPIContainer).toHaveText('\"asyncapi\": \"2.0.0\",') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TD---CloseCancel") +// await expect(exampleTab).toHaveClass("active") - const AsyncAPIJsonBtn = page.locator('#async-api-json') - await expect(AsyncAPIJsonBtn).toBeDisabled() +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - // Start waiting for download before clicking. - const AsyncAPIDownload = page.locator('#async-api-download') - const downloadPromise = page.waitForEvent('download') - await AsyncAPIDownload.click() - const download = await downloadPromise - const expectedFilename = 'MyLampThing-AsyncAPI.json' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - test("Open the AsyncAPI view and downloading it as YAML", async ({ page }) => { - await page.locator("#examples-btn").click() +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// await AsyncAPITab.click() - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TD---CloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// const AsyncAPIEditor = page.locator('#async-api-container') +// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: '"asyncapi": "2.0.0",' }).nth(4) - const AsyncAPIView = page.locator('#async-api-view') - const consoleError = page.locator('#console-error') - const AsyncAPITab = page.locator("#async-api-tab") +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") +// await expect(AsyncAPIContainer).toHaveText('\"asyncapi\": \"2.0.0\",') - await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AsyncAPITab).toBeChecked({ checked: false }) +// const AsyncAPIJsonBtn = page.locator('#async-api-json') +// await expect(AsyncAPIJsonBtn).toBeDisabled() - await AsyncAPITab.click() +// // Start waiting for download before clicking. +// const AsyncAPIDownload = page.locator('#async-api-download') +// const downloadPromise = page.waitForEvent('download') +// await AsyncAPIDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'MyLampThing-AsyncAPI.json' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - await expect(AsyncAPITab).toBeChecked({ checked: true }) - await expect(AsyncAPIView).toHaveClass("console-view async-api-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the AsyncAPI view and downloading it as YAML", async ({ page }) => { +// await page.locator("#examples-btn").click() - const AsyncAPIEditor = page.locator('#async-api-container') +// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TD---CloseCancel") +// await expect(exampleTab).toHaveClass("active") - const AsyncAPIJsonBtn = page.locator('#async-api-json') - const AsyncAPIYamlBtn = page.locator('#async-api-yaml') +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - await expect(AsyncAPIJsonBtn).toBeDisabled() +// const AsyncAPIView = page.locator('#async-api-view') +// const consoleError = page.locator('#console-error') +// const AsyncAPITab = page.locator("#async-api-tab") - await AsyncAPIYamlBtn.click() +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AsyncAPITab).toBeChecked({ checked: false }) - await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(AsyncAPIYamlBtn).toBeDisabled() +// await AsyncAPITab.click() - const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: 'asyncapi: 2.0.0' }).nth(4) - await expect(AsyncAPIContainer).toHaveText('asyncapi: 2.0.0') +// await expect(AsyncAPITab).toBeChecked({ checked: true }) +// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - // Start waiting for download before clicking. - const AsyncAPIDownload = page.locator('#async-api-download') - const downloadPromise = page.waitForEvent('download') - await AsyncAPIDownload.click() - const download = await downloadPromise - const expectedFilename = 'MyLampThing-AsyncAPI.yaml' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) - */ -}) +// const AsyncAPIEditor = page.locator('#async-api-container') +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") -test.describe("AAS AID view functionality", () => { +// const AsyncAPIJsonBtn = page.locator('#async-api-json') +// const AsyncAPIYamlBtn = page.locator('#async-api-yaml') - test("Trying to open the AAS view with a TM", async ({ page }) => { +// await expect(AsyncAPIJsonBtn).toBeDisabled() - await page.locator("#examples-btn").click() +// await AsyncAPIYamlBtn.click() - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(AsyncAPIYamlBtn).toBeDisabled() - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: 'asyncapi: 2.0.0' }).nth(4) +// await expect(AsyncAPIContainer).toHaveText('asyncapi: 2.0.0') - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// // Start waiting for download before clicking. +// const AsyncAPIDownload = page.locator('#async-api-download') +// const downloadPromise = page.waitForEvent('download') +// await AsyncAPIDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'MyLampThing-AsyncAPI.yaml' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) +// */ +// }) - const AASView = page.locator('#aas-view') - const consoleError = page.locator('#console-error') - const AASTab = page.locator("#aas-tab") - await expect(AASView).toHaveClass("console-view aas-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AASTab).toBeChecked({ checked: false }) +// test.describe("AAS AID view functionality", () => { - await AASTab.click() +// test("Trying to open the AAS view with a TM", async ({ page }) => { - await expect(AASTab).toBeChecked({ checked: true }) - await expect(AASView).toHaveClass("console-view aas-view hidden") - await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") +// await page.locator("#examples-btn").click() - }) +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - test("Open the AAS AID view with the 'Basic TD' example", async ({ page }) => { - await page.locator("#examples-btn").click() +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// const AASView = page.locator('#aas-view') +// const consoleError = page.locator('#console-error') +// const AASTab = page.locator("#aas-tab") - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// await expect(AASView).toHaveClass("console-view aas-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AASTab).toBeChecked({ checked: false }) - const AASView = page.locator('#aas-view') - const consoleError = page.locator('#console-error') - const AASTab = page.locator("#aas-tab") +// await AASTab.click() - await expect(AASView).toHaveClass("console-view aas-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AASTab).toBeChecked({ checked: false }) +// await expect(AASTab).toBeChecked({ checked: true }) +// await expect(AASView).toHaveClass("console-view aas-view hidden") +// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") - await AASTab.click() +// }) - await expect(AASTab).toBeChecked({ checked: true }) - await expect(AASView).toHaveClass("console-view aas-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the AAS AID view with the 'Basic TD' example", async ({ page }) => { +// await page.locator("#examples-btn").click() - const ASSEditor = page.locator('#aas-container') - const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") - await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - }) +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") - test("Open the AAS AID view with the 'Basic TD' example and downloading it", async ({ page }) => { - await page.locator("#examples-btn").click() +// const AASView = page.locator('#aas-view') +// const consoleError = page.locator('#console-error') +// const AASTab = page.locator("#aas-tab") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) - await quickAccessBtn.click() +// await expect(AASView).toHaveClass("console-view aas-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AASTab).toBeChecked({ checked: false }) - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await AASTab.click() - const exampleEditor = page.locator("#editor2") - await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") - await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") - await expect(exampleEditor).toHaveClass("editor active") +// await expect(AASTab).toBeChecked({ checked: true }) +// await expect(AASView).toHaveClass("console-view aas-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const AASView = page.locator('#aas-view') - const consoleError = page.locator('#console-error') - const AASTab = page.locator("#aas-tab") +// const ASSEditor = page.locator('#aas-container') +// const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) - await expect(AASView).toHaveClass("console-view aas-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(AASTab).toBeChecked({ checked: false }) +// await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") +// await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') - await AASTab.click() +// }) - await expect(AASTab).toBeChecked({ checked: true }) - await expect(AASView).toHaveClass("console-view aas-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// test("Open the AAS AID view with the 'Basic TD' example and downloading it", async ({ page }) => { +// await page.locator("#examples-btn").click() - const ASSEditor = page.locator('#aas-container') - const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) +// await quickAccessBtn.click() - await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") - await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - // Start waiting for download before clicking. - const AASDownload = page.locator('#aas-download') - const downloadPromise = page.waitForEvent('download') - await AASDownload.click() - const download = await downloadPromise - const expectedFilename = 'MyLampThing-AAS.json' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) -}) +// const exampleEditor = page.locator("#editor2") +// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") +// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") +// await expect(exampleEditor).toHaveClass("editor active") -test.describe("Defaults view functionality", () => { - test("Opening the Defaults view with the Thing Template", async ({ page }) => { +// const AASView = page.locator('#aas-view') +// const consoleError = page.locator('#console-error') +// const AASTab = page.locator("#aas-tab") - const initialTab = page.locator("#tab").nth(0) - await expect(initialTab).toHaveAttribute('data-tab-id', "1") - await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") - await expect(initialTab).toHaveClass("active") +// await expect(AASView).toHaveClass("console-view aas-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(AASTab).toBeChecked({ checked: false }) - const DefaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const DefaultsTab = page.locator("#defaults-tab") +// await AASTab.click() - await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(DefaultsTab).toBeChecked({ checked: false }) +// await expect(AASTab).toBeChecked({ checked: true }) +// await expect(AASView).toHaveClass("console-view aas-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await DefaultsTab.click() +// const ASSEditor = page.locator('#aas-container') +// const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) - await expect(DefaultsTab).toBeChecked({ checked: true }) - await expect(DefaultsView).toHaveClass("console-view defaults-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") +// await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') - const defaultsEditor = page.locator('#defaults-container') - const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: '"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",' }).nth(4) +// // Start waiting for download before clicking. +// const AASDownload = page.locator('#aas-download') +// const downloadPromise = page.waitForEvent('download') +// await AASDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'MyLampThing-AAS.json' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) +// }) - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") - await expect(defaultsContainer).toHaveText('"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",') +// test.describe("Defaults view functionality", () => { +// test("Opening the Defaults view with the Thing Template", async ({ page }) => { - const defaultsJsonBtn = page.locator('#defaults-json') - const defaultsAddBtn = page.locator('#defaults-add') +// const initialTab = page.locator("#tab").nth(0) +// await expect(initialTab).toHaveAttribute('data-tab-id', "1") +// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") +// await expect(initialTab).toHaveClass("active") - await expect(defaultsJsonBtn).toBeDisabled() - await expect(defaultsAddBtn).toBeDisabled() - }) +// const DefaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const DefaultsTab = page.locator("#defaults-tab") - test("Trying to open the Defaults view with a TM", async ({ page }) => { +// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(DefaultsTab).toBeChecked({ checked: false }) - await page.locator("#examples-btn").click() +// await DefaultsTab.click() - const thingTypeToggle = page.locator('#thing-type-btn') - await thingTypeToggle.click() - await expect(thingTypeToggle).toBeChecked({ checked: true }) +// await expect(DefaultsTab).toBeChecked({ checked: true }) +// await expect(DefaultsView).toHaveClass("console-view defaults-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) - await quickAccessBtn.click() +// const defaultsEditor = page.locator('#defaults-container') +// const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: '"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",' }).nth(4) - const exampleTab = page.locator("#tab").nth(1) - await expect(exampleTab).toHaveAttribute('data-tab-id', "2") - await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") - await expect(exampleTab).toHaveClass("active") +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") +// await expect(defaultsContainer).toHaveText('"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",') - const DefaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const DefaultsTab = page.locator("#defaults-tab") +// const defaultsJsonBtn = page.locator('#defaults-json') +// const defaultsAddBtn = page.locator('#defaults-add') - await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(DefaultsTab).toBeChecked({ checked: false }) +// await expect(defaultsJsonBtn).toBeDisabled() +// await expect(defaultsAddBtn).toBeDisabled() +// }) - await DefaultsTab.click() +// test("Trying to open the Defaults view with a TM", async ({ page }) => { - await expect(DefaultsTab).toBeChecked({ checked: true }) - await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") - await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") +// await page.locator("#examples-btn").click() - }) +// const thingTypeToggle = page.locator('#thing-type-btn') +// await thingTypeToggle.click() +// await expect(thingTypeToggle).toBeChecked({ checked: true }) - test("Open the Defaults view as YAML", async ({ page }) => { +// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) +// await quickAccessBtn.click() - const templateEditor = page.locator("#editor1") - await expect(templateEditor).toHaveAttribute('data-ide-id', "1") - await expect(templateEditor).toHaveAttribute('data-mode-id', "json") - await expect(templateEditor).toHaveClass("editor active") +// const exampleTab = page.locator("#tab").nth(1) +// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") +// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") +// await expect(exampleTab).toHaveClass("active") - const jsonYamlPopup = page.locator('.json-yaml-warning') - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// const DefaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const DefaultsTab = page.locator("#defaults-tab") - const jsonBtn = page.locator('#file-type-json') - const yamlBtn = page.locator('#file-type-yaml') +// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(DefaultsTab).toBeChecked({ checked: false }) - await expect(jsonBtn).toBeChecked({ checked: true }) - await expect(yamlBtn).toBeChecked({ checked: false }) +// await DefaultsTab.click() - await yamlBtn.click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") +// await expect(DefaultsTab).toBeChecked({ checked: true }) +// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") - await page.locator('#yaml-confirm-btn').click() - await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(templateEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(jsonBtn).toBeChecked({ checked: false }) - await expect(yamlBtn).toBeChecked({ checked: true }) +// }) - const defaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const defaultsTab = page.locator("#defaults-tab") +// test("Open the Defaults view as YAML", async ({ page }) => { - await expect(defaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(defaultsTab).toBeChecked({ checked: false }) +// const templateEditor = page.locator("#editor1") +// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") +// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") +// await expect(templateEditor).toHaveClass("editor active") - await defaultsTab.click() +// const jsonYamlPopup = page.locator('.json-yaml-warning') +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - await expect(defaultsTab).toBeChecked({ checked: true }) - await expect(defaultsView).toHaveClass("console-view defaults-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// const jsonBtn = page.locator('#file-type-json') +// const yamlBtn = page.locator('#file-type-yaml') - const defaultsEditor = page.locator('#defaults-container') - const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: 'description: >-' }).nth(4) - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(defaultsContainer).toHaveText('description: >-') +// await expect(jsonBtn).toBeChecked({ checked: true }) +// await expect(yamlBtn).toBeChecked({ checked: false }) - const defaultsYamlBtn = page.locator('#defaults-yaml') - await expect(defaultsYamlBtn).toBeDisabled() - }) +// await yamlBtn.click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - test("Open the Defaults view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { - const templateEditor = page.locator("#editor1") - await expect(templateEditor).toHaveAttribute('data-ide-id', "1") - await expect(templateEditor).toHaveAttribute('data-mode-id', "json") - await expect(templateEditor).toHaveClass("editor active") +// await page.locator('#yaml-confirm-btn').click() +// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") +// await expect(templateEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(jsonBtn).toBeChecked({ checked: false }) +// await expect(yamlBtn).toBeChecked({ checked: true }) - const defaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const defaultsTab = page.locator("#defaults-tab") +// const defaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const defaultsTab = page.locator("#defaults-tab") - await expect(defaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(defaultsTab).toBeChecked({ checked: false }) +// await expect(defaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(defaultsTab).toBeChecked({ checked: false }) - await defaultsTab.click() +// await defaultsTab.click() - await expect(defaultsTab).toBeChecked({ checked: true }) - await expect(defaultsView).toHaveClass("console-view defaults-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(defaultsTab).toBeChecked({ checked: true }) +// await expect(defaultsView).toHaveClass("console-view defaults-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - const defaultsEditor = page.locator('#defaults-container') +// const defaultsEditor = page.locator('#defaults-container') +// const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: 'description: >-' }).nth(4) +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(defaultsContainer).toHaveText('description: >-') - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") +// const defaultsYamlBtn = page.locator('#defaults-yaml') +// await expect(defaultsYamlBtn).toBeDisabled() +// }) - const defaultsJsonBtn = page.locator('#defaults-json') - const defaultsYamlBtn = page.locator('#defaults-yaml') +// test("Open the Defaults view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { +// const templateEditor = page.locator("#editor1") +// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") +// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") +// await expect(templateEditor).toHaveClass("editor active") - await expect(defaultsJsonBtn).toBeDisabled() +// const defaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const defaultsTab = page.locator("#defaults-tab") - await defaultsYamlBtn.click() +// await expect(defaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(defaultsTab).toBeChecked({ checked: false }) - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(defaultsYamlBtn).toBeDisabled() +// await defaultsTab.click() - await defaultsJsonBtn.click() +// await expect(defaultsTab).toBeChecked({ checked: true }) +// await expect(defaultsView).toHaveClass("console-view defaults-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") - await expect(defaultsJsonBtn).toBeDisabled() - }) +// const defaultsEditor = page.locator('#defaults-container') - test("Open the Defaults view and removing and adding default values", async ({ page }) => { +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") - const templateEditor = page.locator("#editor1") - await expect(templateEditor).toHaveAttribute('data-ide-id', "1") - await expect(templateEditor).toHaveClass("editor active") +// const defaultsJsonBtn = page.locator('#defaults-json') +// const defaultsYamlBtn = page.locator('#defaults-yaml') - const defaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const defaultsTab = page.locator("#defaults-tab") +// await expect(defaultsJsonBtn).toBeDisabled() - await expect(defaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(defaultsTab).toBeChecked({ checked: false }) +// await defaultsYamlBtn.click() - await defaultsTab.click() +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(defaultsYamlBtn).toBeDisabled() - await expect(defaultsTab).toBeChecked({ checked: true }) - await expect(defaultsView).toHaveClass("console-view defaults-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// await defaultsJsonBtn.click() - const defaultsAddBtn = page.locator('#defaults-add') - const defaultsRemoveBtn = page.locator('#defaults-remove') +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") +// await expect(defaultsJsonBtn).toBeDisabled() +// }) - await expect(defaultsAddBtn).toBeDisabled() +// test("Open the Defaults view and removing and adding default values", async ({ page }) => { - await defaultsRemoveBtn.click() - await expect(defaultsRemoveBtn).toBeDisabled() +// const templateEditor = page.locator("#editor1") +// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") +// await expect(templateEditor).toHaveClass("editor active") - await defaultsAddBtn.click() - await expect(defaultsAddBtn).toBeDisabled() - }) +// const defaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const defaultsTab = page.locator("#defaults-tab") - test("Open the Defaults view and downloading it as JSON with defaults", async ({ page }) => { +// await expect(defaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(defaultsTab).toBeChecked({ checked: false }) - const templateEditor = page.locator("#editor1") - await expect(templateEditor).toHaveAttribute('data-ide-id', "1") - await expect(templateEditor).toHaveAttribute('data-mode-id', "json") - await expect(templateEditor).toHaveClass("editor active") +// await defaultsTab.click() - const DefaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const DefaultsTab = page.locator("#defaults-tab") +// await expect(defaultsTab).toBeChecked({ checked: true }) +// await expect(defaultsView).toHaveClass("console-view defaults-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(DefaultsTab).toBeChecked({ checked: false }) +// const defaultsAddBtn = page.locator('#defaults-add') +// const defaultsRemoveBtn = page.locator('#defaults-remove') - await DefaultsTab.click() +// await expect(defaultsAddBtn).toBeDisabled() - await expect(DefaultsTab).toBeChecked({ checked: true }) - await expect(DefaultsView).toHaveClass("console-view defaults-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// await defaultsRemoveBtn.click() +// await expect(defaultsRemoveBtn).toBeDisabled() - const defaultsEditor = page.locator('#defaults-container') - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") +// await defaultsAddBtn.click() +// await expect(defaultsAddBtn).toBeDisabled() +// }) - const DefaultsJsonBtn = page.locator('#defaults-json') - await expect(DefaultsJsonBtn).toBeDisabled() +// test("Open the Defaults view and downloading it as JSON with defaults", async ({ page }) => { - // Start waiting for download before clicking. - const DefaultsDownload = page.locator('#defaults-download') - const downloadPromise = page.waitForEvent('download') - await DefaultsDownload.click() - const download = await downloadPromise - const expectedFilename = 'Thing-Template-with-Defaults.json' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// const templateEditor = page.locator("#editor1") +// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") +// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") +// await expect(templateEditor).toHaveClass("editor active") - test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { - const templateEditor = page.locator("#editor1") - await expect(templateEditor).toHaveAttribute('data-ide-id', "1") - await expect(templateEditor).toHaveAttribute('data-mode-id', "json") - await expect(templateEditor).toHaveClass("editor active") +// const DefaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const DefaultsTab = page.locator("#defaults-tab") - const DefaultsView = page.locator('#defaults-view') - const consoleError = page.locator('#console-error') - const DefaultsTab = page.locator("#defaults-tab") +// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(DefaultsTab).toBeChecked({ checked: false }) - await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") - await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(DefaultsTab).toBeChecked({ checked: false }) +// await DefaultsTab.click() - await DefaultsTab.click() +// await expect(DefaultsTab).toBeChecked({ checked: true }) +// await expect(DefaultsView).toHaveClass("console-view defaults-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await expect(DefaultsTab).toBeChecked({ checked: true }) - await expect(DefaultsView).toHaveClass("console-view defaults-view") - await expect(consoleError).toHaveClass("console-view console-error hidden") +// const defaultsEditor = page.locator('#defaults-container') +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") - const defaultsEditor = page.locator('#defaults-container') - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") +// const DefaultsJsonBtn = page.locator('#defaults-json') +// await expect(DefaultsJsonBtn).toBeDisabled() - const defaultsJsonBtn = page.locator('#defaults-json') - const defaultsYamlBtn = page.locator('#defaults-yaml') +// // Start waiting for download before clicking. +// const DefaultsDownload = page.locator('#defaults-download') +// const downloadPromise = page.waitForEvent('download') +// await DefaultsDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'Thing-Template-with-Defaults.json' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - await expect(defaultsJsonBtn).toBeDisabled() +// test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { +// const templateEditor = page.locator("#editor1") +// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") +// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") +// await expect(templateEditor).toHaveClass("editor active") - await defaultsYamlBtn.click() +// const DefaultsView = page.locator('#defaults-view') +// const consoleError = page.locator('#console-error') +// const DefaultsTab = page.locator("#defaults-tab") - await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") - await expect(defaultsYamlBtn).toBeDisabled() +// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") +// await expect(consoleError).toHaveClass("console-view console-error hidden") +// await expect(DefaultsTab).toBeChecked({ checked: false }) - const defaultsAddBtn = page.locator('#defaults-add') - const defaultsRemoveBtn = page.locator('#defaults-remove') +// await DefaultsTab.click() - await expect(defaultsAddBtn).toBeDisabled() +// await expect(DefaultsTab).toBeChecked({ checked: true }) +// await expect(DefaultsView).toHaveClass("console-view defaults-view") +// await expect(consoleError).toHaveClass("console-view console-error hidden") - await defaultsRemoveBtn.click() - await expect(defaultsRemoveBtn).toBeDisabled() +// const defaultsEditor = page.locator('#defaults-container') +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") - // Start waiting for download before clicking. - const defaultsDownload = page.locator('#defaults-download') - const downloadPromise = page.waitForEvent('download') - await defaultsDownload.click() - const download = await downloadPromise - const expectedFilename = 'Thing-Template-without-Defaults.yaml' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) -}) +// const defaultsJsonBtn = page.locator('#defaults-json') +// const defaultsYamlBtn = page.locator('#defaults-yaml') -test.describe("Visualization view functionality", () => { +// await expect(defaultsJsonBtn).toBeDisabled() - test("Open the visualization view with the thing template", async ({ page }) => { +// await defaultsYamlBtn.click() - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") +// await expect(defaultsYamlBtn).toBeDisabled() - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// const defaultsAddBtn = page.locator('#defaults-add') +// const defaultsRemoveBtn = page.locator('#defaults-remove') - await visualizeTab.click() +// await expect(defaultsAddBtn).toBeDisabled() - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// await defaultsRemoveBtn.click() +// await expect(defaultsRemoveBtn).toBeDisabled() - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') +// // Start waiting for download before clicking. +// const defaultsDownload = page.locator('#defaults-download') +// const downloadPromise = page.waitForEvent('download') +// await defaultsDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'Thing-Template-without-Defaults.yaml' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) +// }) - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// test.describe("Visualization view functionality", () => { - const graphVisTitle = page.locator('#visualized').getByText('Thing Template', { exact: true }) - await expect(graphVisTitle).toHaveText("Thing Template") - }) +// test("Open the visualization view with the thing template", async ({ page }) => { - test("Open the visualization view with the thing template and expand and collapse the graph view", async ({ page }) => { +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// await visualizeTab.click() - await visualizeTab.click() +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') - const collapseAllBtn = page.locator('#collapse-all') - const expandAllBtn = page.locator('#expand-all') +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// const graphVisTitle = page.locator('#visualized').getByText('Thing Template', { exact: true }) +// await expect(graphVisTitle).toHaveText("Thing Template") +// }) - const svgPaths = page.locator("svg > g > path") - await expect(svgPaths).toHaveCount(9) +// test("Open the visualization view with the thing template and expand and collapse the graph view", async ({ page }) => { - await expandAllBtn.click() - await expect(expandAllBtn).toBeDisabled() +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") - await expect(svgPaths).toHaveCount(12) +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) - await collapseAllBtn.click() - await expect(collapseAllBtn).toBeDisabled() +// await visualizeTab.click() - await expect(svgPaths).toHaveCount(0) - }) +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") - test("Open the visualization view with the thing template download the graph view as SVG", async ({ page }) => { +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') +// const collapseAllBtn = page.locator('#collapse-all') +// const expandAllBtn = page.locator('#expand-all') - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// const svgPaths = page.locator("svg > g > path") +// await expect(svgPaths).toHaveCount(9) - await visualizeTab.click() +// await expandAllBtn.click() +// await expect(expandAllBtn).toBeDisabled() - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// await expect(svgPaths).toHaveCount(12) - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') +// await collapseAllBtn.click() +// await expect(collapseAllBtn).toBeDisabled() - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// await expect(svgPaths).toHaveCount(0) +// }) - // Start waiting for download before clicking. - const svgDownload = page.locator('#download-svg') - const downloadPromise = page.waitForEvent('download') - await svgDownload.click() - const download = await downloadPromise - const expectedFilename = 'Graph-visualization.svg' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// test("Open the visualization view with the thing template download the graph view as SVG", async ({ page }) => { - test("Open the visualization view with the thing template and download the graph view as PNG", async ({ page }) => { +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// await visualizeTab.click() - await visualizeTab.click() +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// // Start waiting for download before clicking. +// const svgDownload = page.locator('#download-svg') +// const downloadPromise = page.waitForEvent('download') +// await svgDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'Graph-visualization.svg' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - // Start waiting for download before clicking. - const pngDownload = page.locator('#download-png') - const downloadPromise = page.waitForEvent('download') - await pngDownload.click() - const download = await downloadPromise - const expectedFilename = 'Graph-visualization.png' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// test("Open the visualization view with the thing template and download the graph view as PNG", async ({ page }) => { - test("Open the tree visualization view with the thing template and modified the input values", async ({ page }) => { +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// await visualizeTab.click() - await visualizeTab.click() +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// // Start waiting for download before clicking. +// const pngDownload = page.locator('#download-png') +// const downloadPromise = page.waitForEvent('download') +// await pngDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'Graph-visualization.png' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - await treeViewBtn.click() - await expect(graphViewBtn).toBeChecked({ checked: false }) - await expect(treeViewBtn).toBeChecked({ checked: true }) +// test("Open the tree visualization view with the thing template and modified the input values", async ({ page }) => { - const labelBtn = page.getByLabel('labels') - const radiusSlider = page.getByLabel('radius') - const extentSlider = page.getByLabel('extent') - const rotateSlider = page.getByLabel('rotate') - const dragSlider = page.getByLabel('drag precision') - const tidyBtn = page.getByLabel('tidy') - const clusterBtn = page.getByLabel('cluster') - const linksDropDown = page.getByLabel('links') +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") - await expect(labelBtn).toBeChecked({ checked: true }) - await expect(radiusSlider).toHaveValue("350") - await expect(extentSlider).toHaveValue("360") - await expect(rotateSlider).toHaveValue("0") - await expect(dragSlider).toHaveValue("100") - await expect(tidyBtn).toBeChecked({ checked: true }) - await expect(clusterBtn).toBeChecked({ checked: false }) - await expect(linksDropDown).toHaveValue("line") +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) - await labelBtn.click() - await radiusSlider.click() - await extentSlider.click() - await rotateSlider.click() - await dragSlider.click() - await clusterBtn.check() - await linksDropDown.selectOption("diagonal") - await expect(labelBtn).toBeChecked({ checked: false }) +// await visualizeTab.click() - const radiusSliderValue = await radiusSlider.inputValue() - expect(parseInt(radiusSliderValue)).toBeLessThan(450) - expect(parseInt(radiusSliderValue)).toBeGreaterThan(330) +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") - const extentSliderValue = await extentSlider.inputValue() - expect(parseInt(extentSliderValue)).toBeLessThan(190) - expect(parseInt(extentSliderValue)).toBeGreaterThan(170) +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') - const rotateSliderValue = await rotateSlider.inputValue() - expect(parseInt(rotateSliderValue)).toBeLessThan(190) - expect(parseInt(rotateSliderValue)).toBeGreaterThan(170) +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) - const dragSliderValue = await dragSlider.inputValue() - expect(parseInt(dragSliderValue)).toBeLessThan(60) - expect(parseInt(dragSliderValue)).toBeGreaterThan(40) +// await treeViewBtn.click() +// await expect(graphViewBtn).toBeChecked({ checked: false }) +// await expect(treeViewBtn).toBeChecked({ checked: true }) - await expect(tidyBtn).toBeChecked({ checked: false }) - await expect(clusterBtn).toBeChecked({ checked: true }) - await expect(linksDropDown).toHaveValue("diagonal") +// const labelBtn = page.getByLabel('labels') +// const radiusSlider = page.getByLabel('radius') +// const extentSlider = page.getByLabel('extent') +// const rotateSlider = page.getByLabel('rotate') +// const dragSlider = page.getByLabel('drag precision') +// const tidyBtn = page.getByLabel('tidy') +// const clusterBtn = page.getByLabel('cluster') +// const linksDropDown = page.getByLabel('links') - }) +// await expect(labelBtn).toBeChecked({ checked: true }) +// await expect(radiusSlider).toHaveValue("350") +// await expect(extentSlider).toHaveValue("360") +// await expect(rotateSlider).toHaveValue("0") +// await expect(dragSlider).toHaveValue("100") +// await expect(tidyBtn).toBeChecked({ checked: true }) +// await expect(clusterBtn).toBeChecked({ checked: false }) +// await expect(linksDropDown).toHaveValue("line") - test("Open the tree visualization view with the thing template and download as SVG", async ({ page }) => { +// await labelBtn.click() +// await radiusSlider.click() +// await extentSlider.click() +// await rotateSlider.click() +// await dragSlider.click() +// await clusterBtn.check() +// await linksDropDown.selectOption("diagonal") +// await expect(labelBtn).toBeChecked({ checked: false }) - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// const radiusSliderValue = await radiusSlider.inputValue() +// expect(parseInt(radiusSliderValue)).toBeLessThan(450) +// expect(parseInt(radiusSliderValue)).toBeGreaterThan(330) - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// const extentSliderValue = await extentSlider.inputValue() +// expect(parseInt(extentSliderValue)).toBeLessThan(190) +// expect(parseInt(extentSliderValue)).toBeGreaterThan(170) - await visualizeTab.click() +// const rotateSliderValue = await rotateSlider.inputValue() +// expect(parseInt(rotateSliderValue)).toBeLessThan(190) +// expect(parseInt(rotateSliderValue)).toBeGreaterThan(170) - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// const dragSliderValue = await dragSlider.inputValue() +// expect(parseInt(dragSliderValue)).toBeLessThan(60) +// expect(parseInt(dragSliderValue)).toBeGreaterThan(40) - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') +// await expect(tidyBtn).toBeChecked({ checked: false }) +// await expect(clusterBtn).toBeChecked({ checked: true }) +// await expect(linksDropDown).toHaveValue("diagonal") - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// }) - await treeViewBtn.click() - await expect(graphViewBtn).toBeChecked({ checked: false }) - await expect(treeViewBtn).toBeChecked({ checked: true }) +// test("Open the tree visualization view with the thing template and download as SVG", async ({ page }) => { - // Start waiting for download before clicking. - const svgDownload = page.locator('#download-svg') - const downloadPromise = page.waitForEvent('download') - await svgDownload.click() - const download = await downloadPromise - const expectedFilename = 'Tree-visualization.svg' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") - test("Open the tree visualization view with the thing template and download as PNG", async ({ page }) => { +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) - const visualizeView = page.locator('#visualize-view') - const visualizeTab = page.locator("#visualize-tab") +// await visualizeTab.click() - await expect(visualizeView).toHaveClass("console-view visualize-view hidden") - await expect(visualizeTab).toBeChecked({ checked: false }) +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") - await visualizeTab.click() +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') - await expect(visualizeTab).toBeChecked({ checked: true }) - await expect(visualizeView).toHaveClass("console-view visualize-view") +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) - const graphViewBtn = page.locator('#graph-view') - const treeViewBtn = page.locator('#tree-view') +// await treeViewBtn.click() +// await expect(graphViewBtn).toBeChecked({ checked: false }) +// await expect(treeViewBtn).toBeChecked({ checked: true }) - await expect(graphViewBtn).toBeChecked({ checked: true }) - await expect(treeViewBtn).toBeChecked({ checked: false }) +// // Start waiting for download before clicking. +// const svgDownload = page.locator('#download-svg') +// const downloadPromise = page.waitForEvent('download') +// await svgDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'Tree-visualization.svg' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) - await treeViewBtn.click() - await expect(graphViewBtn).toBeChecked({ checked: false }) - await expect(treeViewBtn).toBeChecked({ checked: true }) +// test("Open the tree visualization view with the thing template and download as PNG", async ({ page }) => { - // Start waiting for download before clicking. - const pngDownload = page.locator('#download-png') - const downloadPromise = page.waitForEvent('download') - await pngDownload.click() - const download = await downloadPromise - const expectedFilename = 'Tree-visualization.png' - expect(download.suggestedFilename()).toBe(expectedFilename) - }) -}) +// const visualizeView = page.locator('#visualize-view') +// const visualizeTab = page.locator("#visualize-tab") + +// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") +// await expect(visualizeTab).toBeChecked({ checked: false }) + +// await visualizeTab.click() + +// await expect(visualizeTab).toBeChecked({ checked: true }) +// await expect(visualizeView).toHaveClass("console-view visualize-view") + +// const graphViewBtn = page.locator('#graph-view') +// const treeViewBtn = page.locator('#tree-view') + +// await expect(graphViewBtn).toBeChecked({ checked: true }) +// await expect(treeViewBtn).toBeChecked({ checked: false }) + +// await treeViewBtn.click() +// await expect(graphViewBtn).toBeChecked({ checked: false }) +// await expect(treeViewBtn).toBeChecked({ checked: true }) + +// // Start waiting for download before clicking. +// const pngDownload = page.locator('#download-png') +// const downloadPromise = page.waitForEvent('download') +// await pngDownload.click() +// const download = await downloadPromise +// const expectedFilename = 'Tree-visualization.png' +// expect(download.suggestedFilename()).toBe(expectedFilename) +// }) +// }) From c4a2046ed452225c996746e092ce14bd6570a673 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Wed, 7 Feb 2024 19:23:56 +0100 Subject: [PATCH 62/68] Building the project before the testing --- .github/workflows/visual-ci-new.yaml | 1 + 1 file changed, 1 insertion(+) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index c0e981e16..0a1083fec 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -33,6 +33,7 @@ jobs: cd ./packages/web-new npm install npx playwright install chromium firefox + npm run build npm run serve & sleep 10 npm test From 74d0b4ea77c03f1a07e6157a4cff423d0b59140c Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Wed, 7 Feb 2024 19:32:35 +0100 Subject: [PATCH 63/68] Running tests with playwrights web server --- .github/workflows/visual-ci-new.yaml | 2 -- packages/web-new/playwright.config.js | 12 ++++++------ 2 files changed, 6 insertions(+), 8 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index 0a1083fec..bc81e4a9e 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -34,8 +34,6 @@ jobs: npm install npx playwright install chromium firefox npm run build - npm run serve & - sleep 10 npm test - uses: actions/upload-artifact@v3 diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index 3f6b292f7..c2220733e 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -69,10 +69,10 @@ module.exports = defineConfig({ ], /* Run your local dev server before starting the tests */ - // webServer: { - // command: 'npm run serve', - // url: 'http://127.0.0.1:5100', - // // timeout: 120 * 1000, - // reuseExistingServer: !process.env.CI, - // } + webServer: { + command: 'npm run serve', + url: 'http://127.0.0.1:5100', + // timeout: 120 * 1000, + reuseExistingServer: !process.env.CI, + } }); From a2b0d5c1a0e8413253f436ec93a9490ad5b95e4a Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Wed, 7 Feb 2024 19:39:10 +0100 Subject: [PATCH 64/68] Getting playwright report in github actions --- .github/workflows/visual-ci-new.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index bc81e4a9e..aa0c0a48b 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -40,5 +40,5 @@ jobs: if: always() with: name: playwright-report - path: playwright-report/ + path: ./packages/web-new/playwright-report/ retention-days: 30 \ No newline at end of file From 1a28607a1f3a90638fcb093bbb07cf7e3fdb8ac2 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Wed, 7 Feb 2024 19:45:27 +0100 Subject: [PATCH 65/68] Running all tests, and removing unnecessary tests --- packages/web-new/tests/test.spec.js | 3045 ++++++++++++--------------- 1 file changed, 1392 insertions(+), 1653 deletions(-) diff --git a/packages/web-new/tests/test.spec.js b/packages/web-new/tests/test.spec.js index a2c69be9c..d5d8f7952 100644 --- a/packages/web-new/tests/test.spec.js +++ b/packages/web-new/tests/test.spec.js @@ -24,2171 +24,1910 @@ test.describe("Load initial state", () => { await expect(page).toHaveTitle("TD Playground") }) - // test('Has editor tab', async ({ page }) => { - // const editorTab = page.locator('#tab') - // await expect(editorTab).toHaveText("TDThing TemplateCloseCancel") - // }) - - // test('Has TD template', async ({ page }) => { - // const editor = page.locator('#editor1').getByRole('code').locator('div').filter({ hasText: '"title": "Thing Template",' }).nth(4) - // await expect(editor).toHaveText('"title": "Thing Template",') - // }) - - // test('Validation tab is checked', async ({ page }) => { - // const validationTab = page.locator('#validation-tab') - // await expect(validationTab).toBeChecked() - // }) - - // test('Validation view is opened', async ({ page }) => { - // const validationView = page.locator('#validation-view') - // await expect(validationView).toHaveClass("console-view validation-view") - // }) - - // test('JSON button is checked', async ({ page }) => { - // const jsonBtn = page.locator('#file-type-json') - // await expect(jsonBtn).toBeChecked() - // }) -}) - -// test.describe("Check all links", () => { -// test("Check Thingweb logo link", async ({ page }) => { -// const thingwebPromise = page.waitForEvent('popup') -// await page.locator(".logo").click() -// const thingwebPage = await thingwebPromise -// await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") -// await expect(thingwebPage).toHaveURL("https://www.thingweb.io") -// }) - -// test("Check CLI link", async ({ page }) => { -// const cliPromise = page.waitForEvent('popup') -// await page.locator(".cli-link").click() -// const cliPage = await cliPromise -// await expect(cliPage).toHaveURL("https://github.com/eclipse-thingweb/playground/tree/master/packages/cli") -// }) - -// test("Check Github link", async ({ page }) => { -// const githubPromise = page.waitForEvent('popup') -// await page.locator(".git-link").click() -// const githubPage = await githubPromise -// await expect(githubPage).toHaveTitle(/GitHub - eclipse-thingweb/) -// await expect(githubPage).toHaveURL("https://github.com/eclipse-thingweb/playground") -// }) - -// test("Check Thingweb footer link", async ({ page }) => { -// await page.locator('#settings-btn').click() -// const thingwebPromise = page.waitForEvent('popup') -// await page.locator("#thingweb-link").click() -// const thingwebPage = await thingwebPromise -// await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") -// await expect(thingwebPage).toHaveURL("https://www.thingweb.io") -// }) - -// test("Check Eclipse footer link", async ({ page }) => { -// await page.locator('#settings-btn').click() -// const eclipsePromise = page.waitForEvent('popup') -// await page.locator("#eclipse-link").click() -// const eclipsePage = await eclipsePromise -// await expect(eclipsePage).toHaveTitle("The Community for Open Collaboration and Innovation | The Eclipse Foundation") -// await expect(eclipsePage).toHaveURL("https://www.eclipse.org") -// }) - -// test("Check privacy policy footer link", async ({ page }) => { -// await page.locator('#settings-btn').click() -// const privacyPromise = page.waitForEvent('popup') -// await page.locator("#privacy-link").click() -// const privacyPage = await privacyPromise -// await expect(privacyPage).toHaveTitle("Eclipse Foundation Website Privacy Policy | The Eclipse Foundation") -// await expect(privacyPage).toHaveURL("https://www.eclipse.org/legal/privacy.php") -// }) - -// test("Check terms of use footer link", async ({ page }) => { -// await page.locator('#settings-btn').click() -// const termsPromise = page.waitForEvent('popup') -// await page.locator("#terms-link").click() -// const termsPage = await termsPromise -// await expect(termsPage).toHaveTitle("Eclipse.org Terms of Use | The Eclipse Foundation") -// await expect(termsPage).toHaveURL("https://www.eclipse.org/legal/termsofuse.php") -// }) - -// test("Check copyright agent footer link", async ({ page }) => { -// await page.locator('#settings-btn').click() -// const copyrightPromise = page.waitForEvent('popup') -// await page.locator("#copyright-link").click() -// const copyrightPage = await copyrightPromise -// await expect(copyrightPage).toHaveTitle("Copyright Agent | The Eclipse Foundation") -// await expect(copyrightPage).toHaveURL("https://www.eclipse.org/legal/copyright.php") -// }) - -// test("Check legal footer link", async ({ page }) => { -// await page.locator('#settings-btn').click() -// const legalPromise = page.waitForEvent('popup') -// await page.locator("#legal-link").click() -// const legalPage = await legalPromise -// await expect(legalPage).toHaveTitle("Eclipse Foundation Legal Resources | The Eclipse Foundation") -// await expect(legalPage).toHaveURL("https://www.eclipse.org/legal/") -// }) -// }) - -// test.describe("Editors and Tabs creation and deletion", () => { -// test("Adding a new editor and closing it", async ({ page }) => { -// const editorTabs = page.locator("#tab") -// const editors = page.locator(".editor") -// await expect(editorTabs).toHaveCount(1) -// await expect(editors).toHaveCount(1) - -// const initialTab = page.locator("#tab").nth(0) -// await expect(initialTab).toHaveAttribute('data-tab-id', "1") -// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(initialTab).toHaveClass("active") - -// const initialEditor = page.locator("#editor1") -// await expect(initialEditor).toHaveAttribute('data-ide-id', "1") -// await expect(initialEditor).toHaveClass("editor active") - -// await page.locator("#ide-tab-add").click() -// await expect(editorTabs).toHaveCount(2) -// await expect(editors).toHaveCount(2) - -// await expect(initialTab).toHaveClass("") -// await expect(initialEditor).toHaveClass("editor") - -// const secondTab = page.locator("#tab").nth(1) -// await expect(secondTab).toHaveAttribute('data-tab-id', "2") -// await expect(secondTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(secondTab).toHaveClass("active") - -// const secondEditor = page.locator("#editor2") -// await expect(secondEditor).toHaveAttribute('data-ide-id', "2") -// await expect(secondEditor).toHaveClass("editor active") - -// await page.locator("#tab").nth(1).locator(".close-tab").click() -// await page.locator('#tab').nth(1).locator(".confirm-btns > .confirm-tab-close").click() - -// await expect(editorTabs).toHaveCount(1) -// await expect(editors).toHaveCount(1) - -// await expect(initialTab).toHaveClass("active") -// await expect(initialEditor).toHaveClass("editor active") -// }) - -// test("Opening an example and closing initial editor", async ({ page }) => { -// const editorTabs = page.locator("#tab") -// const editors = page.locator(".editor") -// await expect(editorTabs).toHaveCount(1) -// await expect(editors).toHaveCount(1) - -// const initialTab = page.locator("#tab").nth(0) -// await expect(initialTab).toHaveAttribute('data-tab-id', "1") -// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(initialTab).toHaveClass("active") - -// const initialEditor = page.locator("#editor1") -// await expect(initialEditor).toHaveAttribute('data-ide-id', "1") -// await expect(initialEditor).toHaveClass("editor active") - -// await page.locator("#examples-btn").click() -// await page.locator(".example").nth(0).click() -// await page.locator(".example").nth(0).getByRole("button", { name: /Apply/ }).click() - -// await expect(editorTabs).toHaveCount(2) -// await expect(editors).toHaveCount(2) - -// await expect(initialTab).toHaveClass("") -// await expect(initialEditor).toHaveClass("editor") - -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") - -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveClass("editor active") - -// await page.locator("#tab").nth(0).locator(".close-tab").click() -// await page.locator('#tab').nth(0).locator(".confirm-btns > .confirm-tab-close").click() - -// await expect(editorTabs).toHaveCount(1) -// await expect(editors).toHaveCount(1) -// }) -// }) - -// test.describe("JSON and YAML conversion", () => { -// test("JSON to YAML and YAML to JSON", async ({ page }) => { -// const editorTabs = page.locator("#tab") -// const editors = page.locator(".editor") -// await expect(editorTabs).toHaveCount(1) -// await expect(editors).toHaveCount(1) - -// const jsonYamlPopup = page.locator('.json-yaml-warning') -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") - -// const initialEditor = page.locator("#editor1") -// const jsonBtn = page.locator('#file-type-json') -// const yamlBtn = page.locator('#file-type-yaml') - -// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) - -// await yamlBtn.click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - -// await page.locator('#yaml-confirm-btn').click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(initialEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(jsonBtn).toBeChecked({ checked: false }) -// await expect(yamlBtn).toBeChecked({ checked: true }) - -// await jsonBtn.click() -// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) -// }) - -// test("Cancel YAML conversion", async ({ page }) => { -// const editorTabs = page.locator("#tab") -// const editors = page.locator(".editor") -// await expect(editorTabs).toHaveCount(1) -// await expect(editors).toHaveCount(1) - -// const jsonYamlPopup = page.locator('.json-yaml-warning') -// const initialEditor = page.locator("#editor1") -// const jsonBtn = page.locator('#file-type-json') -// const yamlBtn = page.locator('#file-type-yaml') - -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) - -// await yamlBtn.click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") - -// await page.locator('#yaml-cancel-btn').click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(initialEditor).toHaveAttribute('data-mode-id', "json") -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) -// }) -// }) - - -// test.describe("Examples menu functionality", () => { -// test("Open and close examples menu", async ({ page }) => { - -// await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) -// await page.locator("#examples-btn").click() - -// await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: true }) -// await page.locator(".examples-menu-container__close > i").click() - -// await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) -// }) - -// test("Open Basic TD from quick access", async ({ page }) => { - -// await page.locator("#examples-btn").click() - -// const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) -// await expect(basicExample).toHaveClass("example") - -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) -// await quickAccessBtn.click() - -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") - -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveClass("editor active") - -// }) - -// test("Open Basic TD from apply button", async ({ page }) => { - -// await page.locator("#examples-btn").click() - -// const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) -// await basicExample.click() -// await expect(basicExample).toHaveClass("example open") - -// const applyBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Apply" }) -// await applyBtn.click() -// await expect(basicExample).toHaveClass("example") - -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") - -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveClass("editor active") -// }) - -// test("Open Basic TD and close with cancel button", async ({ page }) => { -// await page.locator("#examples-btn").click() - -// const basicTDExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) -// await basicTDExample.click() -// await expect(basicTDExample).toHaveClass("example open") - -// const cancelBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Cancel" }) -// await cancelBtn.click() -// await expect(basicTDExample).toHaveClass("example") -// }) - -// test("Toggle between TD and TM examples", async ({ page }) => { -// await page.locator("#examples-btn").click() - -// const thingTypeToggle = page.locator('#thing-type-btn') -// await expect(thingTypeToggle).toBeChecked({ checked: false }) - -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) -// }) - -// test("Open Basic TM and check for icon change in tab", async ({ page }) => { -// await page.locator("#examples-btn").click() - -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) - -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() - -// const tabIcon = page.locator("#tab").nth(1).locator(".tab-icon") -// await expect(tabIcon).toHaveText("TM") -// }) - -// test("Go to versioning in TD category and open example from quick access", async ({ page }) => { -// await page.locator("#examples-btn").click() - -// const categoryDropDown = page.locator("#thing-category") -// await categoryDropDown.selectOption('9-versioning') - -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Versioning' }).nth(0).getByRole("button").nth(0) -// await quickAccessBtn.click() - -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") -// }) - -// test("Go to Tm Optional in TM category and open example from quick access", async ({ page }) => { -// await page.locator("#examples-btn").click() - -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + test('Has editor tab', async ({ page }) => { + const editorTab = page.locator('#tab') + await expect(editorTab).toHaveText("TDThing TemplateCloseCancel") + }) -// const categoryDropDown = page.locator("#thing-category") -// await categoryDropDown.selectOption('4-tm-optional') + test('Has TD template', async ({ page }) => { + const editor = page.locator('#editor1').getByRole('code').locator('div').filter({ hasText: '"title": "Thing Template",' }).nth(4) + await expect(editor).toHaveText('"title": "Thing Template",') + }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Optional Interaction Affordances' }).nth(0).getByRole("button").nth(0) -// await quickAccessBtn.click() + test('Validation tab is checked', async ({ page }) => { + const validationTab = page.locator('#validation-tab') + await expect(validationTab).toBeChecked() + }) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") -// }) + test('Validation view is opened', async ({ page }) => { + const validationView = page.locator('#validation-view') + await expect(validationView).toHaveClass("console-view validation-view") + }) -// test("Search for uriVariable in the TDs and open Combined URI variables in href example", async ({ page }) => { -// await page.locator("#examples-btn").click() + test('JSON button is checked', async ({ page }) => { + const jsonBtn = page.locator('#file-type-json') + await expect(jsonBtn).toBeChecked() + }) +}) -// const searchInput = page.locator(".search-input") -// searchInput.fill('uriVariables') +test.describe("Check all links", () => { + test("Check Thingweb logo link", async ({ page }) => { + const thingwebPromise = page.waitForEvent('popup') + await page.locator(".logo").click() + const thingwebPage = await thingwebPromise + await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") + await expect(thingwebPage).toHaveURL("https://www.thingweb.io") + }) -// const searchBtn = page.locator(".search-btn") -// await searchBtn.click() + test("Check CLI link", async ({ page }) => { + const cliPromise = page.waitForEvent('popup') + await page.locator(".cli-link").click() + const cliPage = await cliPromise + await expect(cliPage).toHaveURL("https://github.com/eclipse-thingweb/playground/tree/master/packages/cli") + }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Combined URI variables in href' }).nth(0).getByRole("button").nth(0) -// await quickAccessBtn.click() + test("Check Github link", async ({ page }) => { + const githubPromise = page.waitForEvent('popup') + await page.locator(".git-link").click() + const githubPage = await githubPromise + await expect(githubPage).toHaveTitle(/GitHub - eclipse-thingweb/) + await expect(githubPage).toHaveURL("https://github.com/eclipse-thingweb/playground") + }) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyWeatherThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") -// }) + test("Check Thingweb footer link", async ({ page }) => { + await page.locator('#settings-btn').click() + const thingwebPromise = page.waitForEvent('popup') + await page.locator("#thingweb-link").click() + const thingwebPage = await thingwebPromise + await expect(thingwebPage).toHaveTitle("Eclipse Thingweb") + await expect(thingwebPage).toHaveURL("https://www.thingweb.io") + }) -// test("Search for overwrite in the TMs and open Overwrite Existing Definitions example", async ({ page }) => { -// await page.locator("#examples-btn").click() + test("Check Eclipse footer link", async ({ page }) => { + await page.locator('#settings-btn').click() + const eclipsePromise = page.waitForEvent('popup') + await page.locator("#eclipse-link").click() + const eclipsePage = await eclipsePromise + await expect(eclipsePage).toHaveTitle("The Community for Open Collaboration and Innovation | The Eclipse Foundation") + await expect(eclipsePage).toHaveURL("https://www.eclipse.org") + }) -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + test("Check privacy policy footer link", async ({ page }) => { + await page.locator('#settings-btn').click() + const privacyPromise = page.waitForEvent('popup') + await page.locator("#privacy-link").click() + const privacyPage = await privacyPromise + await expect(privacyPage).toHaveTitle("Eclipse Foundation Website Privacy Policy | The Eclipse Foundation") + await expect(privacyPage).toHaveURL("https://www.eclipse.org/legal/privacy.php") + }) -// const searchInput = page.locator(".search-input") -// searchInput.fill('overwrite') + test("Check terms of use footer link", async ({ page }) => { + await page.locator('#settings-btn').click() + const termsPromise = page.waitForEvent('popup') + await page.locator("#terms-link").click() + const termsPage = await termsPromise + await expect(termsPage).toHaveTitle("Eclipse.org Terms of Use | The Eclipse Foundation") + await expect(termsPage).toHaveURL("https://www.eclipse.org/legal/termsofuse.php") + }) -// const searchBtn = page.locator(".search-btn") -// await searchBtn.click() + test("Check copyright agent footer link", async ({ page }) => { + await page.locator('#settings-btn').click() + const copyrightPromise = page.waitForEvent('popup') + await page.locator("#copyright-link").click() + const copyrightPage = await copyrightPromise + await expect(copyrightPage).toHaveTitle("Copyright Agent | The Eclipse Foundation") + await expect(copyrightPage).toHaveURL("https://www.eclipse.org/legal/copyright.php") + }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Overwrite Existing Definitions' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + test("Check legal footer link", async ({ page }) => { + await page.locator('#settings-btn').click() + const legalPromise = page.waitForEvent('popup') + await page.locator("#legal-link").click() + const legalPage = await legalPromise + await expect(legalPage).toHaveTitle("Eclipse Foundation Legal Resources | The Eclipse Foundation") + await expect(legalPage).toHaveURL("https://www.eclipse.org/legal/") + }) +}) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMSmart Lamp ControlCloseCancel") -// await expect(exampleTab).toHaveClass("active") -// }) -// }) +test.describe("Editors and Tabs creation and deletion", () => { + test("Adding a new editor and closing it", async ({ page }) => { + const editorTabs = page.locator("#tab") + const editors = page.locator(".editor") + await expect(editorTabs).toHaveCount(1) + await expect(editors).toHaveCount(1) -// test.describe("Save menu functionality", () => { -// test("Open and close save menu", async ({ page }) => { -// const saveMenu = page.locator(".save-menu") -// await expect(saveMenu).toHaveClass("save-menu closed") + const initialTab = page.locator("#tab").nth(0) + await expect(initialTab).toHaveAttribute('data-tab-id', "1") + await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") + await expect(initialTab).toHaveClass("active") -// await page.locator("#save-btn").click() -// await expect(saveMenu).toHaveClass("save-menu") + const initialEditor = page.locator("#editor1") + await expect(initialEditor).toHaveAttribute('data-ide-id', "1") + await expect(initialEditor).toHaveClass("editor active") -// const closeMenu = page.locator(".save-menu-close > i") -// await closeMenu.click() -// await expect(saveMenu).toHaveClass("save-menu closed") -// }) + await page.locator("#ide-tab-add").click() + await expect(editorTabs).toHaveCount(2) + await expect(editors).toHaveCount(2) -// test("Open save menu with template thing and check for TD in menu title", async ({ page }) => { -// const saveMenu = page.locator(".save-menu") + await expect(initialTab).toHaveClass("") + await expect(initialEditor).toHaveClass("editor") -// await page.locator("#save-btn").click() -// await expect(saveMenu).toHaveClass("save-menu") + const secondTab = page.locator("#tab").nth(1) + await expect(secondTab).toHaveAttribute('data-tab-id', "2") + await expect(secondTab).toHaveText("TDThing TemplateCloseCancel") + await expect(secondTab).toHaveClass("active") -// const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") -// await expect(titleThingType).toHaveText("TD") -// }) + const secondEditor = page.locator("#editor2") + await expect(secondEditor).toHaveAttribute('data-ide-id', "2") + await expect(secondEditor).toHaveClass("editor active") -// test("Open TM examples check for TM in the save menu title", async ({ page }) => { -// await page.locator("#examples-btn").click() + await page.locator("#tab").nth(1).locator(".close-tab").click() + await page.locator('#tab').nth(1).locator(".confirm-btns > .confirm-tab-close").click() -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + await expect(editorTabs).toHaveCount(1) + await expect(editors).toHaveCount(1) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + await expect(initialTab).toHaveClass("active") + await expect(initialEditor).toHaveClass("editor active") + }) -// const saveMenu = page.locator(".save-menu") + test("Opening an example and closing initial editor", async ({ page }) => { + const editorTabs = page.locator("#tab") + const editors = page.locator(".editor") + await expect(editorTabs).toHaveCount(1) + await expect(editors).toHaveCount(1) -// await page.locator("#save-btn").click() -// await expect(saveMenu).toHaveClass("save-menu") + const initialTab = page.locator("#tab").nth(0) + await expect(initialTab).toHaveAttribute('data-tab-id', "1") + await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") + await expect(initialTab).toHaveClass("active") -// const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") -// await expect(titleThingType).toHaveText("TM") -// }) + const initialEditor = page.locator("#editor1") + await expect(initialEditor).toHaveAttribute('data-ide-id', "1") + await expect(initialEditor).toHaveClass("editor active") -// test("Share and open in new tab functionality with an example", async ({ page }) => { + await page.locator("#examples-btn").click() + await page.locator(".example").nth(0).click() + await page.locator(".example").nth(0).getByRole("button", { name: /Apply/ }).click() -// await page.locator("#examples-btn").click() + await expect(editorTabs).toHaveCount(2) + await expect(editors).toHaveCount(2) -// const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) -// await expect(basicExample).toHaveClass("example") + await expect(initialTab).toHaveClass("") + await expect(initialEditor).toHaveClass("editor") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) -// await quickAccessBtn.click() + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveClass("editor active") -// const saveMenu = page.locator(".save-menu") + await page.locator("#tab").nth(0).locator(".close-tab").click() + await page.locator('#tab').nth(0).locator(".confirm-btns > .confirm-tab-close").click() -// await page.locator("#save-btn").click() -// await expect(saveMenu).toHaveClass("save-menu") + await expect(editorTabs).toHaveCount(1) + await expect(editors).toHaveCount(1) + }) +}) -// const openNewTab = page.locator("#open-url-tab") -// await expect(openNewTab).toBeDisabled() +test.describe("JSON and YAML conversion", () => { + test("JSON to YAML and YAML to JSON", async ({ page }) => { + const editorTabs = page.locator("#tab") + const editors = page.locator(".editor") + await expect(editorTabs).toHaveCount(1) + await expect(editors).toHaveCount(1) + + const jsonYamlPopup = page.locator('.json-yaml-warning') + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + + const initialEditor = page.locator("#editor1") + const jsonBtn = page.locator('#file-type-json') + const yamlBtn = page.locator('#file-type-yaml') + + await expect(initialEditor).toHaveAttribute('data-mode-id', "json") + await expect(jsonBtn).toBeChecked({ checked: true }) + await expect(yamlBtn).toBeChecked({ checked: false }) + + await yamlBtn.click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") + + await page.locator('#yaml-confirm-btn').click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + await expect(initialEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(jsonBtn).toBeChecked({ checked: false }) + await expect(yamlBtn).toBeChecked({ checked: true }) + + await jsonBtn.click() + await expect(initialEditor).toHaveAttribute('data-mode-id', "json") + await expect(jsonBtn).toBeChecked({ checked: true }) + await expect(yamlBtn).toBeChecked({ checked: false }) + }) -// const shareUrlInput = page.locator("#share-url-input") -// await expect(shareUrlInput).toHaveText("") + test("Cancel YAML conversion", async ({ page }) => { + const editorTabs = page.locator("#tab") + const editors = page.locator(".editor") + await expect(editorTabs).toHaveCount(1) + await expect(editors).toHaveCount(1) + + const jsonYamlPopup = page.locator('.json-yaml-warning') + const initialEditor = page.locator("#editor1") + const jsonBtn = page.locator('#file-type-json') + const yamlBtn = page.locator('#file-type-yaml') + + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + await expect(initialEditor).toHaveAttribute('data-mode-id', "json") + await expect(jsonBtn).toBeChecked({ checked: true }) + await expect(yamlBtn).toBeChecked({ checked: false }) + + await yamlBtn.click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") + + await page.locator('#yaml-cancel-btn').click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + await expect(initialEditor).toHaveAttribute('data-mode-id', "json") + await expect(jsonBtn).toBeChecked({ checked: true }) + await expect(yamlBtn).toBeChecked({ checked: false }) + }) +}) -// const shareUrlBtn = page.locator("#share-url-btn") -// await shareUrlBtn.click() -// const newPlaygroundPromise = page.waitForEvent('popup') -// await openNewTab.click() -// const newPlaygroundPage = await newPlaygroundPromise +test.describe("Examples menu functionality", () => { + test("Open and close examples menu", async ({ page }) => { -// await expect(newPlaygroundPage).toHaveTitle("TD Playground") + await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) + await page.locator("#examples-btn").click() -// const newPlaygroundTab = newPlaygroundPage.locator("#tab").nth(0) -// await expect(newPlaygroundTab).toHaveAttribute('data-tab-id', "1") -// await expect(newPlaygroundTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(newPlaygroundTab).toHaveClass("active") + await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: true }) + await page.locator(".examples-menu-container__close > i").click() -// }) + await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) + }) -// test("Open in ediTDor functionality", async ({ page }) => { -// const saveMenu = page.locator(".save-menu") + test("Open Basic TD from quick access", async ({ page }) => { -// await page.locator("#save-btn").click() -// await expect(saveMenu).toHaveClass("save-menu") + await page.locator("#examples-btn").click() -// const shareUrlInput = page.locator("#share-url-input") -// await expect(shareUrlInput).toHaveText("") + const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) + await expect(basicExample).toHaveClass("example") -// const openEditdorBtn = page.locator("#open-editdor-btn") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) + await quickAccessBtn.click() -// const editdorPromise = page.waitForEvent('popup') -// await openEditdorBtn.click() -// const editdorPage = await editdorPromise + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await expect(editdorPage).toHaveTitle("ediTDor") + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveClass("editor active") -// const linkedTd = editdorPage.locator("#linkedTd > option") -// await expect(linkedTd).toHaveText("Thing Template") -// }) + }) -// test("Download functionality", async ({ page }) => { -// const saveMenu = page.locator(".save-menu") + test("Open Basic TD from apply button", async ({ page }) => { -// const exampleTab = page.locator("#tab").nth(0) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "1") -// await expect(exampleTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(exampleTab).toHaveClass("active") + await page.locator("#examples-btn").click() -// await page.locator("#save-btn").click() -// await expect(saveMenu).toHaveClass("save-menu") + const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) + await basicExample.click() + await expect(basicExample).toHaveClass("example open") -// const downloadTdBtn = page.locator(".save-td__download") + const applyBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Apply" }) + await applyBtn.click() + await expect(basicExample).toHaveClass("example") -// // Start waiting for download before clicking. -// const downloadPromise = page.waitForEvent('download') -// await downloadTdBtn.click() -// const download = await downloadPromise -// const expectedFilename = 'Thing-Template.json' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// //* The "Save as" functionality cannot be tested because it requires to open and interact with the file system wich Playwright cannot do -// }) + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveClass("editor active") + }) -// test.describe("Settings menu functionality", () => { -// test("Opening and closing the settings menu", async ({ page }) => { -// const settingsMenu = page.locator(".settings-menu") -// await expect(settingsMenu).toHaveClass("settings-menu closed") + test("Open Basic TD and close with cancel button", async ({ page }) => { + await page.locator("#examples-btn").click() -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + const basicTDExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) + await basicTDExample.click() + await expect(basicTDExample).toHaveClass("example open") -// const closeMenu = page.locator(".settings__close > i") -// await closeMenu.click() -// await expect(settingsMenu).toHaveClass("settings-menu closed") -// }) + const cancelBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Cancel" }) + await cancelBtn.click() + await expect(basicTDExample).toHaveClass("example") + }) -// test("Checking settings toggle buttons", async ({ page }) => { -// const settingsMenu = page.locator(".settings-menu") -// await expect(settingsMenu).toHaveClass("settings-menu closed") + test("Toggle between TD and TM examples", async ({ page }) => { + await page.locator("#examples-btn").click() -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + const thingTypeToggle = page.locator('#thing-type-btn') + await expect(thingTypeToggle).toBeChecked({ checked: false }) -// const autoValidate = page.locator("#auto-validate") -// const validateJsonld = page.locator("#validate-jsonld") -// const tmConformance = page.locator("#tm-conformance") + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) + }) -// await expect(autoValidate).toBeChecked({ checked: false }) -// await expect(validateJsonld).toBeChecked({ checked: true }) -// await expect(tmConformance).toBeChecked({ checked: true }) -// }) + test("Open Basic TM and check for icon change in tab", async ({ page }) => { + await page.locator("#examples-btn").click() -// test("Changing page theme", async ({ page }) => { -// const playgroundSite = page.locator("html") -// await expect(playgroundSite).toHaveClass("light-mode") + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const settingsMenu = page.locator(".settings-menu") -// await expect(settingsMenu).toHaveClass("settings-menu closed") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + const tabIcon = page.locator("#tab").nth(1).locator(".tab-icon") + await expect(tabIcon).toHaveText("TM") + }) -// const themePicker = page.locator("#theme-picker") -// await themePicker.selectOption('monochrome-mode') -// await expect(playgroundSite).toHaveClass("monochrome-mode") + test("Go to versioning in TD category and open example from quick access", async ({ page }) => { + await page.locator("#examples-btn").click() -// await themePicker.selectOption('dark-mode') -// await expect(playgroundSite).toHaveClass("dark-mode") + const categoryDropDown = page.locator("#thing-category") + await categoryDropDown.selectOption('9-versioning') -// await page.reload({ waitUntil: 'domcontentloaded' }) -// await expect(playgroundSite).toHaveClass("dark-mode") -// }) + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Versioning' }).nth(0).getByRole("button").nth(0) + await quickAccessBtn.click() -// test("Changing font size", async ({ page }) => { -// const settingsMenu = page.locator(".settings-menu") -// await expect(settingsMenu).toHaveClass("settings-menu closed") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") + }) -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + test("Go to Tm Optional in TM category and open example from quick access", async ({ page }) => { + await page.locator("#examples-btn").click() -// const editorFontSize = page.locator(".editor-font-size") -// await expect(editorFontSize).toHaveText("14") + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const fontSizeSlider = page.locator('#font-size') -// await fontSizeSlider.click() + const categoryDropDown = page.locator("#thing-category") + await categoryDropDown.selectOption('4-tm-optional') -// await expect(editorFontSize).toHaveText("23") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Optional Interaction Affordances' }).nth(0).getByRole("button").nth(0) + await quickAccessBtn.click() -// await page.reload({ waitUntil: 'domcontentloaded' }) + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") + await expect(exampleTab).toHaveClass("active") + }) -// await expect(settingsMenu).toHaveClass("settings-menu closed") + test("Search for uriVariable in the TDs and open Combined URI variables in href example", async ({ page }) => { + await page.locator("#examples-btn").click() -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + const searchInput = page.locator(".search-input") + searchInput.fill('uriVariables') -// await expect(editorFontSize).toHaveText("23") -// }) + const searchBtn = page.locator(".search-btn") + await searchBtn.click() -// test("Utilizing default settings", async ({ page }) => { -// const playgroundSite = page.locator("html") -// await expect(playgroundSite).toHaveClass("light-mode") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Combined URI variables in href' }).nth(0).getByRole("button").nth(0) + await quickAccessBtn.click() -// const settingsMenu = page.locator(".settings-menu") -// await expect(settingsMenu).toHaveClass("settings-menu closed") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyWeatherThingCloseCancel") + await expect(exampleTab).toHaveClass("active") + }) -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + test("Search for overwrite in the TMs and open Overwrite Existing Definitions example", async ({ page }) => { + await page.locator("#examples-btn").click() -// const themePicker = page.locator("#theme-picker") -// await themePicker.selectOption('dark-mode') -// await expect(playgroundSite).toHaveClass("dark-mode") + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const editorFontSize = page.locator(".editor-font-size") -// await expect(editorFontSize).toHaveText("14") + const searchInput = page.locator(".search-input") + searchInput.fill('overwrite') -// const fontSizeSlider = page.locator('#font-size') -// await fontSizeSlider.click() + const searchBtn = page.locator(".search-btn") + await searchBtn.click() -// await expect(editorFontSize).toHaveText("23") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Overwrite Existing Definitions' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// await page.reload({ waitUntil: 'domcontentloaded' }) + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMSmart Lamp ControlCloseCancel") + await expect(exampleTab).toHaveClass("active") + }) +}) -// await expect(settingsMenu).toHaveClass("settings-menu closed") +test.describe("Save menu functionality", () => { + test("Open and close save menu", async ({ page }) => { + const saveMenu = page.locator(".save-menu") + await expect(saveMenu).toHaveClass("save-menu closed") -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + await page.locator("#save-btn").click() + await expect(saveMenu).toHaveClass("save-menu") -// await expect(playgroundSite).toHaveClass("dark-mode") -// await expect(editorFontSize).toHaveText("23") + const closeMenu = page.locator(".save-menu-close > i") + await closeMenu.click() + await expect(saveMenu).toHaveClass("save-menu closed") + }) -// const resetSettings = page.locator('.reset-settings') -// await resetSettings.click() + test("Open save menu with template thing and check for TD in menu title", async ({ page }) => { + const saveMenu = page.locator(".save-menu") -// await expect(playgroundSite).toHaveClass("light-mode") -// await expect(editorFontSize).toHaveText("14") + await page.locator("#save-btn").click() + await expect(saveMenu).toHaveClass("save-menu") -// await page.reload({ waitUntil: 'domcontentloaded' }) + const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") + await expect(titleThingType).toHaveText("TD") + }) -// await expect(settingsMenu).toHaveClass("settings-menu closed") + test("Open TM examples check for TM in the save menu title", async ({ page }) => { + await page.locator("#examples-btn").click() -// await page.locator("#settings-btn").click() -// await expect(settingsMenu).toHaveClass("settings-menu") + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// await expect(playgroundSite).toHaveClass("light-mode") -// await expect(editorFontSize).toHaveText("14") -// }) -// }) + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// test.describe("Validation view functionality", () => { + const saveMenu = page.locator(".save-menu") -// test("Starting the validation with the main validation button", async ({ page }) => { + await page.locator("#save-btn").click() + await expect(saveMenu).toHaveClass("save-menu") -// const validationTab = page.locator('#validation-tab') -// const validationView = page.locator('#validation-view') + const titleThingType = page.locator(".save-menu-title > p > #thing-type-text") + await expect(titleThingType).toHaveText("TM") + }) -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + test("Share and open in new tab functionality with an example", async ({ page }) => { -// const stateIcon = page.locator(".json-validation-section > .section-header > i").nth(0) -// await expect(stateIcon).toHaveClass("fa-solid fa-circle") + await page.locator("#examples-btn").click() -// const validationBtn = page.locator("#validate-btn") -// await validationBtn.click() + const basicExample = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0) + await expect(basicExample).toHaveClass("example") -// //TODO: Find a better way to wait for this event to happen -// await page.waitForTimeout(5000) -// await expect(stateIcon).toHaveClass("fa-solid fa-circle-check") -// }) + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").nth(0) + await quickAccessBtn.click() -// test("Validating the 'All Defaults TD'", async ({ page }) => { -// const validationTab = page.locator('#validation-tab') -// const validationView = page.locator('#validation-view') + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + const saveMenu = page.locator(".save-menu") -// await page.locator("#examples-btn").click() + await page.locator("#save-btn").click() + await expect(saveMenu).toHaveClass("save-menu") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'All Default Values' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const openNewTab = page.locator("#open-url-tab") + await expect(openNewTab).toBeDisabled() -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const shareUrlInput = page.locator("#share-url-input") + await expect(shareUrlInput).toHaveText("") -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + const shareUrlBtn = page.locator("#share-url-btn") + await shareUrlBtn.click() -// const validationBtn = page.locator("#validate-btn") -// await validationBtn.click() + const newPlaygroundPromise = page.waitForEvent('popup') + await openNewTab.click() + const newPlaygroundPage = await newPlaygroundPromise -// //validation section -// const jsonValidationSection = page.locator(".json-validation-section") -// const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) -// const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") + await expect(newPlaygroundPage).toHaveTitle("TD Playground") -// await jsonValidationSection.click() -// await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + const newPlaygroundTab = newPlaygroundPage.locator("#tab").nth(0) + await expect(newPlaygroundTab).toHaveAttribute('data-tab-id', "1") + await expect(newPlaygroundTab).toHaveText("TDMyLampThingCloseCancel") + await expect(newPlaygroundTab).toHaveClass("active") -// const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") -// const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) -// const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") + }) -// await jsonSchemaValidationSection.click() -// await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + test("Open in ediTDor functionality", async ({ page }) => { + const saveMenu = page.locator(".save-menu") -// const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") -// const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) -// const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li") + await page.locator("#save-btn").click() + await expect(saveMenu).toHaveClass("save-menu") -// await jsonSchemaDefaultsSection.click() -// await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-check") + const shareUrlInput = page.locator("#share-url-input") + await expect(shareUrlInput).toHaveText("") -// const jsonlsValidationSection = page.locator(".jsonls-validation-section") -// const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) -// const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") + const openEditdorBtn = page.locator("#open-editdor-btn") -// await jsonlsValidationSection.click() -// await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + const editdorPromise = page.waitForEvent('popup') + await openEditdorBtn.click() + const editdorPage = await editdorPromise -// const additionalChecksSection = page.locator(".additional-checks-section") -// const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) -// const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") + await expect(editdorPage).toHaveTitle("ediTDor") -// await additionalChecksSection.click() -// await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") -// await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") -// }) + const linkedTd = editdorPage.locator("#linkedTd > option") + await expect(linkedTd).toHaveText("Thing Template") + }) -// test("Validating the 'Basic TD'", async ({ page }) => { -// const validationTab = page.locator('#validation-tab') -// const validationView = page.locator('#validation-view') + test("Download functionality", async ({ page }) => { + const saveMenu = page.locator(".save-menu") -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + const exampleTab = page.locator("#tab").nth(0) + await expect(exampleTab).toHaveAttribute('data-tab-id', "1") + await expect(exampleTab).toHaveText("TDThing TemplateCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await page.locator("#examples-btn").click() + await page.locator("#save-btn").click() + await expect(saveMenu).toHaveClass("save-menu") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const downloadTdBtn = page.locator(".save-td__download") -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + // Start waiting for download before clicking. + const downloadPromise = page.waitForEvent('download') + await downloadTdBtn.click() + const download = await downloadPromise + const expectedFilename = 'Thing-Template.json' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + //* The "Save as" functionality cannot be tested because it requires to open and interact with the file system wich Playwright cannot do +}) -// const validationBtn = page.locator("#validate-btn") -// await validationBtn.click() +test.describe("Settings menu functionality", () => { + test("Opening and closing the settings menu", async ({ page }) => { + const settingsMenu = page.locator(".settings-menu") + await expect(settingsMenu).toHaveClass("settings-menu closed") -// //Validation section -// const jsonValidationSection = page.locator(".json-validation-section") -// const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) -// const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// await jsonValidationSection.click() -// await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + const closeMenu = page.locator(".settings__close > i") + await closeMenu.click() + await expect(settingsMenu).toHaveClass("settings-menu closed") + }) -// const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") -// const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) -// const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") + test("Checking settings toggle buttons", async ({ page }) => { + const settingsMenu = page.locator(".settings-menu") + await expect(settingsMenu).toHaveClass("settings-menu closed") -// await jsonSchemaValidationSection.click() -// await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") -// const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) -// const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) + const autoValidate = page.locator("#auto-validate") + const validateJsonld = page.locator("#validate-jsonld") + const tmConformance = page.locator("#tm-conformance") -// await jsonSchemaDefaultsSection.click() -// await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Optional validation failed:") -// await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-exclamation") + await expect(autoValidate).toBeChecked({ checked: false }) + await expect(validateJsonld).toBeChecked({ checked: true }) + await expect(tmConformance).toBeChecked({ checked: true }) + }) -// const jsonlsValidationSection = page.locator(".jsonls-validation-section") -// const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) -// const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") + test("Changing page theme", async ({ page }) => { + const playgroundSite = page.locator("html") + await expect(playgroundSite).toHaveClass("light-mode") -// await jsonlsValidationSection.click() -// await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + const settingsMenu = page.locator(".settings-menu") + await expect(settingsMenu).toHaveClass("settings-menu closed") -// const additionalChecksSection = page.locator(".additional-checks-section") -// const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) -// const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// await additionalChecksSection.click() -// await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") -// await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") -// }) + const themePicker = page.locator("#theme-picker") + await themePicker.selectOption('monochrome-mode') + await expect(playgroundSite).toHaveClass("monochrome-mode") -// test("Validating the 'Basic TM'", async ({ page }) => { + await themePicker.selectOption('dark-mode') + await expect(playgroundSite).toHaveClass("dark-mode") -// const validationTab = page.locator('#validation-tab') -// const validationView = page.locator('#validation-view') + await page.reload({ waitUntil: 'domcontentloaded' }) + await expect(playgroundSite).toHaveClass("dark-mode") + }) -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + test("Changing font size", async ({ page }) => { + const settingsMenu = page.locator(".settings-menu") + await expect(settingsMenu).toHaveClass("settings-menu closed") -// await page.locator("#examples-btn").click() + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + const editorFontSize = page.locator(".editor-font-size") + await expect(editorFontSize).toHaveText("14") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + const fontSizeSlider = page.locator('#font-size') + await fontSizeSlider.click() -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(editorFontSize).toHaveText("23") -// await expect(validationTab).toBeChecked() -// await expect(validationView).toHaveClass("console-view validation-view") + await page.reload({ waitUntil: 'domcontentloaded' }) -// const validationBtn = page.locator("#validate-btn") -// await validationBtn.click() + await expect(settingsMenu).toHaveClass("settings-menu closed") -// //Validation section -// const jsonValidationSection = page.locator(".json-validation-section") -// const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) -// const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// await jsonValidationSection.click() -// await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(editorFontSize).toHaveText("23") + }) -// const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") -// const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) -// const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") + test("Utilizing default settings", async ({ page }) => { + const playgroundSite = page.locator("html") + await expect(playgroundSite).toHaveClass("light-mode") -// await jsonSchemaValidationSection.click() -// await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + const settingsMenu = page.locator(".settings-menu") + await expect(settingsMenu).toHaveClass("settings-menu closed") -// const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") -// const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) -// const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// await jsonSchemaDefaultsSection.click() -// await expect(jsonSchemaDefaultsSectionTxt).toHaveText("A previous validation has failed or it is only available for Thing Descriptions") -// await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle") + const themePicker = page.locator("#theme-picker") + await themePicker.selectOption('dark-mode') + await expect(playgroundSite).toHaveClass("dark-mode") -// const jsonlsValidationSection = page.locator(".jsonls-validation-section") -// const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) -// const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") + const editorFontSize = page.locator(".editor-font-size") + await expect(editorFontSize).toHaveText("14") -// await jsonlsValidationSection.click() -// await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") -// await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + const fontSizeSlider = page.locator('#font-size') + await fontSizeSlider.click() -// const additionalChecksSection = page.locator(".additional-checks-section") -// const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) -// const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") + await expect(editorFontSize).toHaveText("23") -// await additionalChecksSection.click() -// await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") -// await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") -// }) + await page.reload({ waitUntil: 'domcontentloaded' }) -// }) + await expect(settingsMenu).toHaveClass("settings-menu closed") -// test.describe("OpenAPI view functionality", () => { -// test("Trying to open the OpenAPI view with a TD with no protocols", async ({ page }) => { + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// const initialTab = page.locator("#tab").nth(0) -// await expect(initialTab).toHaveAttribute('data-tab-id', "1") -// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(initialTab).toHaveClass("active") + await expect(playgroundSite).toHaveClass("dark-mode") + await expect(editorFontSize).toHaveText("23") -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") + const resetSettings = page.locator('.reset-settings') + await resetSettings.click() -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) + await expect(playgroundSite).toHaveClass("light-mode") + await expect(editorFontSize).toHaveText("14") -// await openAPITab.click() + await page.reload({ waitUntil: 'domcontentloaded' }) -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses HTTP!") -// }) + await expect(settingsMenu).toHaveClass("settings-menu closed") -// test("Trying to open the OpenAPI view with a TM", async ({ page }) => { + await page.locator("#settings-btn").click() + await expect(settingsMenu).toHaveClass("settings-menu") -// await page.locator("#examples-btn").click() + await expect(playgroundSite).toHaveClass("light-mode") + await expect(editorFontSize).toHaveText("14") + }) +}) -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) +test.describe("Validation view functionality", () => { -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + test("Starting the validation with the main validation button", async ({ page }) => { -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const validationTab = page.locator('#validation-tab') + const validationView = page.locator('#validation-view') -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) + const stateIcon = page.locator(".json-validation-section > .section-header > i").nth(0) + await expect(stateIcon).toHaveClass("fa-solid fa-circle") -// await openAPITab.click() + const validationBtn = page.locator("#validate-btn") + await validationBtn.click() -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") + //TODO: Find a better way to wait for this event to happen + await page.waitForTimeout(5000) + await expect(stateIcon).toHaveClass("fa-solid fa-circle-check") + }) -// }) + test("Validating the 'All Defaults TD'", async ({ page }) => { + const validationTab = page.locator('#validation-tab') + const validationView = page.locator('#validation-view') -// test("Open the OpenAPI view with the 'Basic TD' example", async ({ page }) => { -// await page.locator("#examples-btn").click() + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + await page.locator("#examples-btn").click() -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'All Default Values' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) + const validationBtn = page.locator("#validate-btn") + await validationBtn.click() -// await openAPITab.click() + //validation section + const jsonValidationSection = page.locator(".json-validation-section") + const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) + const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await jsonValidationSection.click() + await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// const openAPIEditor = page.locator('#open-api-container') -// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) + const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") + const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) + const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') + await jsonSchemaValidationSection.click() + await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// const openAPIJsonBtn = page.locator('#open-api-json') + const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") + const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) + const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li") -// await expect(openAPIJsonBtn).toBeDisabled() + await jsonSchemaDefaultsSection.click() + await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Validated Successfully") + await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-check") -// }) + const jsonlsValidationSection = page.locator(".jsonls-validation-section") + const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) + const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") -// test("Open the OpenAPI view with the 'Basic TD' example as YAML", async ({ page }) => { + await jsonlsValidationSection.click() + await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// await page.locator("#examples-btn").click() + const additionalChecksSection = page.locator(".additional-checks-section") + const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) + const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + await additionalChecksSection.click() + await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") + await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") + }) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + test("Validating the 'Basic TD'", async ({ page }) => { + const validationTab = page.locator('#validation-tab') + const validationView = page.locator('#validation-view') -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") + await page.locator("#examples-btn").click() -// const jsonYamlPopup = page.locator('.json-yaml-warning') -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// const jsonBtn = page.locator('#file-type-json') -// const yamlBtn = page.locator('#file-type-yaml') + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") -// await yamlBtn.click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") + const validationBtn = page.locator("#validate-btn") + await validationBtn.click() -// await page.locator('#yaml-confirm-btn').click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(jsonBtn).toBeChecked({ checked: false }) -// await expect(yamlBtn).toBeChecked({ checked: true }) + //Validation section + const jsonValidationSection = page.locator(".json-validation-section") + const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) + const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") + await jsonValidationSection.click() + await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) + const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") + const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) + const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") -// await openAPITab.click() + await jsonSchemaValidationSection.click() + await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") + const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) + const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) -// const openAPIEditor = page.locator('#open-api-container') -// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: "3.0.3"' }).nth(4) + await jsonSchemaDefaultsSection.click() + await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Optional validation failed:") + await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-exclamation") -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(openAPIContainer).toHaveText('openapi: "3.0.3"') + const jsonlsValidationSection = page.locator(".jsonls-validation-section") + const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) + const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") -// const openAPIYamlBtn = page.locator('#open-api-yaml') -// await expect(openAPIYamlBtn).toBeDisabled() + await jsonlsValidationSection.click() + await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// }) + const additionalChecksSection = page.locator(".additional-checks-section") + const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) + const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") -// test("Open the OpenAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { -// await page.locator("#examples-btn").click() + await additionalChecksSection.click() + await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") + await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") + }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + test("Validating the 'Basic TM'", async ({ page }) => { -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const validationTab = page.locator('#validation-tab') + const validationView = page.locator('#validation-view') -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") + await page.locator("#examples-btn").click() -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// await openAPITab.click() + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const openAPIEditor = page.locator('#open-api-container') + await expect(validationTab).toBeChecked() + await expect(validationView).toHaveClass("console-view validation-view") -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") + const validationBtn = page.locator("#validate-btn") + await validationBtn.click() -// const openAPIJsonBtn = page.locator('#open-api-json') -// const openAPIYamlBtn = page.locator('#open-api-yaml') + //Validation section + const jsonValidationSection = page.locator(".json-validation-section") + const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) + const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") -// await expect(openAPIJsonBtn).toBeDisabled() + await jsonValidationSection.click() + await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// await openAPIYamlBtn.click() + const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") + const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) + const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(openAPIYamlBtn).toBeDisabled() + await jsonSchemaValidationSection.click() + await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// await openAPIJsonBtn.click() + const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") + const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) + const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(openAPIJsonBtn).toBeDisabled() -// }) + await jsonSchemaDefaultsSection.click() + await expect(jsonSchemaDefaultsSectionTxt).toHaveText("A previous validation has failed or it is only available for Thing Descriptions") + await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle") -// test("Open the OpenAPI view and downloading it as JSON", async ({ page }) => { -// await page.locator("#examples-btn").click() + const jsonlsValidationSection = page.locator(".jsonls-validation-section") + const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) + const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + await jsonlsValidationSection.click() + await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") + await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const additionalChecksSection = page.locator(".additional-checks-section") + const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) + const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + await additionalChecksSection.click() + await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") + await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") + }) -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") +}) -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) +test.describe("OpenAPI view functionality", () => { + test("Trying to open the OpenAPI view with a TD with no protocols", async ({ page }) => { -// await openAPITab.click() + const initialTab = page.locator("#tab").nth(0) + await expect(initialTab).toHaveAttribute('data-tab-id', "1") + await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") + await expect(initialTab).toHaveClass("active") -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// const openAPIEditor = page.locator('#open-api-container') -// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') + await openAPITab.click() -// const openAPIJsonBtn = page.locator('#open-api-json') -// await expect(openAPIJsonBtn).toBeDisabled() + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses HTTP!") + }) -// // Start waiting for download before clicking. -// const openAPIDownload = page.locator('#open-api-download') -// const downloadPromise = page.waitForEvent('download') -// await openAPIDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'MyLampThing-OpenAPI.json' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + test("Trying to open the OpenAPI view with a TM", async ({ page }) => { -// test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { -// await page.locator("#examples-btn").click() + await page.locator("#examples-btn").click() -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const openAPIView = page.locator('#open-api-view') -// const consoleError = page.locator('#console-error') -// const openAPITab = page.locator("#open-api-tab") + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// await expect(openAPIView).toHaveClass("console-view open-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(openAPITab).toBeChecked({ checked: false }) + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// await openAPITab.click() + await openAPITab.click() -// await expect(openAPITab).toBeChecked({ checked: true }) -// await expect(openAPIView).toHaveClass("console-view open-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") -// const openAPIEditor = page.locator('#open-api-container') + }) -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") + test("Open the OpenAPI view with the 'Basic TD' example", async ({ page }) => { + await page.locator("#examples-btn").click() -// const openAPIJsonBtn = page.locator('#open-api-json') -// const openAPIYamlBtn = page.locator('#open-api-yaml') + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// await expect(openAPIJsonBtn).toBeDisabled() + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await openAPIYamlBtn.click() + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(openAPIYamlBtn).toBeDisabled() + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: 3.0.3' }).nth(4) -// await expect(openAPIContainer).toHaveText('openapi: 3.0.3') + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// // Start waiting for download before clicking. -// const openAPIDownload = page.locator('#open-api-download') -// const downloadPromise = page.waitForEvent('download') -// await openAPIDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'MyLampThing-OpenAPI.yaml' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) -// }) + await openAPITab.click() -// test.describe("AsyncAPI view functionality", () => { -// test("Trying to open the AsyncAPI view with a TD with no protocols", async ({ page }) => { + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const initialTab = page.locator("#tab").nth(0) -// await expect(initialTab).toHaveAttribute('data-tab-id', "1") -// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(initialTab).toHaveClass("active") + const openAPIEditor = page.locator('#open-api-container') + const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") + await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) + const openAPIJsonBtn = page.locator('#open-api-json') -// await AsyncAPITab.click() + await expect(openAPIJsonBtn).toBeDisabled() -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses MQTT!") -// }) + }) -// test("Trying to open the AsyncAPI view with a TM", async ({ page }) => { + test("Open the OpenAPI view with the 'Basic TD' example as YAML", async ({ page }) => { -// await page.locator("#examples-btn").click() + await page.locator("#examples-btn").click() -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) + const jsonYamlPopup = page.locator('.json-yaml-warning') + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await AsyncAPITab.click() + const jsonBtn = page.locator('#file-type-json') + const yamlBtn = page.locator('#file-type-yaml') -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") + await expect(jsonBtn).toBeChecked({ checked: true }) + await expect(yamlBtn).toBeChecked({ checked: false }) -// }) + await yamlBtn.click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") -// /** -// * TODO: Do to a lack of examples that include the mqtt protocol this cannot be tested, nonetheless once -// * TODO: this is added the code below should sufice with minimal adjustments -// test("Open the AsyncAPI view with the '---' example", async ({ page }) => { -// await page.locator("#examples-btn").click() + await page.locator('#yaml-confirm-btn').click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(jsonBtn).toBeChecked({ checked: false }) + await expect(yamlBtn).toBeChecked({ checked: true }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TD---CloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + await openAPITab.click() -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) + const openAPIEditor = page.locator('#open-api-container') + const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: "3.0.3"' }).nth(4) -// await AsyncAPITab.click() + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(openAPIContainer).toHaveText('openapi: "3.0.3"') -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const openAPIYamlBtn = page.locator('#open-api-yaml') + await expect(openAPIYamlBtn).toBeDisabled() -// const AsyncAPIEditor = page.locator('#async-api-container') -// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: '"asyncapi": "2.0.0",' }).nth(4) + }) -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(AsyncAPIContainer).toHaveText('"asyncapi": "2.0.0",') + test("Open the OpenAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { + await page.locator("#examples-btn").click() -// const AsyncAPIJsonBtn = page.locator('#async-api-json') + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// await expect(AsyncAPIJsonBtn).toBeDisabled() + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// }) + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// test("Open the AsyncAPI view with the '---' example as YAML", async ({ page }) => { + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// await page.locator("#examples-btn").click() + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + await openAPITab.click() -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TD---CloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + const openAPIEditor = page.locator('#open-api-container') + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") -// const jsonYamlPopup = page.locator('.json-yaml-warning') -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + const openAPIJsonBtn = page.locator('#open-api-json') + const openAPIYamlBtn = page.locator('#open-api-yaml') -// const jsonBtn = page.locator('#file-type-json') -// const yamlBtn = page.locator('#file-type-yaml') + await expect(openAPIJsonBtn).toBeDisabled() -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) + await openAPIYamlBtn.click() -// await yamlBtn.click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(openAPIYamlBtn).toBeDisabled() -// await page.locator('#yaml-confirm-btn').click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(jsonBtn).toBeChecked({ checked: false }) -// await expect(yamlBtn).toBeChecked({ checked: true }) + await openAPIJsonBtn.click() -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") + await expect(openAPIJsonBtn).toBeDisabled() + }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) + test("Open the OpenAPI view and downloading it as JSON", async ({ page }) => { + await page.locator("#examples-btn").click() -// await AsyncAPITab.click() + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const AsyncAPIEditor = page.locator('#async-api-container') -// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: 'asyncapi: 2.0.0' }).nth(4) + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(AsyncAPIContainer).toHaveText('asyncapi: 2.0.0') + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// const AsyncAPIYamlBtn = page.locator('#async-api-yaml') -// await expect(AsyncAPIYamlBtn).toBeDisabled() + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// }) + await openAPITab.click() -// test("Open the AsyncAPI view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { -// await page.locator("#examples-btn").click() + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const openAPIEditor = page.locator('#open-api-container') + const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: '"openapi": "3.0.3",' }).nth(4) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TD---CloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") + await expect(openAPIContainer).toHaveText('\"openapi\": \"3.0.3\",') -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + const openAPIJsonBtn = page.locator('#open-api-json') + await expect(openAPIJsonBtn).toBeDisabled() -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") + // Start waiting for download before clicking. + const openAPIDownload = page.locator('#open-api-download') + const downloadPromise = page.waitForEvent('download') + await openAPIDownload.click() + const download = await downloadPromise + const expectedFilename = 'MyLampThing-OpenAPI.json' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) + test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { + await page.locator("#examples-btn").click() -// await AsyncAPITab.click() + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const AsyncAPIEditor = page.locator('#async-api-container') + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") + const openAPIView = page.locator('#open-api-view') + const consoleError = page.locator('#console-error') + const openAPITab = page.locator("#open-api-tab") -// const AsyncAPIJsonBtn = page.locator('#async-api-json') -// const AsyncAPIYamlBtn = page.locator('#async-api-yaml') + await expect(openAPIView).toHaveClass("console-view open-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(openAPITab).toBeChecked({ checked: false }) -// await expect(AsyncAPIJsonBtn).toBeDisabled() + await openAPITab.click() -// await AsyncAPIYamlBtn.click() + await expect(openAPITab).toBeChecked({ checked: true }) + await expect(openAPIView).toHaveClass("console-view open-api-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(AsyncAPIYamlBtn).toBeDisabled() + const openAPIEditor = page.locator('#open-api-container') -// await AsyncAPIJsonBtn.click() + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(AsyncAPIJsonBtn).toBeDisabled() -// }) + const openAPIJsonBtn = page.locator('#open-api-json') + const openAPIYamlBtn = page.locator('#open-api-yaml') -// test("Open the AsyncAPI view and downloading it as JSON", async ({ page }) => { -// await page.locator("#examples-btn").click() + await expect(openAPIJsonBtn).toBeDisabled() -// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + await openAPIYamlBtn.click() -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TD---CloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(openAPIEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(openAPIYamlBtn).toBeDisabled() -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + const openAPIContainer = openAPIEditor.getByRole('code').locator('div').filter({ hasText: 'openapi: 3.0.3' }).nth(4) + await expect(openAPIContainer).toHaveText('openapi: 3.0.3') -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") + // Start waiting for download before clicking. + const openAPIDownload = page.locator('#open-api-download') + const downloadPromise = page.waitForEvent('download') + await openAPIDownload.click() + const download = await downloadPromise + const expectedFilename = 'MyLampThing-OpenAPI.yaml' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) +}) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) +test.describe("AsyncAPI view functionality", () => { + test("Trying to open the AsyncAPI view with a TD with no protocols", async ({ page }) => { -// await AsyncAPITab.click() + const initialTab = page.locator("#tab").nth(0) + await expect(initialTab).toHaveAttribute('data-tab-id', "1") + await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") + await expect(initialTab).toHaveClass("active") -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const AsyncAPIView = page.locator('#async-api-view') + const consoleError = page.locator('#console-error') + const AsyncAPITab = page.locator("#async-api-tab") -// const AsyncAPIEditor = page.locator('#async-api-container') -// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: '"asyncapi": "2.0.0",' }).nth(4) + await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(AsyncAPITab).toBeChecked({ checked: false }) -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") -// await expect(AsyncAPIContainer).toHaveText('\"asyncapi\": \"2.0.0\",') + await AsyncAPITab.click() -// const AsyncAPIJsonBtn = page.locator('#async-api-json') -// await expect(AsyncAPIJsonBtn).toBeDisabled() + await expect(AsyncAPITab).toBeChecked({ checked: true }) + await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") + await expect(page.locator(".console-error__txt")).toHaveText("Please insert a TD which uses MQTT!") + }) -// // Start waiting for download before clicking. -// const AsyncAPIDownload = page.locator('#async-api-download') -// const downloadPromise = page.waitForEvent('download') -// await AsyncAPIDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'MyLampThing-AsyncAPI.json' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + test("Trying to open the AsyncAPI view with a TM", async ({ page }) => { -// test("Open the AsyncAPI view and downloading it as YAML", async ({ page }) => { -// await page.locator("#examples-btn").click() + await page.locator("#examples-btn").click() -// const quickAccessBtn = page.locator(".example").filter({ hasText: '---' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TD---CloseCancel") -// await expect(exampleTab).toHaveClass("active") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const AsyncAPIView = page.locator('#async-api-view') -// const consoleError = page.locator('#console-error') -// const AsyncAPITab = page.locator("#async-api-tab") + const AsyncAPIView = page.locator('#async-api-view') + const consoleError = page.locator('#console-error') + const AsyncAPITab = page.locator("#async-api-tab") -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AsyncAPITab).toBeChecked({ checked: false }) + await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(AsyncAPITab).toBeChecked({ checked: false }) -// await AsyncAPITab.click() + await AsyncAPITab.click() -// await expect(AsyncAPITab).toBeChecked({ checked: true }) -// await expect(AsyncAPIView).toHaveClass("console-view async-api-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(AsyncAPITab).toBeChecked({ checked: true }) + await expect(AsyncAPIView).toHaveClass("console-view async-api-view hidden") + await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") -// const AsyncAPIEditor = page.locator('#async-api-container') + }) +}) -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "json") -// const AsyncAPIJsonBtn = page.locator('#async-api-json') -// const AsyncAPIYamlBtn = page.locator('#async-api-yaml') +test.describe("AAS AID view functionality", () => { -// await expect(AsyncAPIJsonBtn).toBeDisabled() + test("Trying to open the AAS view with a TM", async ({ page }) => { -// await AsyncAPIYamlBtn.click() + await page.locator("#examples-btn").click() -// await expect(AsyncAPIEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(AsyncAPIYamlBtn).toBeDisabled() + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const AsyncAPIContainer = AsyncAPIEditor.getByRole('code').locator('div').filter({ hasText: 'asyncapi: 2.0.0' }).nth(4) -// await expect(AsyncAPIContainer).toHaveText('asyncapi: 2.0.0') + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// // Start waiting for download before clicking. -// const AsyncAPIDownload = page.locator('#async-api-download') -// const downloadPromise = page.waitForEvent('download') -// await AsyncAPIDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'MyLampThing-AsyncAPI.yaml' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) -// */ -// }) + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") + await expect(exampleTab).toHaveClass("active") + const AASView = page.locator('#aas-view') + const consoleError = page.locator('#console-error') + const AASTab = page.locator("#aas-tab") -// test.describe("AAS AID view functionality", () => { + await expect(AASView).toHaveClass("console-view aas-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(AASTab).toBeChecked({ checked: false }) -// test("Trying to open the AAS view with a TM", async ({ page }) => { + await AASTab.click() -// await page.locator("#examples-btn").click() + await expect(AASTab).toBeChecked({ checked: true }) + await expect(AASView).toHaveClass("console-view aas-view hidden") + await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + test("Open the AAS AID view with the 'Basic TD' example", async ({ page }) => { + await page.locator("#examples-btn").click() -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// const AASView = page.locator('#aas-view') -// const consoleError = page.locator('#console-error') -// const AASTab = page.locator("#aas-tab") + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await expect(AASView).toHaveClass("console-view aas-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AASTab).toBeChecked({ checked: false }) + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// await AASTab.click() + const AASView = page.locator('#aas-view') + const consoleError = page.locator('#console-error') + const AASTab = page.locator("#aas-tab") -// await expect(AASTab).toBeChecked({ checked: true }) -// await expect(AASView).toHaveClass("console-view aas-view hidden") -// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") + await expect(AASView).toHaveClass("console-view aas-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(AASTab).toBeChecked({ checked: false }) -// }) + await AASTab.click() -// test("Open the AAS AID view with the 'Basic TD' example", async ({ page }) => { -// await page.locator("#examples-btn").click() + await expect(AASTab).toBeChecked({ checked: true }) + await expect(AASView).toHaveClass("console-view aas-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const ASSEditor = page.locator('#aas-container') + const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") + await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + }) -// const AASView = page.locator('#aas-view') -// const consoleError = page.locator('#console-error') -// const AASTab = page.locator("#aas-tab") + test("Open the AAS AID view with the 'Basic TD' example and downloading it", async ({ page }) => { + await page.locator("#examples-btn").click() -// await expect(AASView).toHaveClass("console-view aas-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AASTab).toBeChecked({ checked: false }) + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) + await quickAccessBtn.click() -// await AASTab.click() + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// await expect(AASTab).toBeChecked({ checked: true }) -// await expect(AASView).toHaveClass("console-view aas-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const exampleEditor = page.locator("#editor2") + await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") + await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") + await expect(exampleEditor).toHaveClass("editor active") -// const ASSEditor = page.locator('#aas-container') -// const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) + const AASView = page.locator('#aas-view') + const consoleError = page.locator('#console-error') + const AASTab = page.locator("#aas-tab") -// await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") -// await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') + await expect(AASView).toHaveClass("console-view aas-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(AASTab).toBeChecked({ checked: false }) -// }) + await AASTab.click() -// test("Open the AAS AID view with the 'Basic TD' example and downloading it", async ({ page }) => { -// await page.locator("#examples-btn").click() + await expect(AASTab).toBeChecked({ checked: true }) + await expect(AASView).toHaveClass("console-view aas-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).getByRole("button").nth(0) -// await quickAccessBtn.click() + const ASSEditor = page.locator('#aas-container') + const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TDMyLampThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") + await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') -// const exampleEditor = page.locator("#editor2") -// await expect(exampleEditor).toHaveAttribute('data-ide-id', "2") -// await expect(exampleEditor).toHaveAttribute('data-mode-id', "json") -// await expect(exampleEditor).toHaveClass("editor active") + // Start waiting for download before clicking. + const AASDownload = page.locator('#aas-download') + const downloadPromise = page.waitForEvent('download') + await AASDownload.click() + const download = await downloadPromise + const expectedFilename = 'MyLampThing-AAS.json' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) +}) -// const AASView = page.locator('#aas-view') -// const consoleError = page.locator('#console-error') -// const AASTab = page.locator("#aas-tab") +test.describe("Defaults view functionality", () => { + test("Opening the Defaults view with the Thing Template", async ({ page }) => { -// await expect(AASView).toHaveClass("console-view aas-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(AASTab).toBeChecked({ checked: false }) + const initialTab = page.locator("#tab").nth(0) + await expect(initialTab).toHaveAttribute('data-tab-id', "1") + await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") + await expect(initialTab).toHaveClass("active") -// await AASTab.click() + const DefaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const DefaultsTab = page.locator("#defaults-tab") -// await expect(AASTab).toBeChecked({ checked: true }) -// await expect(AASView).toHaveClass("console-view aas-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(DefaultsTab).toBeChecked({ checked: false }) -// const ASSEditor = page.locator('#aas-container') -// const ASSContainer = ASSEditor.getByRole('code').locator('div').filter({ hasText: '"idShort": "AssetInterfacesDescription",' }).nth(4) + await DefaultsTab.click() -// await expect(ASSEditor).toHaveAttribute('data-mode-id', "json") -// await expect(ASSContainer).toHaveText('"idShort": "AssetInterfacesDescription",') + await expect(DefaultsTab).toBeChecked({ checked: true }) + await expect(DefaultsView).toHaveClass("console-view defaults-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// // Start waiting for download before clicking. -// const AASDownload = page.locator('#aas-download') -// const downloadPromise = page.waitForEvent('download') -// await AASDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'MyLampThing-AAS.json' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) -// }) + const defaultsEditor = page.locator('#defaults-container') + const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: '"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",' }).nth(4) -// test.describe("Defaults view functionality", () => { -// test("Opening the Defaults view with the Thing Template", async ({ page }) => { + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") + await expect(defaultsContainer).toHaveText('"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",') -// const initialTab = page.locator("#tab").nth(0) -// await expect(initialTab).toHaveAttribute('data-tab-id', "1") -// await expect(initialTab).toHaveText("TDThing TemplateCloseCancel") -// await expect(initialTab).toHaveClass("active") + const defaultsJsonBtn = page.locator('#defaults-json') + const defaultsAddBtn = page.locator('#defaults-add') -// const DefaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const DefaultsTab = page.locator("#defaults-tab") + await expect(defaultsJsonBtn).toBeDisabled() + await expect(defaultsAddBtn).toBeDisabled() + }) -// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(DefaultsTab).toBeChecked({ checked: false }) + test("Trying to open the Defaults view with a TM", async ({ page }) => { -// await DefaultsTab.click() + await page.locator("#examples-btn").click() -// await expect(DefaultsTab).toBeChecked({ checked: true }) -// await expect(DefaultsView).toHaveClass("console-view defaults-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const thingTypeToggle = page.locator('#thing-type-btn') + await thingTypeToggle.click() + await expect(thingTypeToggle).toBeChecked({ checked: true }) -// const defaultsEditor = page.locator('#defaults-container') -// const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: '"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",' }).nth(4) + const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) + await quickAccessBtn.click() -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") -// await expect(defaultsContainer).toHaveText('"description": "This is your customizable template. Edit it to fit your Thing Description or Thing Model needs!",') + const exampleTab = page.locator("#tab").nth(1) + await expect(exampleTab).toHaveAttribute('data-tab-id', "2") + await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") + await expect(exampleTab).toHaveClass("active") -// const defaultsJsonBtn = page.locator('#defaults-json') -// const defaultsAddBtn = page.locator('#defaults-add') + const DefaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const DefaultsTab = page.locator("#defaults-tab") -// await expect(defaultsJsonBtn).toBeDisabled() -// await expect(defaultsAddBtn).toBeDisabled() -// }) + await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(DefaultsTab).toBeChecked({ checked: false }) -// test("Trying to open the Defaults view with a TM", async ({ page }) => { + await DefaultsTab.click() -// await page.locator("#examples-btn").click() + await expect(DefaultsTab).toBeChecked({ checked: true }) + await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") + await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") -// const thingTypeToggle = page.locator('#thing-type-btn') -// await thingTypeToggle.click() -// await expect(thingTypeToggle).toBeChecked({ checked: true }) + }) -// const quickAccessBtn = page.locator(".example").filter({ hasText: 'Basic TM' }).nth(1).getByRole("button").nth(0) -// await quickAccessBtn.click() + test("Open the Defaults view as YAML", async ({ page }) => { -// const exampleTab = page.locator("#tab").nth(1) -// await expect(exampleTab).toHaveAttribute('data-tab-id', "2") -// await expect(exampleTab).toHaveText("TMLamp ThingCloseCancel") -// await expect(exampleTab).toHaveClass("active") + const templateEditor = page.locator("#editor1") + await expect(templateEditor).toHaveAttribute('data-ide-id', "1") + await expect(templateEditor).toHaveAttribute('data-mode-id', "json") + await expect(templateEditor).toHaveClass("editor active") -// const DefaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const DefaultsTab = page.locator("#defaults-tab") + const jsonYamlPopup = page.locator('.json-yaml-warning') + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(DefaultsTab).toBeChecked({ checked: false }) + const jsonBtn = page.locator('#file-type-json') + const yamlBtn = page.locator('#file-type-yaml') -// await DefaultsTab.click() + await expect(jsonBtn).toBeChecked({ checked: true }) + await expect(yamlBtn).toBeChecked({ checked: false }) -// await expect(DefaultsTab).toBeChecked({ checked: true }) -// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(page.locator(".console-error__txt")).toHaveText("This function is only allowed for Thing Descriptions!") + await yamlBtn.click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") -// }) + await page.locator('#yaml-confirm-btn').click() + await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + await expect(templateEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(jsonBtn).toBeChecked({ checked: false }) + await expect(yamlBtn).toBeChecked({ checked: true }) -// test("Open the Defaults view as YAML", async ({ page }) => { + const defaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const defaultsTab = page.locator("#defaults-tab") -// const templateEditor = page.locator("#editor1") -// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") -// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") -// await expect(templateEditor).toHaveClass("editor active") + await expect(defaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(defaultsTab).toBeChecked({ checked: false }) -// const jsonYamlPopup = page.locator('.json-yaml-warning') -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") + await defaultsTab.click() -// const jsonBtn = page.locator('#file-type-json') -// const yamlBtn = page.locator('#file-type-yaml') + await expect(defaultsTab).toBeChecked({ checked: true }) + await expect(defaultsView).toHaveClass("console-view defaults-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(jsonBtn).toBeChecked({ checked: true }) -// await expect(yamlBtn).toBeChecked({ checked: false }) + const defaultsEditor = page.locator('#defaults-container') + const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: 'description: >-' }).nth(4) + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(defaultsContainer).toHaveText('description: >-') -// await yamlBtn.click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning") + const defaultsYamlBtn = page.locator('#defaults-yaml') + await expect(defaultsYamlBtn).toBeDisabled() + }) -// await page.locator('#yaml-confirm-btn').click() -// await expect(jsonYamlPopup).toHaveClass("json-yaml-warning closed") -// await expect(templateEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(jsonBtn).toBeChecked({ checked: false }) -// await expect(yamlBtn).toBeChecked({ checked: true }) + test("Open the Defaults view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { + const templateEditor = page.locator("#editor1") + await expect(templateEditor).toHaveAttribute('data-ide-id', "1") + await expect(templateEditor).toHaveAttribute('data-mode-id', "json") + await expect(templateEditor).toHaveClass("editor active") -// const defaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const defaultsTab = page.locator("#defaults-tab") + const defaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const defaultsTab = page.locator("#defaults-tab") -// await expect(defaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(defaultsTab).toBeChecked({ checked: false }) + await expect(defaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(defaultsTab).toBeChecked({ checked: false }) -// await defaultsTab.click() + await defaultsTab.click() -// await expect(defaultsTab).toBeChecked({ checked: true }) -// await expect(defaultsView).toHaveClass("console-view defaults-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(defaultsTab).toBeChecked({ checked: true }) + await expect(defaultsView).toHaveClass("console-view defaults-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const defaultsEditor = page.locator('#defaults-container') -// const defaultsContainer = defaultsEditor.getByRole('code').locator('div').filter({ hasText: 'description: >-' }).nth(4) -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(defaultsContainer).toHaveText('description: >-') + const defaultsEditor = page.locator('#defaults-container') -// const defaultsYamlBtn = page.locator('#defaults-yaml') -// await expect(defaultsYamlBtn).toBeDisabled() -// }) + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") -// test("Open the Defaults view and change form JSON to YAML and from YAML to JSON", async ({ page }) => { -// const templateEditor = page.locator("#editor1") -// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") -// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") -// await expect(templateEditor).toHaveClass("editor active") + const defaultsJsonBtn = page.locator('#defaults-json') + const defaultsYamlBtn = page.locator('#defaults-yaml') -// const defaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const defaultsTab = page.locator("#defaults-tab") + await expect(defaultsJsonBtn).toBeDisabled() -// await expect(defaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(defaultsTab).toBeChecked({ checked: false }) + await defaultsYamlBtn.click() -// await defaultsTab.click() + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(defaultsYamlBtn).toBeDisabled() -// await expect(defaultsTab).toBeChecked({ checked: true }) -// await expect(defaultsView).toHaveClass("console-view defaults-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await defaultsJsonBtn.click() -// const defaultsEditor = page.locator('#defaults-container') + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") + await expect(defaultsJsonBtn).toBeDisabled() + }) -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") + test("Open the Defaults view and removing and adding default values", async ({ page }) => { -// const defaultsJsonBtn = page.locator('#defaults-json') -// const defaultsYamlBtn = page.locator('#defaults-yaml') + const templateEditor = page.locator("#editor1") + await expect(templateEditor).toHaveAttribute('data-ide-id', "1") + await expect(templateEditor).toHaveClass("editor active") -// await expect(defaultsJsonBtn).toBeDisabled() + const defaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const defaultsTab = page.locator("#defaults-tab") -// await defaultsYamlBtn.click() + await expect(defaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(defaultsTab).toBeChecked({ checked: false }) -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(defaultsYamlBtn).toBeDisabled() + await defaultsTab.click() -// await defaultsJsonBtn.click() + await expect(defaultsTab).toBeChecked({ checked: true }) + await expect(defaultsView).toHaveClass("console-view defaults-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") -// await expect(defaultsJsonBtn).toBeDisabled() -// }) + const defaultsAddBtn = page.locator('#defaults-add') + const defaultsRemoveBtn = page.locator('#defaults-remove') -// test("Open the Defaults view and removing and adding default values", async ({ page }) => { + await expect(defaultsAddBtn).toBeDisabled() -// const templateEditor = page.locator("#editor1") -// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") -// await expect(templateEditor).toHaveClass("editor active") + await defaultsRemoveBtn.click() + await expect(defaultsRemoveBtn).toBeDisabled() -// const defaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const defaultsTab = page.locator("#defaults-tab") + await defaultsAddBtn.click() + await expect(defaultsAddBtn).toBeDisabled() + }) -// await expect(defaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(defaultsTab).toBeChecked({ checked: false }) + test("Open the Defaults view and downloading it as JSON with defaults", async ({ page }) => { -// await defaultsTab.click() + const templateEditor = page.locator("#editor1") + await expect(templateEditor).toHaveAttribute('data-ide-id', "1") + await expect(templateEditor).toHaveAttribute('data-mode-id', "json") + await expect(templateEditor).toHaveClass("editor active") -// await expect(defaultsTab).toBeChecked({ checked: true }) -// await expect(defaultsView).toHaveClass("console-view defaults-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + const DefaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const DefaultsTab = page.locator("#defaults-tab") -// const defaultsAddBtn = page.locator('#defaults-add') -// const defaultsRemoveBtn = page.locator('#defaults-remove') + await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(DefaultsTab).toBeChecked({ checked: false }) -// await expect(defaultsAddBtn).toBeDisabled() + await DefaultsTab.click() -// await defaultsRemoveBtn.click() -// await expect(defaultsRemoveBtn).toBeDisabled() + await expect(DefaultsTab).toBeChecked({ checked: true }) + await expect(DefaultsView).toHaveClass("console-view defaults-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// await defaultsAddBtn.click() -// await expect(defaultsAddBtn).toBeDisabled() -// }) + const defaultsEditor = page.locator('#defaults-container') + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") -// test("Open the Defaults view and downloading it as JSON with defaults", async ({ page }) => { + const DefaultsJsonBtn = page.locator('#defaults-json') + await expect(DefaultsJsonBtn).toBeDisabled() -// const templateEditor = page.locator("#editor1") -// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") -// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") -// await expect(templateEditor).toHaveClass("editor active") + // Start waiting for download before clicking. + const DefaultsDownload = page.locator('#defaults-download') + const downloadPromise = page.waitForEvent('download') + await DefaultsDownload.click() + const download = await downloadPromise + const expectedFilename = 'Thing-Template-with-Defaults.json' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) -// const DefaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const DefaultsTab = page.locator("#defaults-tab") + test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { + const templateEditor = page.locator("#editor1") + await expect(templateEditor).toHaveAttribute('data-ide-id', "1") + await expect(templateEditor).toHaveAttribute('data-mode-id', "json") + await expect(templateEditor).toHaveClass("editor active") -// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(DefaultsTab).toBeChecked({ checked: false }) + const DefaultsView = page.locator('#defaults-view') + const consoleError = page.locator('#console-error') + const DefaultsTab = page.locator("#defaults-tab") -// await DefaultsTab.click() + await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") + await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(DefaultsTab).toBeChecked({ checked: false }) -// await expect(DefaultsTab).toBeChecked({ checked: true }) -// await expect(DefaultsView).toHaveClass("console-view defaults-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await DefaultsTab.click() -// const defaultsEditor = page.locator('#defaults-container') -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") + await expect(DefaultsTab).toBeChecked({ checked: true }) + await expect(DefaultsView).toHaveClass("console-view defaults-view") + await expect(consoleError).toHaveClass("console-view console-error hidden") -// const DefaultsJsonBtn = page.locator('#defaults-json') -// await expect(DefaultsJsonBtn).toBeDisabled() + const defaultsEditor = page.locator('#defaults-container') + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") -// // Start waiting for download before clicking. -// const DefaultsDownload = page.locator('#defaults-download') -// const downloadPromise = page.waitForEvent('download') -// await DefaultsDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'Thing-Template-with-Defaults.json' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + const defaultsJsonBtn = page.locator('#defaults-json') + const defaultsYamlBtn = page.locator('#defaults-yaml') -// test("Open the OpenAPI view and downloading it as YAML", async ({ page }) => { -// const templateEditor = page.locator("#editor1") -// await expect(templateEditor).toHaveAttribute('data-ide-id', "1") -// await expect(templateEditor).toHaveAttribute('data-mode-id', "json") -// await expect(templateEditor).toHaveClass("editor active") + await expect(defaultsJsonBtn).toBeDisabled() -// const DefaultsView = page.locator('#defaults-view') -// const consoleError = page.locator('#console-error') -// const DefaultsTab = page.locator("#defaults-tab") + await defaultsYamlBtn.click() -// await expect(DefaultsView).toHaveClass("console-view defaults-view hidden") -// await expect(consoleError).toHaveClass("console-view console-error hidden") -// await expect(DefaultsTab).toBeChecked({ checked: false }) + await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") + await expect(defaultsYamlBtn).toBeDisabled() -// await DefaultsTab.click() + const defaultsAddBtn = page.locator('#defaults-add') + const defaultsRemoveBtn = page.locator('#defaults-remove') -// await expect(DefaultsTab).toBeChecked({ checked: true }) -// await expect(DefaultsView).toHaveClass("console-view defaults-view") -// await expect(consoleError).toHaveClass("console-view console-error hidden") + await expect(defaultsAddBtn).toBeDisabled() -// const defaultsEditor = page.locator('#defaults-container') -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "json") + await defaultsRemoveBtn.click() + await expect(defaultsRemoveBtn).toBeDisabled() -// const defaultsJsonBtn = page.locator('#defaults-json') -// const defaultsYamlBtn = page.locator('#defaults-yaml') + // Start waiting for download before clicking. + const defaultsDownload = page.locator('#defaults-download') + const downloadPromise = page.waitForEvent('download') + await defaultsDownload.click() + const download = await downloadPromise + const expectedFilename = 'Thing-Template-without-Defaults.yaml' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) +}) -// await expect(defaultsJsonBtn).toBeDisabled() +test.describe("Visualization view functionality", () => { -// await defaultsYamlBtn.click() + test("Open the visualization view with the thing template", async ({ page }) => { -// await expect(defaultsEditor).toHaveAttribute('data-mode-id', "yaml") -// await expect(defaultsYamlBtn).toBeDisabled() + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// const defaultsAddBtn = page.locator('#defaults-add') -// const defaultsRemoveBtn = page.locator('#defaults-remove') + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// await expect(defaultsAddBtn).toBeDisabled() + await visualizeTab.click() -// await defaultsRemoveBtn.click() -// await expect(defaultsRemoveBtn).toBeDisabled() + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// // Start waiting for download before clicking. -// const defaultsDownload = page.locator('#defaults-download') -// const downloadPromise = page.waitForEvent('download') -// await defaultsDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'Thing-Template-without-Defaults.yaml' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) -// }) + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') -// test.describe("Visualization view functionality", () => { + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the visualization view with the thing template", async ({ page }) => { + const graphVisTitle = page.locator('#visualized').getByText('Thing Template', { exact: true }) + await expect(graphVisTitle).toHaveText("Thing Template") + }) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") + test("Open the visualization view with the thing template and expand and collapse the graph view", async ({ page }) => { -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// await visualizeTab.click() + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") + await visualizeTab.click() -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') + const collapseAllBtn = page.locator('#collapse-all') + const expandAllBtn = page.locator('#expand-all') -// const graphVisTitle = page.locator('#visualized').getByText('Thing Template', { exact: true }) -// await expect(graphVisTitle).toHaveText("Thing Template") -// }) + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the visualization view with the thing template and expand and collapse the graph view", async ({ page }) => { + const svgPaths = page.locator("svg > g > path") + await expect(svgPaths).toHaveCount(9) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") + await expandAllBtn.click() + await expect(expandAllBtn).toBeDisabled() -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) + await expect(svgPaths).toHaveCount(12) -// await visualizeTab.click() + await collapseAllBtn.click() + await expect(collapseAllBtn).toBeDisabled() -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") + await expect(svgPaths).toHaveCount(0) + }) -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') -// const collapseAllBtn = page.locator('#collapse-all') -// const expandAllBtn = page.locator('#expand-all') + test("Open the visualization view with the thing template download the graph view as SVG", async ({ page }) => { -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// const svgPaths = page.locator("svg > g > path") -// await expect(svgPaths).toHaveCount(9) + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// await expandAllBtn.click() -// await expect(expandAllBtn).toBeDisabled() + await visualizeTab.click() -// await expect(svgPaths).toHaveCount(12) + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// await collapseAllBtn.click() -// await expect(collapseAllBtn).toBeDisabled() + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') -// await expect(svgPaths).toHaveCount(0) -// }) + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the visualization view with the thing template download the graph view as SVG", async ({ page }) => { + // Start waiting for download before clicking. + const svgDownload = page.locator('#download-svg') + const downloadPromise = page.waitForEvent('download') + await svgDownload.click() + const download = await downloadPromise + const expectedFilename = 'Graph-visualization.svg' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") + test("Open the visualization view with the thing template and download the graph view as PNG", async ({ page }) => { -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// await visualizeTab.click() + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") + await visualizeTab.click() -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') -// // Start waiting for download before clicking. -// const svgDownload = page.locator('#download-svg') -// const downloadPromise = page.waitForEvent('download') -// await svgDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'Graph-visualization.svg' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the visualization view with the thing template and download the graph view as PNG", async ({ page }) => { + // Start waiting for download before clicking. + const pngDownload = page.locator('#download-png') + const downloadPromise = page.waitForEvent('download') + await pngDownload.click() + const download = await downloadPromise + const expectedFilename = 'Graph-visualization.png' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") + test("Open the tree visualization view with the thing template and modified the input values", async ({ page }) => { -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// await visualizeTab.click() + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") + await visualizeTab.click() -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') -// // Start waiting for download before clicking. -// const pngDownload = page.locator('#download-png') -// const downloadPromise = page.waitForEvent('download') -// await pngDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'Graph-visualization.png' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the tree visualization view with the thing template and modified the input values", async ({ page }) => { + await treeViewBtn.click() + await expect(graphViewBtn).toBeChecked({ checked: false }) + await expect(treeViewBtn).toBeChecked({ checked: true }) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") + const labelBtn = page.getByLabel('labels') + const radiusSlider = page.getByLabel('radius') + const extentSlider = page.getByLabel('extent') + const rotateSlider = page.getByLabel('rotate') + const dragSlider = page.getByLabel('drag precision') + const tidyBtn = page.getByLabel('tidy') + const clusterBtn = page.getByLabel('cluster') + const linksDropDown = page.getByLabel('links') -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) + await expect(labelBtn).toBeChecked({ checked: true }) + await expect(radiusSlider).toHaveValue("350") + await expect(extentSlider).toHaveValue("360") + await expect(rotateSlider).toHaveValue("0") + await expect(dragSlider).toHaveValue("100") + await expect(tidyBtn).toBeChecked({ checked: true }) + await expect(clusterBtn).toBeChecked({ checked: false }) + await expect(linksDropDown).toHaveValue("line") -// await visualizeTab.click() + await labelBtn.click() + await radiusSlider.click() + await extentSlider.click() + await rotateSlider.click() + await dragSlider.click() + await clusterBtn.check() + await linksDropDown.selectOption("diagonal") + await expect(labelBtn).toBeChecked({ checked: false }) -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") + const radiusSliderValue = await radiusSlider.inputValue() + expect(parseInt(radiusSliderValue)).toBeLessThan(450) + expect(parseInt(radiusSliderValue)).toBeGreaterThan(330) -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') + const extentSliderValue = await extentSlider.inputValue() + expect(parseInt(extentSliderValue)).toBeLessThan(190) + expect(parseInt(extentSliderValue)).toBeGreaterThan(170) -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) + const rotateSliderValue = await rotateSlider.inputValue() + expect(parseInt(rotateSliderValue)).toBeLessThan(190) + expect(parseInt(rotateSliderValue)).toBeGreaterThan(170) -// await treeViewBtn.click() -// await expect(graphViewBtn).toBeChecked({ checked: false }) -// await expect(treeViewBtn).toBeChecked({ checked: true }) + const dragSliderValue = await dragSlider.inputValue() + expect(parseInt(dragSliderValue)).toBeLessThan(60) + expect(parseInt(dragSliderValue)).toBeGreaterThan(40) -// const labelBtn = page.getByLabel('labels') -// const radiusSlider = page.getByLabel('radius') -// const extentSlider = page.getByLabel('extent') -// const rotateSlider = page.getByLabel('rotate') -// const dragSlider = page.getByLabel('drag precision') -// const tidyBtn = page.getByLabel('tidy') -// const clusterBtn = page.getByLabel('cluster') -// const linksDropDown = page.getByLabel('links') + await expect(tidyBtn).toBeChecked({ checked: false }) + await expect(clusterBtn).toBeChecked({ checked: true }) + await expect(linksDropDown).toHaveValue("diagonal") -// await expect(labelBtn).toBeChecked({ checked: true }) -// await expect(radiusSlider).toHaveValue("350") -// await expect(extentSlider).toHaveValue("360") -// await expect(rotateSlider).toHaveValue("0") -// await expect(dragSlider).toHaveValue("100") -// await expect(tidyBtn).toBeChecked({ checked: true }) -// await expect(clusterBtn).toBeChecked({ checked: false }) -// await expect(linksDropDown).toHaveValue("line") + }) -// await labelBtn.click() -// await radiusSlider.click() -// await extentSlider.click() -// await rotateSlider.click() -// await dragSlider.click() -// await clusterBtn.check() -// await linksDropDown.selectOption("diagonal") -// await expect(labelBtn).toBeChecked({ checked: false }) + test("Open the tree visualization view with the thing template and download as SVG", async ({ page }) => { -// const radiusSliderValue = await radiusSlider.inputValue() -// expect(parseInt(radiusSliderValue)).toBeLessThan(450) -// expect(parseInt(radiusSliderValue)).toBeGreaterThan(330) + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// const extentSliderValue = await extentSlider.inputValue() -// expect(parseInt(extentSliderValue)).toBeLessThan(190) -// expect(parseInt(extentSliderValue)).toBeGreaterThan(170) + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// const rotateSliderValue = await rotateSlider.inputValue() -// expect(parseInt(rotateSliderValue)).toBeLessThan(190) -// expect(parseInt(rotateSliderValue)).toBeGreaterThan(170) + await visualizeTab.click() -// const dragSliderValue = await dragSlider.inputValue() -// expect(parseInt(dragSliderValue)).toBeLessThan(60) -// expect(parseInt(dragSliderValue)).toBeGreaterThan(40) + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// await expect(tidyBtn).toBeChecked({ checked: false }) -// await expect(clusterBtn).toBeChecked({ checked: true }) -// await expect(linksDropDown).toHaveValue("diagonal") + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') -// }) + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the tree visualization view with the thing template and download as SVG", async ({ page }) => { + await treeViewBtn.click() + await expect(graphViewBtn).toBeChecked({ checked: false }) + await expect(treeViewBtn).toBeChecked({ checked: true }) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") + // Start waiting for download before clicking. + const svgDownload = page.locator('#download-svg') + const downloadPromise = page.waitForEvent('download') + await svgDownload.click() + const download = await downloadPromise + const expectedFilename = 'Tree-visualization.svg' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) + test("Open the tree visualization view with the thing template and download as PNG", async ({ page }) => { -// await visualizeTab.click() + const visualizeView = page.locator('#visualize-view') + const visualizeTab = page.locator("#visualize-tab") -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") + await expect(visualizeView).toHaveClass("console-view visualize-view hidden") + await expect(visualizeTab).toBeChecked({ checked: false }) -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') + await visualizeTab.click() -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) + await expect(visualizeTab).toBeChecked({ checked: true }) + await expect(visualizeView).toHaveClass("console-view visualize-view") -// await treeViewBtn.click() -// await expect(graphViewBtn).toBeChecked({ checked: false }) -// await expect(treeViewBtn).toBeChecked({ checked: true }) + const graphViewBtn = page.locator('#graph-view') + const treeViewBtn = page.locator('#tree-view') -// // Start waiting for download before clicking. -// const svgDownload = page.locator('#download-svg') -// const downloadPromise = page.waitForEvent('download') -// await svgDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'Tree-visualization.svg' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) + await expect(graphViewBtn).toBeChecked({ checked: true }) + await expect(treeViewBtn).toBeChecked({ checked: false }) -// test("Open the tree visualization view with the thing template and download as PNG", async ({ page }) => { + await treeViewBtn.click() + await expect(graphViewBtn).toBeChecked({ checked: false }) + await expect(treeViewBtn).toBeChecked({ checked: true }) -// const visualizeView = page.locator('#visualize-view') -// const visualizeTab = page.locator("#visualize-tab") - -// await expect(visualizeView).toHaveClass("console-view visualize-view hidden") -// await expect(visualizeTab).toBeChecked({ checked: false }) - -// await visualizeTab.click() - -// await expect(visualizeTab).toBeChecked({ checked: true }) -// await expect(visualizeView).toHaveClass("console-view visualize-view") - -// const graphViewBtn = page.locator('#graph-view') -// const treeViewBtn = page.locator('#tree-view') - -// await expect(graphViewBtn).toBeChecked({ checked: true }) -// await expect(treeViewBtn).toBeChecked({ checked: false }) - -// await treeViewBtn.click() -// await expect(graphViewBtn).toBeChecked({ checked: false }) -// await expect(treeViewBtn).toBeChecked({ checked: true }) - -// // Start waiting for download before clicking. -// const pngDownload = page.locator('#download-png') -// const downloadPromise = page.waitForEvent('download') -// await pngDownload.click() -// const download = await downloadPromise -// const expectedFilename = 'Tree-visualization.png' -// expect(download.suggestedFilename()).toBe(expectedFilename) -// }) -// }) + // Start waiting for download before clicking. + const pngDownload = page.locator('#download-png') + const downloadPromise = page.waitForEvent('download') + await pngDownload.click() + const download = await downloadPromise + const expectedFilename = 'Tree-visualization.png' + expect(download.suggestedFilename()).toBe(expectedFilename) + }) +}) From 6021675baae4919549e2a99dcb0c5a12a622676c Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Wed, 7 Feb 2024 20:07:32 +0100 Subject: [PATCH 66/68] increasing timeout and testing only for chromium --- .github/workflows/visual-ci-new.yaml | 2 +- packages/web-new/package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/visual-ci-new.yaml b/.github/workflows/visual-ci-new.yaml index aa0c0a48b..9c229d9f7 100644 --- a/.github/workflows/visual-ci-new.yaml +++ b/.github/workflows/visual-ci-new.yaml @@ -28,7 +28,7 @@ jobs: run: lerna bootstrap --no-ci - name: Visual Tests - timeout-minutes: 18 + timeout-minutes: 30 run: | cd ./packages/web-new npm install diff --git a/packages/web-new/package.json b/packages/web-new/package.json index 5914a589e..4ddf4bb9e 100644 --- a/packages/web-new/package.json +++ b/packages/web-new/package.json @@ -19,7 +19,7 @@ "dev": "webpack serve --mode development", "serve": "node server/server.js", "examples": "node external-scripts/generate-paths.js", - "test": "npx playwright test --project=chromium --project=firefox", + "test": "npx playwright test --project=chromium", "test-full": "npx playwright test" }, "devDependencies": { From f370293c17e4cbe9bfd5087cf3421c7c55f48a73 Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Mon, 12 Feb 2024 11:46:55 +0100 Subject: [PATCH 67/68] fixed failing tests --- packages/web-new/package.json | 2 +- packages/web-new/playwright.config.js | 22 ++++---- packages/web-new/tests/test.spec.js | 78 +++++++++++++-------------- 3 files changed, 50 insertions(+), 52 deletions(-) diff --git a/packages/web-new/package.json b/packages/web-new/package.json index 4ddf4bb9e..5914a589e 100644 --- a/packages/web-new/package.json +++ b/packages/web-new/package.json @@ -19,7 +19,7 @@ "dev": "webpack serve --mode development", "serve": "node server/server.js", "examples": "node external-scripts/generate-paths.js", - "test": "npx playwright test --project=chromium", + "test": "npx playwright test --project=chromium --project=firefox", "test-full": "npx playwright test" }, "devDependencies": { diff --git a/packages/web-new/playwright.config.js b/packages/web-new/playwright.config.js index c2220733e..524b17022 100644 --- a/packages/web-new/playwright.config.js +++ b/packages/web-new/playwright.config.js @@ -15,10 +15,7 @@ // @ts-check const { defineConfig, devices } = require('@playwright/test'); -/** - * Read environment variables from file. - * https://github.com/motdotla/dotenv - */ + // require('dotenv').config(); module.exports = defineConfig({ @@ -58,20 +55,21 @@ module.exports = defineConfig({ name: 'webkit', use: { ...devices['Desktop Safari'] }, }, - // { - // name: 'Microsoft Edge', - // use: { ...devices['Desktop Edge'], channel: 'msedge' }, - // }, - // { - // name: 'Google Chrome', - // use: { ...devices['Desktop Chrome'], channel: 'chrome' }, - // } + { + name: 'Microsoft Edge', + use: { ...devices['Desktop Edge'], channel: 'msedge' }, + }, + { + name: 'Google Chrome', + use: { ...devices['Desktop Chrome'], channel: 'chrome' }, + } ], /* Run your local dev server before starting the tests */ webServer: { command: 'npm run serve', url: 'http://127.0.0.1:5100', + // Add a timeout in case the server takes to long to start // timeout: 120 * 1000, reuseExistingServer: !process.env.CI, } diff --git a/packages/web-new/tests/test.spec.js b/packages/web-new/tests/test.spec.js index d5d8f7952..bad064d38 100644 --- a/packages/web-new/tests/test.spec.js +++ b/packages/web-new/tests/test.spec.js @@ -188,7 +188,7 @@ test.describe("Editors and Tabs creation and deletion", () => { await page.locator("#examples-btn").click() await page.locator(".example").nth(0).click() - await page.locator(".example").nth(0).getByRole("button", { name: /Apply/ }).click() + await page.locator(".example").nth(0).locator(".example__btn").locator(".example__btn--use").click() await expect(editorTabs).toHaveCount(2) await expect(editors).toHaveCount(2) @@ -281,7 +281,7 @@ test.describe("Examples menu functionality", () => { await page.locator("#examples-btn").click() await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: true }) - await page.locator(".examples-menu-container__close > i").click() + await page.locator(".examples-menu-container__close > svg").click() await expect(page.getByRole('heading', { name: 'Simple Default' })).toBeVisible({ visible: false }) }) @@ -315,7 +315,7 @@ test.describe("Examples menu functionality", () => { await basicExample.click() await expect(basicExample).toHaveClass("example open") - const applyBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).getByRole("button").filter({ hasText: "Apply" }) + const applyBtn = page.locator(".example").filter({ hasText: 'Basic TD' }).nth(0).locator(".example__btn").locator(".example__btn--use") await applyBtn.click() await expect(basicExample).toHaveClass("example") @@ -448,7 +448,7 @@ test.describe("Save menu functionality", () => { await page.locator("#save-btn").click() await expect(saveMenu).toHaveClass("save-menu") - const closeMenu = page.locator(".save-menu-close > i") + const closeMenu = page.locator(".save-menu-close > svg") await closeMenu.click() await expect(saveMenu).toHaveClass("save-menu closed") }) @@ -577,7 +577,7 @@ test.describe("Settings menu functionality", () => { await page.locator("#settings-btn").click() await expect(settingsMenu).toHaveClass("settings-menu") - const closeMenu = page.locator(".settings__close > i") + const closeMenu = page.locator(".settings__close > svg") await closeMenu.click() await expect(settingsMenu).toHaveClass("settings-menu closed") }) @@ -704,15 +704,15 @@ test.describe("Validation view functionality", () => { await expect(validationTab).toBeChecked() await expect(validationView).toHaveClass("console-view validation-view") - const stateIcon = page.locator(".json-validation-section > .section-header > i").nth(0) - await expect(stateIcon).toHaveClass("fa-solid fa-circle") + const stateIcon = page.locator(".json-validation-section > .section-header > .header-icons > svg") + await expect(stateIcon).toHaveClass("neutral-circle-icon icon") const validationBtn = page.locator("#validate-btn") await validationBtn.click() //TODO: Find a better way to wait for this event to happen - await page.waitForTimeout(5000) - await expect(stateIcon).toHaveClass("fa-solid fa-circle-check") + await page.waitForTimeout(3000) + await expect(stateIcon).toHaveClass("icon success-circle-icon") }) test("Validating the 'All Defaults TD'", async ({ page }) => { @@ -740,44 +740,44 @@ test.describe("Validation view functionality", () => { //validation section const jsonValidationSection = page.locator(".json-validation-section") - const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) + const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > .header-icons > svg") const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") await jsonValidationSection.click() await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(jsonValidationSectionIcon).toHaveClass("icon success-circle-icon") const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") - const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) + const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > .header-icons > svg") const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") await jsonSchemaValidationSection.click() await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(jsonSchemaValidationSectionIcon).toHaveClass("icon success-circle-icon") const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") - const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) + const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > .header-icons > svg") const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li") await jsonSchemaDefaultsSection.click() await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Validated Successfully") - await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("icon success-circle-icon") const jsonlsValidationSection = page.locator(".jsonls-validation-section") - const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) + const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > .header-icons > svg") const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") await jsonlsValidationSection.click() await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(jsonlsValidationSectionIcon).toHaveClass("icon success-circle-icon") const additionalChecksSection = page.locator(".additional-checks-section") - const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) + const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > .header-icons > svg") const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") await additionalChecksSection.click() await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") - await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(additionalChecksSectionIcon).toHaveClass("icon success-circle-icon") }) test("Validating the 'Basic TD'", async ({ page }) => { @@ -805,44 +805,44 @@ test.describe("Validation view functionality", () => { //Validation section const jsonValidationSection = page.locator(".json-validation-section") - const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) + const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > .header-icons > svg") const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") await jsonValidationSection.click() await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(jsonValidationSectionIcon).toHaveClass("icon success-circle-icon") const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") - const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) + const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > .header-icons > svg") const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") await jsonSchemaValidationSection.click() await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(jsonSchemaValidationSectionIcon).toHaveClass("icon success-circle-icon") const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") - const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) + const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > .header-icons > svg") const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) await jsonSchemaDefaultsSection.click() await expect(jsonSchemaDefaultsSectionTxt).toHaveText("Optional validation failed:") - await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle-exclamation") + await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("icon warning-circle-icon") const jsonlsValidationSection = page.locator(".jsonls-validation-section") - const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) + const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > .header-icons > svg") const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") await jsonlsValidationSection.click() await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(jsonlsValidationSectionIcon).toHaveClass("icon success-circle-icon") const additionalChecksSection = page.locator(".additional-checks-section") - const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) + const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > .header-icons > svg") const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") await additionalChecksSection.click() await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") - await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(additionalChecksSectionIcon).toHaveClass("icon success-circle-icon") }) test("Validating the 'Basic TM'", async ({ page }) => { @@ -875,44 +875,44 @@ test.describe("Validation view functionality", () => { //Validation section const jsonValidationSection = page.locator(".json-validation-section") - const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > i").nth(0) + const jsonValidationSectionIcon = page.locator(".json-validation-section > .section-header > .header-icons > svg") const jsonValidationSectionTxt = page.locator(".json-validation-section > .section-content > li") await jsonValidationSection.click() await expect(jsonValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(jsonValidationSectionIcon).toHaveClass("icon success-circle-icon") const jsonSchemaValidationSection = page.locator(".json-schema-validation-section") - const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > i").nth(0) + const jsonSchemaValidationSectionIcon = page.locator(".json-schema-validation-section > .section-header > .header-icons > svg") const jsonSchemaValidationSectionTxt = page.locator(".json-schema-validation-section > .section-content > li") await jsonSchemaValidationSection.click() await expect(jsonSchemaValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonSchemaValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(jsonSchemaValidationSectionIcon).toHaveClass("icon success-circle-icon") const jsonSchemaDefaultsSection = page.locator(".json-schema-defaults-section") - const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > i").nth(0) + const jsonSchemaDefaultsSectionIcon = page.locator(".json-schema-defaults-section > .section-header > .header-icons > svg") const jsonSchemaDefaultsSectionTxt = page.locator(".json-schema-defaults-section > .section-content > li").nth(0) await jsonSchemaDefaultsSection.click() await expect(jsonSchemaDefaultsSectionTxt).toHaveText("A previous validation has failed or it is only available for Thing Descriptions") - await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("fa-solid fa-circle") + await expect(jsonSchemaDefaultsSectionIcon).toHaveClass("neutral-circle-icon icon") const jsonlsValidationSection = page.locator(".jsonls-validation-section") - const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > i").nth(0) + const jsonlsValidationSectionIcon = page.locator(".jsonls-validation-section > .section-header > .header-icons > svg") const jsonlsValidationSectionTxt = page.locator(".jsonls-validation-section > .section-content > li") await jsonlsValidationSection.click() await expect(jsonlsValidationSectionTxt).toHaveText("Validated Successfully") - await expect(jsonlsValidationSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(jsonlsValidationSectionIcon).toHaveClass("icon success-circle-icon") const additionalChecksSection = page.locator(".additional-checks-section") - const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > i").nth(0) + const additionalChecksSectionIcon = page.locator(".additional-checks-section > .section-header > .header-icons > svg") const additionalChecksSectionTxt = page.locator(".additional-checks-section > .section-content > li") await additionalChecksSection.click() await expect(additionalChecksSectionTxt).toHaveText("Validated Successfully") - await expect(additionalChecksSectionIcon).toHaveClass("fa-solid fa-circle-check") + await expect(additionalChecksSectionIcon).toHaveClass("icon success-circle-icon") }) }) From 9c3c444e8ff6576e2dccecb8692abaa0abd23c0e Mon Sep 17 00:00:00 2001 From: Sergio Eduardo Castro Ceballos <72516762+SergioCasCeb@users.noreply.github.com> Date: Mon, 12 Feb 2024 12:00:32 +0100 Subject: [PATCH 68/68] waiting for element to properly load to fix test --- packages/web-new/tests/test.spec.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/web-new/tests/test.spec.js b/packages/web-new/tests/test.spec.js index bad064d38..88f0ac734 100644 --- a/packages/web-new/tests/test.spec.js +++ b/packages/web-new/tests/test.spec.js @@ -433,6 +433,7 @@ test.describe("Examples menu functionality", () => { const quickAccessBtn = page.locator(".example").filter({ hasText: 'Overwrite Existing Definitions' }).nth(1).getByRole("button").nth(0) await quickAccessBtn.click() + await page.waitForTimeout(1000) const exampleTab = page.locator("#tab").nth(1) await expect(exampleTab).toHaveAttribute('data-tab-id', "2") await expect(exampleTab).toHaveText("TMSmart Lamp ControlCloseCancel")