fix: resolve ibutsu job error

fix: replace custom Jest matcher with lodash in addPrefixToContent tests

chore: add basic claude config

fix: resolve component test setup for local development and CI workflows

fix: resolve component test configuration and CI workflow issues

Author: charlesmulder

.github/workflows/reporter.yml

@@ -15,7 +15,7 @@ jobs:
       - name: Install required dependencies
         run: npm ci
       - name: Run the tests
-        run: cd ${{ github.workspace }}/packages/components && npm run test:ct && npx merge-results -c cypress.config.ts
+        run: npm run test:component -- --reporter ${{ github.workspace }}/node_modules/mocha-ibutsu-reporter --reporter-options outputDir=${{ github.workspace }}/tmp/cypress-results,project=frontend-components,component=components && npx merge-results -p frontend-components -m components -d ${{ github.workspace }}/tmp/cypress-results
       - name: Login to Quay
         uses: docker/login-action@v3
         with:
@@ -28,4 +28,4 @@ jobs:
         run: |
           podman run -e AWS_BUCKET=${{ secrets.AWS_BUCKET }} -e AWS_REGION=${{ secrets.AWS_REGION }} \
           -e AWS_SECRET_ACCESS_KEY=${{ secrets.AWS_SECRET_ACCESS_KEY }} -e AWS_ACCESS_KEY_ID=${{ secrets.AWS_ACCESS_KEY_ID }} \
-          -v ${{ github.workspace }}/ibutsu-report:/results quay.io/cloudservices/iqe-artifact-uploader-s3:latest .
+          -v ${{ github.workspace }}/tmp/cypress-results:/results quay.io/cloudservices/iqe-artifact-uploader-s3:latest .

CLAUDE.md

@@ -0,0 +1,4 @@
+# Claude Code Configuration
+
+## Working Directory
+Always run commands from the project root directory (where this CLAUDE.md file is located).

package-lock.json

@@ -14,5 +14,5 @@ export default defineConfig({
       ...presets.devServer,
       webpackConfig,
     },
-  },
+  }
 });

packages/components/cypres.config.ts renamed to packages/components/cypress.config.ts

@@ -37,9 +37,9 @@
     "react-router-dom": "^5.0.0 || ^6.0.0"
   },
   "dependencies": {
+    "@patternfly/react-component-groups": "^6.0.0",
     "@redhat-cloud-services/frontend-components-utilities": "^7.0.0",
     "@redhat-cloud-services/types": "^3.0.0",
-    "@patternfly/react-component-groups": "^6.0.0",
     "@scalprum/core": "^0.8.1",
     "@scalprum/react-core": "^0.9.1",
     "classnames": "^2.2.5",

packages/components/package.json

@@ -70,9 +70,7 @@
     "test:component": {
       "executor": "@nx/cypress:cypress",
       "options": {
-        "cypressConfig": "packages/components/cypres.config.ts",
-        "tsConfig": "packages/components/tsconfig.cy.json",
-        "devServerTarget": "my-react-app:build",
+        "cypressConfig": "packages/components/cypress.config.ts",
         "testingType": "component",
         "skipServe": true
       }

packages/components/project.json

@@ -1,23 +1,6 @@
 import addPrefixToContent from './addPrefixToContent';
+import { words } from 'lodash';
 
-expect.extend({
-  toEqualIgnoringWhitespace(received, expected) {
-    const normalize = (str: string) => str.replace(/\s+/g, '');
-    const pass = normalize(received) === normalize(expected);
-
-    if (pass) {
-      return {
-        message: () => `expected ${received} not to equal (ignoring whitespace) ${expected}`,
-        pass: true,
-      };
-    } else {
-      return {
-        message: () => `expected ${received} to equal (ignoring whitespace) ${expected}`,
-        pass: false,
-      };
-    }
-  },
-});
 
 describe('shouldnt prefix nested selectors', () => {
   test('should add prefix above content', () => {
@@ -34,14 +17,14 @@ describe('shouldnt prefix nested selectors', () => {
                 }
             }
         }`;
-    expect(addPrefixToContent(content, prefix)).toEqualIgnoringWhitespace(output);
+    expect(words(addPrefixToContent(content, prefix))).toEqual(words(output));
   });
 
   test('should handle multiple top-level selectors in one string', () => {
     const content = `.learningResources-learningResources{overflow-y:auto}.widget-learning-resources{column-width:300px}`;
     const prefix = '.learningResources, .learning-resources';
     const output = `.learningResources, .learning-resources { .learningResources-learningResources {overflow-y:auto}}.learningResources, .learning-resources { .widget-learning-resources {column-width:300px}}`;
-    expect(addPrefixToContent(content, prefix)).toEqualIgnoringWhitespace(output);
+    expect(words(addPrefixToContent(content, prefix))).toEqual(words(output));
   });
 
   test('should ignore nested selector containing prefix', () => {
@@ -61,7 +44,7 @@ describe('shouldnt prefix nested selectors', () => {
             }
         }
     }`;
-    expect(addPrefixToContent(content, prefix)).toEqualIgnoringWhitespace(output);
+    expect(words(addPrefixToContent(content, prefix))).toEqual(words(output));
   });
 
   test('should handle deeply nested selectors with various properties and pseudo-classes', () => {
@@ -170,6 +153,6 @@ describe('shouldnt prefix nested selectors', () => {
       }
     }
     `;
-    expect(addPrefixToContent(content, prefix)).toEqualIgnoringWhitespace(output);
+    expect(words(addPrefixToContent(content, prefix))).toEqual(words(output));
   });
 });