add test case for model deployment details loading indicator (#604)

Signed-off-by: Lin Wang <wonglam@amazon.com>

cypress/integration/plugins/ml-commons-dashboards/overview_spec.js

@@ -2,7 +2,7 @@
  * Copyright OpenSearch Contributors
  * SPDX-License-Identifier: Apache-2.0
  */
-import { MLC_URL } from '../../../utils/constants';
+import { MLC_URL, MLC_DASHBOARD_API } from '../../../utils/constants';
 
 if (Cypress.env('ML_COMMONS_DASHBOARDS_ENABLED')) {
   describe('MLC Overview page', () => {
@@ -96,5 +96,35 @@ if (Cypress.env('ML_COMMONS_DASHBOARDS_ENABLED')) {
       cy.contains('.euiFlyoutHeader > h3', uploadModelName);
       cy.contains('.euiFlyoutBody', uploadedModelId);
     });
+
+    it('should show empty nodes when deployed model profiling loading', () => {
+      cy.intercept(
+        'GET',
+        MLC_DASHBOARD_API.DEPLOYED_MODEL_PROFILE.replace(
+          ':modelID',
+          uploadedModelId
+        ),
+        (req) => {
+          req.on('response', (res) => {
+            res.setDelay(3000);
+          });
+        }
+      ).as('getDeployedModelProfile');
+
+      cy.visit(MLC_URL.OVERVIEW);
+
+      cy.get('[aria-label="Search by name or ID"]').type(uploadModelName);
+
+      cy.contains(uploadedModelId)
+        .closest('tr')
+        .find('[aria-label="view detail"]')
+        .click();
+
+      cy.get('div[role="dialog"] .ml-nodesTableNodeIdCellText', {
+        timeout: 0,
+      }).should('not.exist');
+      cy.wait('@getDeployedModelProfile');
+      cy.get('div[role="dialog"] .ml-nodesTableNodeIdCellText').should('exist');
+    });
   });
 }

cypress/utils/plugins/ml-commons-dashboards/constants.js

@@ -25,3 +25,9 @@ export const MLC_API = {
   MODEL_UPLOAD: `${MLC_API_BASE}/models/_upload`,
   TASK_BASE: `${MLC_API_BASE}/tasks`,
 };
+
+const BASE_MLC_DASHBOARD_API = BASE_PATH + '/api/ml-commons';
+
+export const MLC_DASHBOARD_API = {
+  DEPLOYED_MODEL_PROFILE: `${BASE_MLC_DASHBOARD_API}/profile/deployed-model/:modelID`,
+};