fix(cypress) Fix flakiness of cypress test for glossary navigation (#…

…9410)

Co-authored-by: david-leifker <[email protected]>

datahub-web-react/src/app/entity/shared/EntityDropdown/useDeleteEntity.tsx

@@ -7,6 +7,7 @@ import analytics, { EventType } from '../../../analytics';
 import { useGlossaryEntityData } from '../GlossaryEntityContext';
 import { getParentNodeToUpdate, updateGlossarySidebar } from '../../../glossary/utils';
 import { useHandleDeleteDomain } from './useHandleDeleteDomain';
+import { removeTermFromGlossaryNode } from '../../../glossary/cacheUtils';
 
 /**
  * Performs the flow for deleting an entity of a given type.
@@ -30,6 +31,7 @@ function useDeleteEntity(
 
     const maybeDeleteEntity = getDeleteEntityMutation(type)();
     const deleteEntity = (maybeDeleteEntity && maybeDeleteEntity[0]) || undefined;
+    const client = maybeDeleteEntity?.[1].client;
 
     function handleDeleteEntity() {
         deleteEntity?.({
@@ -54,6 +56,10 @@ function useDeleteEntity(
                     handleDeleteDomain();
                 }
 
+                if (client && entityData.type === EntityType.GlossaryTerm && entityData?.parentNodes?.nodes) {
+                    removeTermFromGlossaryNode(client, entityData.parentNodes.nodes[0].urn, urn);
+                }
+
                 setTimeout(
                     () => {
                         setHasBeenDeleted(true);

datahub-web-react/src/app/glossary/cacheUtils.ts

@@ -0,0 +1,36 @@
+import { ApolloClient } from '@apollo/client';
+import { GetGlossaryNodeDocument, GetGlossaryNodeQuery } from '../../graphql/glossaryNode.generated';
+
+export function removeTermFromGlossaryNode(
+    client: ApolloClient<object>,
+    glossaryNodeUrn: string,
+    glossaryTermUrn: string,
+) {
+    // Read the data from our cache for this query.
+    const currData: GetGlossaryNodeQuery | null = client.readQuery({
+        query: GetGlossaryNodeDocument,
+        variables: { urn: glossaryNodeUrn },
+    });
+
+    // Remove the term from the existing children set.
+    const newTermChildren = {
+        relationships: [
+            ...(currData?.glossaryNode?.children?.relationships || []).filter(
+                (relationship) => relationship.entity?.urn !== glossaryTermUrn,
+            ),
+        ],
+        total: (currData?.glossaryNode?.children?.total || 1) - 1,
+    };
+
+    // Write our data back to the cache.
+    client.writeQuery({
+        query: GetGlossaryNodeDocument,
+        variables: { urn: glossaryNodeUrn },
+        data: {
+            glossaryNode: {
+                ...currData?.glossaryNode,
+                children: newTermChildren,
+            },
+        },
+    });
+}

smoke-test/tests/cypress/cypress/e2e/glossary/glossary_navigation.js

@@ -1,6 +1,6 @@
 const glossaryTerm = "CypressGlosssaryNavigationTerm";
 const glossaryTermGroup = "CypressGlosssaryNavigationGroup";
-const glossaryParentGroup = "Cypress";
+const glossaryParentGroup = "CypressNode";
 
 describe("glossary sidebar navigation test", () => {
     it("create term and term parent group, move and delete term group", () => {
@@ -33,6 +33,7 @@ describe("glossary sidebar navigation test", () => {
         // Move a term group from the root level to be under a parent term group
         cy.goToGlossaryList();
         cy.clickOptionWithText(glossaryTermGroup);
+        cy.wait(3000)
         cy.openThreeDotDropdown();
         cy.clickOptionWithText("Move");
         cy.get('[data-testid="move-glossary-entity-modal"]').contains(glossaryParentGroup).click({force: true});