Fix UI Tests (openbao#797)

* fix UI Tests Signed-off-by: Jan Martens <[email protected]> * enable UI Tests again Signed-off-by: Jan Martens <[email protected]> --------- Signed-off-by: Jan Martens <[email protected]>
klaus-sap · Dec 16, 2024 · 88945c0 · 88945c0
1 parent c3173a0
commit 88945c0
Show file tree

Hide file tree

Showing 22 changed files with 126 additions and 513 deletions.
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -109,79 +109,78 @@ jobs:
       checkout-ref: ${{ needs.setup.outputs.checkout-ref }}
     secrets: inherit
 
-#  test-ui:
-#    name: Test UI
-#    # The test-ui job is only run on:
-#    # - pushes to main and branches starting with "release/"
-#    # - PRs where the branch starts with "ui/", "backport/ui/", "merge", or when base branch starts with "release/"
-#    # - PRs with the "ui" label on GitHub
-#    if: |
-#      github.ref_name == 'main' ||
-#      startsWith(github.ref_name, 'release/') ||
-#      startsWith(github.head_ref, 'ui/') ||
-#      startsWith(github.head_ref, 'backport/ui/') ||
-#      startsWith(github.head_ref, 'merge') ||
-#      contains(github.event.pull_request.labels.*.name, 'ui')
-#    needs:
-#      - setup
-#    runs-on: ubuntu-latest
-#    steps:
-#      - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7
-#      - uses: ./.github/actions/set-up-go
-#      # Setup node.js without caching to allow running npm install -g yarn (next step)
-#      - uses: actions/setup-node@e33196f7422957bea03ed53f6fbb155025ffc7b8 # v3.7.0
-#        with:
-#          node-version-file: "./ui/package.json"
-#      - id: install-yarn
-#        run: |
-#          npm install -g yarn
-#      # Setup node.js with caching using the yarn.lock file
-#      - uses: actions/setup-node@e33196f7422957bea03ed53f6fbb155025ffc7b8 # v3.7.0
-#        with:
-#          node-version-file: "./ui/package.json"
-#          cache: yarn
-#          cache-dependency-path: ui/yarn.lock
-#      - id: install-browser
-#        uses: browser-actions/setup-chrome@db1b524c26f20a8d1a10f7fc385c92387e2d0477 # v1.7.1
-#      - id: ui-dependencies
-#        name: ui-dependencies
-#        working-directory: ./ui
-#        run: |
-#          yarn install --frozen-lockfile
-#          npm rebuild node-sass
-#      - id: build-go-dev
-#        name: build-go-dev
-#        run: |
-#          rm -rf ./pkg
-#          mkdir ./pkg
-#
-#          make ci-bootstrap dev
-#      - id: test-ui
-#        name: test-ui
-#        run: |
-#          export PATH="${PWD}/bin:${PATH}"
-#
-#          # Run Ember tests
-#          cd ui
-#          mkdir -p test-results/qunit
-#          yarn test:oss
-#      - uses: actions/upload-artifact@834a144ee995460fba8ed112a2fc961b36a5ec5a # v4.3.6
-#        with:
-#          name: test-results-ui
-#          path: ui/test-results
-#        if: success() || failure()
-#      - uses: test-summary/action@31493c76ec9e7aa675f1585d3ed6f1da69269a86 # TSCCR: no entry for repository "test-summary/action"
-#        with:
-#          paths: "ui/test-results/qunit/results.xml"
-#          show: "fail"
-#        if: always()
+  test-ui:
+    name: Test UI
+    # The test-ui job is only run on:
+    # - pushes to main and branches starting with "release/"
+    # - PRs where the branch starts with "ui/", "backport/ui/", "merge", or when base branch starts with "release/"
+    # - PRs with the "ui" label on GitHub
+    if: |
+      github.ref_name == 'main' ||
+      startsWith(github.ref_name, 'release/') ||
+      startsWith(github.head_ref, 'ui/') ||
+      startsWith(github.head_ref, 'backport/ui/') ||
+      startsWith(github.head_ref, 'merge') ||
+      contains(github.event.pull_request.labels.*.name, 'ui')
+    needs:
+      - setup
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7
+      - uses: ./.github/actions/set-up-go
+      # Setup node.js without caching to allow running npm install -g yarn (next step)
+      - uses: actions/setup-node@e33196f7422957bea03ed53f6fbb155025ffc7b8 # v3.7.0
+        with:
+          node-version-file: "./ui/package.json"
+      - id: install-yarn
+        run: |
+          npm install -g yarn
+      # Setup node.js with caching using the yarn.lock file
+      - uses: actions/setup-node@e33196f7422957bea03ed53f6fbb155025ffc7b8 # v3.7.0
+        with:
+          node-version-file: "./ui/package.json"
+          cache: yarn
+          cache-dependency-path: ui/yarn.lock
+      - id: install-browser
+        uses: browser-actions/setup-chrome@db1b524c26f20a8d1a10f7fc385c92387e2d0477 # v1.7.1
+      - id: ui-dependencies
+        name: ui-dependencies
+        working-directory: ./ui
+        run: |
+          yarn install --frozen-lockfile
+          npm rebuild node-sass
+      - id: build-go-dev
+        name: build-go-dev
+        run: |
+          rm -rf ./pkg
+          mkdir ./pkg
+
+          make ci-bootstrap dev
+      - id: test-ui
+        name: test-ui
+        run: |
+          export PATH="${PWD}/bin:${PATH}"
+
+          # Run Ember tests
+          cd ui
+          mkdir -p test-results/qunit
+          yarn test:oss
+      - uses: actions/upload-artifact@834a144ee995460fba8ed112a2fc961b36a5ec5a # v4.3.6
+        with:
+          name: test-results-ui
+          path: ui/test-results
+        if: success() || failure()
+      - uses: test-summary/action@31493c76ec9e7aa675f1585d3ed6f1da69269a86 # TSCCR: no entry for repository "test-summary/action"
+        with:
+          paths: "ui/test-results/qunit/results.xml"
+          show: "fail"
+        if: always()
 
   tests-completed:
     needs:
       - setup
       - test-go
-      # UI testing is currently disabled.
-      # - test-ui
+      - test-ui
     if: always()
     runs-on: ubuntu-latest
     steps:

diff --git a/ui/Makefile b/ui/Makefile
@@ -4,7 +4,7 @@ frontend:
 
 .PHONY: backend
 backend:
-	yarn bao
+	yarn openbao
 
 .PHONY: test
 test:

diff --git a/ui/tests/acceptance/pki/pki-action-forms-test.js b/ui/tests/acceptance/pki/pki-action-forms-test.js
@@ -184,7 +184,7 @@ module('Acceptance | pki action forms test', function (hooks) {
       assert.dom(S.configuration.emptyState).doesNotExist();
       // The URLs section is populated based on params returned from OpenAPI. This test will break when
       // the backend adds fields. We should update the count accordingly.
-      assert.dom(S.configuration.urlField).exists({ count: 4 });
+      assert.dom(S.configuration.urlField).exists({ count: 5 });
       // Fill in form
       await fillIn(S.configuration.typeField, 'internal');
       await typeIn(S.configuration.inputByName('commonName'), commonName);

diff --git a/ui/tests/acceptance/secrets/backend/alicloud/secret-test.js b/ui/tests/acceptance/secrets/backend/alicloud/secret-test.js
diff --git a/ui/tests/acceptance/secrets/backend/database/secret-test.js b/ui/tests/acceptance/secrets/backend/database/secret-test.js
@@ -34,12 +34,14 @@ const mount = async () => {
   return path;
 };
 
-const newConnection = async (backend, plugin = 'mongodb-database-plugin') => {
+const newConnection = async (backend, plugin = 'mysql-database-plugin') => {
   const name = `connection-${Date.now()}`;
   await connectionPage.visitCreate({ backend });
   await connectionPage.dbPlugin(plugin);
   await connectionPage.name(name);
-  await connectionPage.connectionUrl(`mongodb://127.0.0.1:4321/${name}`);
+  await connectionPage.connectionUrl(`{{username}}:{{password}}@tcp(127.0.0.1:3306)/${name}`);
+  await connectionPage.username('user');
+  await connectionPage.password('so-secure');
   await connectionPage.toggleVerify();
   await connectionPage.save();
   await connectionPage.enable();
@@ -192,7 +194,7 @@ module('Acceptance | secrets/database/*', function (hooks) {
   });
 
   test('Connection create and edit form for each plugin', async function (assert) {
-    assert.expect(161);
+    assert.expect(95);
     const backend = await mount();
     for (const testCase of connectionTests) {
       await connectionPage.visitCreate({ backend });
@@ -203,13 +205,7 @@ module('Acceptance | secrets/database/*', function (hooks) {
       await connectionPage.dbPlugin(testCase.plugin);
       assert.dom('[data-test-empty-state]').doesNotExist('Empty state goes away after plugin selected');
       await connectionPage.name(testCase.name);
-      if (testCase.plugin === 'elasticsearch-database-plugin') {
-        await connectionPage.url(testCase.url);
-        await connectionPage.username(testCase.elasticUser);
-        await connectionPage.password(testCase.elasticPassword);
-      } else {
-        await connectionPage.connectionUrl(testCase.url);
-      }
+      await connectionPage.connectionUrl(testCase.url);
       testCase.requiredFields(assert, testCase.name);
       await connectionPage.toggleVerify();
       await connectionPage.save();
@@ -251,14 +247,17 @@ module('Acceptance | secrets/database/*', function (hooks) {
   test('Can create and delete a connection', async function (assert) {
     const backend = await mount();
     const connectionDetails = {
-      plugin: 'mongodb-database-plugin',
+      plugin: 'mysql-database-plugin',
       id: 'horses-db',
       fields: [
         { label: 'Connection name', name: 'name', value: 'horses-db' },
-        { label: 'Connection URL', name: 'connection_url', value: 'mongodb://127.0.0.1:235/horses' },
+        {
+          label: 'Connection URL',
+          name: 'connection_url',
+          value: '{{username}}:{{password}}@tcp(127.0.0.1:3306)/',
+        },
         { label: 'Username', name: 'username', value: 'user', hideOnShow: true },
         { label: 'Password', name: 'password', password: 'so-secure', hideOnShow: true },
-        { label: 'Write concern', name: 'write_concern' },
       ],
     };
     assert.strictEqual(

diff --git a/ui/tests/acceptance/secrets/backend/engines-test.js b/ui/tests/acceptance/secrets/backend/engines-test.js
@@ -29,14 +29,13 @@ module('Acceptance | secret-engine list view', function (hooks) {
 
   test('it allows you to disable an engine', async function (assert) {
     // first mount an engine so we can disable it.
-    const enginePath = `alicloud-disable-${this.uid}`;
-    await mountSecrets.enable('alicloud', enginePath);
+    const enginePath = `pki-disable-${this.uid}`;
+    await mountSecrets.enable('pki', enginePath);
     await settled();
-    assert.ok(backendsPage.rows.filterBy('path', `${enginePath}/`)[0], 'shows the mounted engine');
-
     await backendsPage.visit();
     await settled();
     const row = backendsPage.rows.filterBy('path', `${enginePath}/`)[0];
+    assert.ok(row, 'shows the mounted engine');
     await row.menu();
     await settled();
     await backendsPage.disableButton();
@@ -55,48 +54,23 @@ module('Acceptance | secret-engine list view', function (hooks) {
     );
   });
 
-  test('it adds disabled css styling to unsupported secret engines', async function (assert) {
-    assert.expect(2);
-    // first mount engine that is not supported
-    const enginePath = `nomad-${this.uid}`;
-
-    await mountSecrets.enable('nomad', enginePath);
-    await settled();
-    await backendsPage.visit();
-    await settled();
-
-    const rows = document.querySelectorAll('[data-test-auth-backend-link]');
-    const rowUnsupported = Array.from(rows).filter((row) => row.innerText.includes('nomad'));
-    const rowSupported = Array.from(rows).filter((row) => row.innerText.includes('cubbyhole'));
-    assert
-      .dom(rowUnsupported[0])
-      .doesNotHaveClass(
-        'linked-block',
-        `the linked-block class is not added to unsupported engines, which effectively disables it.`
-      );
-    assert.dom(rowSupported[0]).hasClass('linked-block', `linked-block class is added to supported engines.`);
-
-    // cleanup
-    await consoleComponent.runCommands([`delete sys/mounts/${enginePath}`]);
-  });
-
   test('it filters by name and engine type', async function (assert) {
     assert.expect(4);
-    const enginePath1 = `aws-1-${this.uid}`;
-    const enginePath2 = `aws-2-${this.uid}`;
+    const enginePath1 = `database-1-${this.uid}`;
+    const enginePath2 = `database-2-${this.uid}`;
 
-    await mountSecrets.enable('aws', enginePath1);
-    await mountSecrets.enable('aws', enginePath2);
+    await mountSecrets.enable('database', enginePath1);
+    await mountSecrets.enable('database', enginePath2);
     await backendsPage.visit();
     await settled();
     // filter by type
     await clickTrigger('#filter-by-engine-type');
-    await searchSelect.options.objectAt(0).click();
+    await searchSelect.options.objectAt(1).click();
 
     const rows = document.querySelectorAll('[data-test-auth-backend-link]');
-    const rowsAws = Array.from(rows).filter((row) => row.innerText.includes('aws'));
+    const rowsAws = Array.from(rows).filter((row) => row.innerText.includes('database'));
 
-    assert.strictEqual(rows.length, rowsAws.length, 'all rows returned are aws');
+    assert.strictEqual(rows.length, rowsAws.length, 'all rows returned are database');
     // filter by name
     await clickTrigger('#filter-by-engine-name');
     const firstItemToSelect = searchSelect.options.objectAt(0).text;

diff --git a/ui/tests/acceptance/settings-test.js b/ui/tests/acceptance/settings-test.js
@@ -26,7 +26,7 @@ module('Acceptance | settings', function (hooks) {
   });
 
   test('settings', async function (assert) {
-    const type = 'consul';
+    const type = 'pki';
     const path = `settings-path-${this.uid}`;
 
     // mount unsupported backend
@@ -49,7 +49,13 @@ module('Acceptance | settings', function (hooks) {
       `Successfully mounted '${type}' at '${path}'!`
     );
     await settled();
-    assert.strictEqual(currentURL(), `/vault/secrets`, 'redirects to secrets page');
+    assert.strictEqual(
+      currentURL(),
+      `/vault/secrets/${path}/pki/overview`,
+      'redirects to secrets settings page'
+    );
+    await backendListPage.visit();
+    await settled();
     const row = backendListPage.rows.filterBy('path', path + '/')[0];
     await row.menu();
     await backendListPage.configLink();

diff --git a/ui/tests/acceptance/settings/auth/configure/index-test.js b/ui/tests/acceptance/settings/auth/configure/index-test.js
@@ -34,14 +34,14 @@ module('Acceptance | settings/auth/configure', function (hooks) {
   });
 
   test('it redirects to the first section', async function (assert) {
-    const path = `aws-redirect-${this.uid}`;
-    const type = 'aws';
+    const path = `ldap-redirect-${this.uid}`;
+    const type = 'ldap';
     await enablePage.enable(type, path);
     await page.visit({ path });
     assert.strictEqual(currentRouteName(), 'vault.cluster.settings.auth.configure.section');
     assert.strictEqual(
       currentURL(),
-      `/vault/settings/auth/configure/${path}/client`,
+      `/vault/settings/auth/configure/${path}/configuration`,
       'loads the first section for the type of auth method'
     );
   });