migrated ResourceDetailsVisibility

Author: chriskari

src/shared/components/ResourceDetails/tests/ResourceDetailsColumns.cy.js

@@ -1,6 +1,7 @@
 /* global cy */
 import { ResourceDetails } from '../ResourceDetails';
 import { authDataState } from 'state/authDataAtom';
+import '@ui5/webcomponents-icons/dist/AllIcons.js';
 
 describe('ResourceDetails Columns', () => {
   it('Renders basic column', () => {
@@ -13,7 +14,7 @@ describe('ResourceDetails Columns', () => {
           namespace: 'test-resource-namespace',
         },
       },
-    }).as('testResource');
+    });
 
     const initializeRecoil = ({ set }) => {
       set(authDataState, {
@@ -38,8 +39,9 @@ describe('ResourceDetails Columns', () => {
       },
     );
 
-    cy.wait(5000);
-    cy.contains('some-header:').should('exist');
-    cy.contains('test-resource-name | test-resource-namespace').should('exist');
+    cy.contains('some-header:', { timeout: 10000 }).should('exist');
+    cy.contains('test-resource-name | test-resource-namespace', {
+      timeout: 10000,
+    }).should('exist');
   });
 });

src/shared/components/ResourceDetails/tests/ResourceDetailsVisibility.cy.js

@@ -0,0 +1,64 @@
+/* global cy */
+import { ResourceDetails } from '../ResourceDetails';
+import { authDataState } from 'state/authDataAtom';
+import '@ui5/webcomponents-icons/dist/AllIcons.js';
+
+describe('ResourceDetails visibility', () => {
+  it('Column visibility', () => {
+    cy.intercept('GET', '**test-resource-url**', {
+      statusCode: 200,
+      body: {
+        kind: 'TestKind',
+        metadata: {
+          name: 'test-resource-name',
+          namespace: 'test-resource-namespace',
+        },
+      },
+    });
+
+    const initializeRecoil = ({ set }) => {
+      set(authDataState, {
+        token: 'test-token',
+      });
+    };
+
+    cy.mount(
+      <ResourceDetails
+        resourceUrl="test-resource-url"
+        resourceType="test-resource-type"
+        customColumns={[
+          {
+            header: 'some-header--hidden',
+            value: () => 'should not be visible',
+            visibility: () => ({ visible: false }),
+          },
+          {
+            header: 'some-header--visible',
+            value: () => 'should be visible',
+            visibility: () => ({ visible: true }),
+          },
+          {
+            header: 'some-header--with-error',
+            value: () => 'will be ignored',
+            visibility: () => ({ error: 'error!' }),
+          },
+        ]}
+      />,
+      {
+        initializeRecoil,
+      },
+    );
+
+    cy.contains('some-header--hidden:', { timeout: 10000 }).should('not.exist');
+    cy.contains('should not be visible', { timeout: 10000 }).should(
+      'not.exist',
+    );
+
+    cy.contains('some-header--visible:', { timeout: 10000 }).should('exist');
+    cy.contains('should be visible', { timeout: 10000 }).should('exist');
+
+    cy.contains('some-header--with-error:', { timeout: 10000 }).should('exist');
+    cy.contains('will be ignored', { timeout: 10000 }).should('not.exist');
+    cy.contains('common.messages.error', { timeout: 10000 }).should('exist');
+  });
+});