e2e: flakiness reproducing locally

[igarashitm]

Please describe the task that needs to be done

Env

• Fedora 43
• Firefox 149

Steps to reproduce

1. in packages/ui, run yarn start
2. in packages/ui-tests, run yarn e2e:headless -b firefox --spec cypress/e2e/designer/basicNodeActions/stepAddition.cy.ts

It's constantly failing for me locally. I'm seeing 2 different errors

1

  Tests for Design page
    1) Design - add steps to CamelRoute
    ✓ Design - add steps to Pipe/KB (9606ms)
    ✓ Design - add steps to CamelRoute using the quick append icon (10503ms)


  2 passing (39s)
  1 failing

  1) Tests for Design page
       Design - add steps to CamelRoute:
     AssertionError: Timed out retrying after 8000ms: Expected to find element: `#as2`, but never found it.
      at ./cypress/support/next-commands/design.ts (webpack://@kaoto/kaoto-tests/./cypress/support/next-commands/design.ts:107:21)
      at __webpack_modules__</addCommand/wrap (http://localhost:5173/__cypress/runner/cypress_runner.js:141663:43)

2

  Tests for Design page
    1) Design - add steps to CamelRoute
    2) Design - add steps to Pipe/KB
    ✓ Design - add steps to CamelRoute using the quick append icon (70156ms)


  1 passing (3m)
  2 failing

  1) Tests for Design page
       Design - add steps to CamelRoute:
     AssertionError: Timed out retrying after 8000ms: Expected to find element: `[data-testid="context-menu-item-prepend"]`, but never found it.
      at ./cypress/support/next-commands/design.ts (webpack://@kaoto/kaoto-tests/./cypress/support/next-commands/design.ts:152:27)
      at __webpack_modules__</addCommand/wrap (http://localhost:5173/__cypress/runner/cypress_runner.js:141663:43)

  2) Tests for Design page
       Design - add steps to Pipe/KB:
     AssertionError: Timed out retrying after 8000ms: Expected to find element: `[data-testid="context-menu-item-append"]`, but never found it.
      at ./cypress/support/next-commands/design.ts (webpack://@kaoto/kaoto-tests/./cypress/support/next-commands/design.ts:152:27)
      at __webpack_modules__</addCommand/wrap (http://localhost:5173/__cypress/runner/cypress_runner.js:141663:43)

Claude suggested a fix for No.1, but it's not clear if this is effective. I only reproduced No.1 once and after that I'm only getting No.2

diff --git a/packages/ui/src/dynamic-catalog/dynamic-catalog.ts b/packages/ui/src/dynamic-catalog/dynamic-catalog.ts
index ec7bf549..b175270c 100644
--- a/packages/ui/src/dynamic-catalog/dynamic-catalog.ts
+++ b/packages/ui/src/dynamic-catalog/dynamic-catalog.ts
@@ -4,6 +4,7 @@ import { ICatalogProvider, IDynamicCatalog } from './models';
 
 export class DynamicCatalog<T = unknown> implements IDynamicCatalog<T> {
   protected readonly cache: Record<string, T> = {};
+  private fetchedAll = false;
 
   constructor(protected readonly provider: ICatalogProvider<T>) {}
 
@@ -23,7 +24,8 @@ export class DynamicCatalog<T = unknown> implements IDynamicCatalog<T> {
   async getAll(
     options: { forceFresh?: boolean; filterFn?: (key: string, entity: T) => boolean } = {},
   ): Promise<Record<string, T>> {
-    if (options.forceFresh || Object.keys(this.cache).length === 0) {
+    if (options.forceFresh || !this.fetchedAll) {
+      this.fetchedAll = true;
       const entities = await this.provider.fetchAll();
       Object.entries(entities).forEach(([key, entity]) => {
         this.cache[key] = entity;
@@ -47,6 +49,7 @@ export class DynamicCatalog<T = unknown> implements IDynamicCatalog<T> {
   }
 
   clearCache(): void {
+    this.fetchedAll = false;
     Object.keys(this.cache).forEach((key) => {
       delete this.cache[key];
     });

To be investigated.

[igarashitm]

On hold. The error No.1 should have been addressed with #3177. The error No.2 only reproduces on my local. See if anybody else hits.