@jahia/cypress 8.0.0 → 8.1.0

package/src/support/apollo/apollo.ts

@@ -4,7 +4,9 @@
 /// <reference types="cypress" />
 
 import {ApolloClient, ApolloQueryResult, FetchResult, MutationOptions, QueryOptions} from '@apollo/client/core';
+import {DocumentNode} from '@apollo/client/core';
 import gql from 'graphql-tag';
+import {FieldNode, getOperationAST, print} from 'graphql';
 
 declare global {
     namespace Cypress {
@@ -15,8 +17,8 @@ declare global {
     }
 }
 
-export type FileQueryOptions = Partial<QueryOptions> & { queryFile?: string }
-export type FileMutationOptions = Partial<MutationOptions> & { mutationFile?: string }
+export type FileQueryOptions = Partial<QueryOptions> & { queryFile?: string; sourcePackage?: string }
+export type FileMutationOptions = Partial<MutationOptions> & { mutationFile?: string; sourcePackage?: string }
 export type ApolloOptions = (QueryOptions | MutationOptions | FileQueryOptions | FileMutationOptions) & Partial<Cypress.Loggable>;
 
 function isQuery(options: ApolloOptions): options is QueryOptions {
@@ -31,51 +33,112 @@ function isMutationFile(options: ApolloOptions): options is FileMutationOptions
     return (<FileMutationOptions>options).mutationFile !== undefined;
 }
 
+function getOperationLabel(doc: DocumentNode, opType: 'Query' | 'Mutation'): string {
+    const opDef = getOperationAST(doc);
+    if (opDef?.name?.value) {
+        return `[${opType}] ${opDef.name.value}`;
+    }
+
+    // Anonymous operation: traverse up to 2 selection levels for a meaningful label
+    const firstSel = opDef?.selectionSet?.selections?.[0];
+    if (firstSel?.kind === 'Field') {
+        const firstName = (firstSel as FieldNode).name.value;
+        const secondSel = (firstSel as FieldNode).selectionSet?.selections?.[0];
+        if (secondSel?.kind === 'Field') {
+            return `[${opType}] ${firstName} › ${(secondSel as FieldNode).name.value}`;
+        }
+
+        return `[${opType}] ${firstName}`;
+    }
+
+    return `[${opType}]`;
+}
+
+function getQueryBody(doc: DocumentNode): string {
+    return doc?.loc?.source?.body ?? print(doc);
+}
+
 // eslint-disable-next-line default-param-last, @typescript-eslint/no-shadow
 export const apollo = function (apollo: ApolloClient<any> = this.currentApolloClient, options: ApolloOptions): void {
     let result : ApolloQueryResult<any> | FetchResult;
     let logger : Cypress.Log;
+    let duration: number;
     const optionsWithDefaultCache: ApolloOptions = {fetchPolicy: 'no-cache', ...options};
 
     if (!apollo) {
         cy.apolloClient().apollo(optionsWithDefaultCache);
     } else if (isQueryFile(optionsWithDefaultCache)) {
-        const {queryFile, ...apolloOptions} = optionsWithDefaultCache;
+        const {queryFile, sourcePackage, ...apolloOptions} = optionsWithDefaultCache as FileQueryOptions & Partial<Cypress.Loggable>;
         cy.fixture(queryFile).then(content => {
-            cy.apollo({query: gql(content), ...apolloOptions});
+            const fileLabel = sourcePackage ? `${queryFile} @ ${sourcePackage}` : queryFile;
+            cy.apollo({query: gql(content), ...apolloOptions, _sourceFile: fileLabel} as ApolloOptions);
         });
     } else if (isMutationFile(optionsWithDefaultCache)) {
-        const {mutationFile, ...apolloOptions} = optionsWithDefaultCache;
+        const {mutationFile, sourcePackage, ...apolloOptions} = optionsWithDefaultCache as FileMutationOptions & Partial<Cypress.Loggable>;
         cy.fixture(mutationFile).then(content => {
-            cy.apollo({mutation: gql(content), ...apolloOptions});
+            const fileLabel = sourcePackage ? `${mutationFile} @ ${sourcePackage}` : mutationFile;
+            cy.apollo({mutation: gql(content), ...apolloOptions, _sourceFile: fileLabel} as ApolloOptions);
         });
     } else {
         const {log = true, ...apolloOptions} = optionsWithDefaultCache;
+
+        const doc = isQuery(apolloOptions) ?
+            (apolloOptions as QueryOptions).query :
+            (apolloOptions as MutationOptions).mutation;
+        const opType = isQuery(apolloOptions) ? 'Query' : 'Mutation';
+        const operationLabel = getOperationLabel(doc, opType);
+        const queryBody = getQueryBody(doc);
+        const variables = (apolloOptions as any).variables;
+        const sourceLabel = (optionsWithDefaultCache as any)._sourceFile ? ` (${(optionsWithDefaultCache as any)._sourceFile})` : '';
+        const variablesLabel = variables && Object.keys(variables).length > 0 ?
+            ` — ${JSON.stringify(variables)}` :
+            '';
+
         if (log) {
             logger = Cypress.log({
                 autoEnd: false,
                 name: 'apollo',
                 displayName: 'apollo',
-                message: isQuery(apolloOptions) ? `Execute Graphql Query: ${apolloOptions.query.loc.source.body}` : `Execute Graphql Mutation: ${apolloOptions.mutation.loc.source.body}`,
+                message: `${operationLabel}${sourceLabel}${variablesLabel}`,
                 consoleProps: () => {
+                    const errors = (result as any)?.errors ?? (result as any)?.graphQLErrors ?? null;
+                    const isCaughtError = result instanceof Error;
+                    const hasErrors = (errors?.length > 0) || isCaughtError;
                     return {
-                        Options: apolloOptions,
+                        Operation: operationLabel,
+                        Variables: variables ?? {},
+                        [`${opType} Body`]: queryBody,
+                        Duration: duration === undefined ? 'pending' : `${duration}ms`,
+                        Status: hasErrors ?
+                            `error${isCaughtError ? `: ${(result as unknown as Error).message}` : ''}` :
+                            'success',
+                        Data: (result as any)?.data ?? null,
+                        Errors: errors,
                         Yielded: result
                     };
                 }
             });
         }
 
-        cy.wrap({}, {log: true})
+        const startTime = Date.now();
+        cy.wrap({}, {log: false})
             .then(() => (isQuery(optionsWithDefaultCache) ? apollo.query(optionsWithDefaultCache).catch(error => {
-                cy.log(`Caught Graphql Query Error: ${JSON.stringify(error)}`);
+                cy.log(`Caught GraphQL query error: ${(error as any)?.message ?? JSON.stringify(error)}`);
                 return error;
             }) : apollo.mutate(optionsWithDefaultCache).catch(error => {
-                cy.log(`Caught Graphql Mutation Error: ${JSON.stringify(error)}`);
+                cy.log(`Caught GraphQL mutation error: ${(error as any)?.message ?? JSON.stringify(error)}`);
                 return error;
             }))
                 .then(r => {
                     result = r;
+                    duration = Date.now() - startTime;
+                    if (logger) {
+                        const errors = (r as any)?.errors ?? (r as any)?.graphQLErrors;
+                        const hasErrors = (r instanceof Error) || (errors?.length > 0);
+                        const prefix = hasErrors ? '❌ ' : '✅ ';
+                        logger.set('message', `${prefix}${operationLabel}${sourceLabel}${variablesLabel}`);
+                    }
+
                     logger?.end();
                     return r;
                 })

package/src/support/browserHelper.ts

@@ -0,0 +1,186 @@
+/*
+ * Contains helpers for printing or clearing browser's storage and cookies.
+ * These are intended for interactive debugging and log full values by design.
+ * Use with caution in automated tests to avoid exposing sensitive data in logs.
+ */
+
+/**
+ * Prints cookie details in a structured format for debugging.
+ *
+ * Note: This helper logs the full cookie value by design.
+ * @param {Cypress.Cookie} cookie Cookie object returned by Cypress.
+ * @returns {void}
+ * @private
+ */
+const printCookieValues = (cookie: Cypress.Cookie): void => {
+    const cookieType = cookie.expiry ? 'Persistent' : 'Session';
+    const expiryDate = cookie.expiry ? new Date(cookie.expiry * 1000).toISOString() : 'Session only';
+    const daysUntilExpiry = cookie.expiry ? Math.round(((cookie.expiry * 1000) - Date.now()) / 1000 / 60 / 60 / 24) : null;
+
+    cy.log('-'.repeat(60));
+    cy.log(`Cookie: ${cookie.name}`);
+    cy.log('-'.repeat(60));
+    cy.log(`Type:       ${cookieType}`);
+    cy.log(`Value:      ${cookie.value}`);
+    cy.log(`Domain:     ${cookie.domain}`);
+    cy.log(`Path:       ${cookie.path}`);
+    cy.log(`Secure:     ${cookie.secure ? '✔ Yes' : '✘ No'}`);
+    cy.log(`HttpOnly:   ${cookie.httpOnly ? '✔ Yes' : '✘ No'}`);
+    cy.log(`SameSite:   ${cookie.sameSite || '(not set)'}`);
+
+    if (cookie.expiry) {
+        cy.log(`Expires:    ${expiryDate}`);
+        cy.log(`Days left:  ${daysUntilExpiry} days`);
+        cy.log(`Unix time:  ${cookie.expiry}`);
+    } else {
+        cy.log('Expires:    When browser closes (session cookie)');
+    }
+};
+
+/**
+ * Clears cookies based on their persistence type.
+ * @param {'session'|'persistent'} [type='session'] Cookie category to clear.
+ * @returns {Cypress.Chainable<void>} Cypress chainable resolved when clearing is complete.
+ */
+const clearCookiesByType = (type: 'session' | 'persistent' = 'session'): Cypress.Chainable<void> => {
+    return cy.getCookies().then(cookies => {
+        const cookiesToClear = cookies.filter(cookie => (type === 'session' ? !cookie.expiry : Boolean(cookie.expiry)));
+
+        cy.step(`🗑️ CLEAR ${cookiesToClear.length} ${type} cookie(s):`, () => {
+            cookiesToClear.forEach(cookie => {
+                const info = cookie.expiry ? `expires ${new Date(cookie.expiry * 1000).toISOString()}` : 'session only';
+                cy.log(` ... clearing ${cookie.name} (${info})`);
+                cy.clearCookie(cookie.name);
+            });
+        });
+    }).then(() => undefined);
+};
+
+/**
+ * Logs all available cookies with metadata and values.
+ *
+ * Intended for interactive debugging when full cookie visibility is needed.
+ * @returns {Cypress.Chainable<void>} Cypress chainable resolved when logging is complete.
+ */
+const logCookies = (): Cypress.Chainable<void> => {
+    return cy.getCookies().then(cookies => {
+        if (cookies.length === 0) {
+            cy.log('No cookies found');
+            return;
+        }
+
+        cy.step(`COOKIES REPORT - Total: ${cookies.length}`, () => {
+            const sessionCookies = cookies.filter(c => !c.expiry);
+            const persistentCookies = cookies.filter(c => Boolean(c.expiry));
+
+            cy.log(`Session Cookies: ${sessionCookies.length}`);
+            cy.log(`Persistent Cookies: ${persistentCookies.length}`);
+
+            cookies.forEach(cookie => {
+                printCookieValues(cookie);
+            });
+        });
+    }).then(() => undefined);
+};
+
+/**
+ * Logs a specific cookie by name in a detailed format.
+ *
+ * Intended for interactive debugging when full cookie visibility is needed.
+ * @param {string} cookieName Name of the cookie to read and print.
+ * @returns {Cypress.Chainable<void>} Cypress chainable resolved when logging is complete.
+ */
+const logCookie = (cookieName: string): Cypress.Chainable<void> => {
+    return cy.getCookie(cookieName).then(cookie => {
+        if (!cookie) {
+            cy.log(`Cookie "${cookieName}" not found`);
+            return;
+        }
+
+        printCookieValues(cookie);
+    }).then(() => undefined);
+};
+
+/**
+ * Clears Session cookies
+ * @returns {Cypress.Chainable<void>} Cypress chainable resolved when logging is complete.
+ */
+const clearSessionCookies = (): Cypress.Chainable<void> => {
+    return clearCookiesByType('session').then(() => undefined);
+};
+
+/**
+ * Clears Persistent cookies
+ * @returns {Cypress.Chainable<void>} Cypress chainable resolved when logging is complete.
+ */
+const clearPersistentCookies = (): Cypress.Chainable<void> => {
+    return clearCookiesByType('persistent').then(() => undefined);
+};
+
+/**
+ * Simulates a browser close by clearing session storage and cookies.
+ * Persistent cookies are kept intentionally.
+ * @returns {void}
+ */
+const simulateClose = (): void => {
+    cy.log('Simulating browser close...');
+
+    // Clear session storage
+    cy.clearAllSessionStorage();
+
+    // Clear session cookies only
+    clearSessionCookies();
+
+    cy.log('Browser close simulated (session storage and cookies are cleared)');
+};
+
+/**
+ * Resets browser state by clearing all storages and all cookies.
+ * Use this when a test needs a fully clean client-side state.
+ * @returns {void}
+ */
+const resetState = (): void => {
+    cy.log('Reset browser state...');
+
+    // Clear all storage
+    cy.clearAllLocalStorage();
+    cy.clearAllSessionStorage();
+
+    // Clear all cookies
+    cy.clearAllCookies();
+
+    cy.log('Browser reset is done (all storages and cookies cleared)');
+};
+
+/**
+ * Logs all sessionStorage entries grouped by origin.
+ * Intended for interactive debugging and logs full values.
+ * @returns {Cypress.Chainable<void>} Cypress chainable resolved when logging is complete.
+ */
+const logSessionStorage = (): Cypress.Chainable<void> => {
+    return cy.getAllSessionStorage().then(session => {
+        cy.log(`sessionStorage: ${JSON.stringify(session)}`);
+    }).then(() => undefined);
+};
+
+/**
+ * Logs all localStorage entries grouped by origin.
+ * Intended for interactive debugging and logs full values.
+ * @returns {Cypress.Chainable<void>} Cypress chainable resolved when logging is complete.
+ */
+const logLocalStorage = (): Cypress.Chainable<void> => {
+    return cy.getAllLocalStorage().then(local => {
+        cy.log(`localStorage: ${JSON.stringify(local)}`);
+    }).then(() => undefined);
+};
+
+export const BrowserHelper = {
+    logCookies,
+    logCookie,
+    logSessionStorage,
+    logLocalStorage,
+    clearSessionCookies,
+    clearPersistentCookies,
+    simulateClose,
+    resetState
+};

package/src/support/index.ts

@@ -5,3 +5,6 @@ export * from './logout';
 export * from './repeatUntil';
 export * from './testStep';
 export * from './jsErrorsLogger';
+export * from './jfaker';
+export * from './browserHelper';
+export * from './modSince';

package/src/support/jfaker.ts

@@ -0,0 +1,245 @@
+/* eslint-disable no-else-return */
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/**
+ * jfaker - A flexible data generator for Cypress tests, supporting both faker.js generated data and custom injection payloads.
+ *
+ * This module provides a unified interface to generate either faker data or custom injection payloads based on the method called and global settings.
+ * It uses a dynamic Proxy to handle method calls and determine whether to generate faker data or injection data.
+ *
+ * IMPORTANT:
+ * When using the generated strings from jfaker in Cypress commands like `.type()`, make sure to:
+ * use `parseSpecialCharSequences: false`, e.g.: `<input>.type(text, {parseSpecialCharSequences: false})`
+ * to prevent Cypress from interpreting special characters in the generated strings (e.g., {, }, [, ], etc.) as commands,
+ * which is especially important for injection payloads that may contain such characters.
+ */
+
+import {faker} from '@faker-js/faker';
+
+// Import injection data from corresponding files in injections-ts directory
+import {xssData} from '../injections/xss-data';
+import {sqlData} from '../injections/sql-data';
+import {bashData} from '../injections/bash-data';
+import {charsData} from '../injections/chars-data';
+import {htmlentitiesData} from '../injections/htmlentities-data';
+import {numbersData} from '../injections/numbers-data';
+
+const injectionData: Record<string, string[]> = {
+    xss: xssData,
+    sql: sqlData,
+    bash: bashData,
+    chars: charsData,
+    htmlentities: htmlentitiesData,
+    numbers: numbersData
+};
+
+// Environment variable key for storing injection type in Cypress env
+// Can be set either using corresponding FakeData method or as an env var from CI/CD pipeline
+const ENV_INJECTIONS_TYPE = 'JAHIA_CYPRESS_INJECTION_TYPE';
+
+// Default range for random length of injection payloads; used when length is undefined
+// Random items within the range will be picked and joined into a single string
+const injectionsDefaultLength = {min: 2, max: 5};
+
+/**
+ * Store FakeData type in Cypress env for persistence across specs
+ * @param {string} type FakeData type: 'faker' | 'xss' | 'sql' | 'bash' | 'chars' | 'htmlentities' | 'numbers'
+ * @returns void
+ */
+function setDataType(type: string): void {
+    Cypress.env(ENV_INJECTIONS_TYPE, type);
+}
+
+/**
+ * Retrieve FakeData type from Cypress env (defaults to 'faker' if not set)
+ * @returns {string} Type of FakeData to use
+ */
+function getDataType(): string | undefined {
+    return Cypress.env(ENV_INJECTIONS_TYPE) || 'faker';
+}
+
+/**
+ * Generate injection data based on the specified type and length
+ * @param {string} type Injection type to generate (xss, sql, bash, chars, htmlentities, numbers)
+ * @param {number} length Length of the generated injection (optional)
+ * @returns {string} Generated injection string
+ */
+function generateInjection(type: string, length?: number): string {
+    let result: string[] = [];
+
+    // Type is specified and exists in injectionData, use it to generate data
+    const data = injectionData[type];
+    if (!data || data.length === 0) {
+        throw new Error(`[jFaker EXCEPTION] No injection data found for type: ${type}.`);
+    }
+
+    if (length === -1) {
+        // If length is -1, use all available items from the data array
+        result = data;
+    } else if (length && length > 0) {
+        // If length is specified and greater than 0, pick random items until the combined length meets the requirement
+        while (result.join('').length < length) {
+            const randomIndex = Math.floor(Math.random() * data.length);
+            result.push(data[randomIndex]);
+        }
+
+        // Trim the combined string to the specified length
+        const combined = result.join('');
+        result = [combined.substring(0, length)];
+    } else {
+        // If length is not specified, pick a random number of items within the default range
+        const itemsCount = Math.floor(Math.random() * injectionsDefaultLength.max) + injectionsDefaultLength.min;
+        for (let i = 0; i < itemsCount; i++) {
+            const randomIndex = Math.floor(Math.random() * data.length);
+            result.push(data[randomIndex]);
+        }
+    }
+
+    return result.join('');
+}
+
+/**
+ * Generate faker data based on the specified entity and options
+ * @param {string} entity Faker entity to generate (e.g., "person.firstName")
+ * @param {Record<string, unknown> | string | number | boolean | undefined} options Options to pass to the faker method (optional)
+ * @returns {string} Generated faker string
+ */
+function generateFake(entity: string, options?: Record<string, unknown> | string | number | boolean | undefined): string {
+    let generator: () => string;
+    const result: string[] = [];
+    const parts: string[] = entity.split('.');
+    let fakerMethod: any = faker;
+
+    for (const part of parts) {
+        if (fakerMethod && typeof fakerMethod[part] !== 'undefined') {
+            fakerMethod = fakerMethod[part];
+        } else {
+            throw new Error(`[jFaker EXCEPTION] Invalid faker method: ${entity}`);
+        }
+    }
+
+    if (typeof fakerMethod === 'function') {
+        generator = (options && Object.keys(options).length > 0) ? () => fakerMethod(options) : () => fakerMethod();
+    } else {
+        throw new Error(`[jFaker EXCEPTION] ${entity} is not a function`);
+    }
+
+    result.push(generator());
+
+    return result.join('');
+}
+
+/**
+ * Escape string to prevent issues when used in contexts like HTML or JavaScript
+ * @param str
+ */
+function escape(str: string): string {
+    return JSON.stringify(str).slice(1, -1);
+}
+
+/**
+ * Simple DeepApi class to create a dynamic nested Proxy for generating fake data using faker or injection data based on method calls
+ */
+class DeepApi {
+    constructor(private handler: (path: string, args: any[]) => any) {
+        return this.createProxy([]);
+    }
+
+    private createProxy(path: string[]): any {
+        return new Proxy(
+            // The target is a function, so the proxy itself is callable
+            function () {},
+            {
+                // Handle property access - go deeper
+                get: (target, prop) => {
+                    return this.createProxy([...path, String(prop)]);
+                },
+
+                // Handle function call - execute handler
+                apply: (target, thisArg, args) => {
+                    return this.handler(path.join('.'), args);
+                }
+            }
+        );
+    }
+}
+
+/**
+ * Interface to Fake Data generator (using DeepApi proxy to handle dynamic method calls)
+ * @param {Record<string, unknown>} options Options for data generation (length for injections, faker options, safe flag), \
+ *                                          e.g.: `{length: 100}` for injections to specify desired length of the generated string, \
+ *                                          or `{provider: 'example.com'}` for faker to pass options to the faker method. \
+ *                                          For faker data generation, an additional option `safe` can be set to `true` \
+ *                                          to force faker generation regardless of global type settings \
+ *                                          (useful for specific cases where faker data is needed even when global type is set to injection).
+ * @remarks
+ * Available injection methods:
+ * - `.xss()` - Generate XSS injection payloads
+ * - `.sql()` - Generate SQL injection payloads
+ * - `.bash()` - Generate Bash injection payloads
+ * - `.chars()` - Generate random special characters
+ * - `.htmlentities()` - Generate HTML entities
+ * - `.numbers()` - Generate random numbers entities and edge cases
+ * - or any faker.js method can also be called (e.g., `person.firstName()`, `internet.email()`)
+ *
+ * @returns {string} Generated data string based on the method called and options provided
+ *
+ * @see https://fakerjs.dev/api/ for available faker methods and options
+ * @example
+ * ```typescript
+ *
+ * // Generate faker data with entity.
+ * const name = jfaker.person.firstName();
+ *
+ * // Entity will always be generated using faker (safe: true)
+ * const name = jfaker.person.firstName({safe: true});
+ *
+ * // Generate faker data with options.
+ * const email = jfaker.internet.email({provider: 'example.com'});
+ *
+ * // Generate injection payloads (random between min and max items joined into a single string)..
+ * // Entity will always be generated using 'xss'.
+ * const xssName = jfaker.xss();
+ *
+ * // Generate injection payloads with specific length.
+ * // Entity will always be generated using 'xss'.
+ * const xssName = jfaker.xss({length: 100});
+ *
+ * // Use all SQL injections.
+ * // Entity will always be generated using 'sql'.
+ * const allSql = jfaker.sql({length: -1});
+ * ```
+ */
+const jfaker = new DeepApi((path, args) => {
+    // Handle non-faker methods first (escape, setFakeDataType, getFakeDataType)
+    switch (path) {
+        case 'escape':
+            return escape(args[0]);
+        case 'setDataType':
+            return setDataType(args[0]);
+        case 'getDataType':
+            return getDataType();
+        case Object.prototype.hasOwnProperty.call(injectionData, path) ? path : 'default':
+            // If the path corresponds to a valid injection type, generate data using that type,
+            // or fallback to default case which treats the path as a faker entity.
+            // Keep (safe === true) logic in "default" case for a readability.
+            return generateInjection(path, args[0]?.length);
+        default: {
+            // For faker data generation, check if the generation should be persistent based on global settings and options passed.
+            const safe = args[0]?.safe === true;
+            // Delete the 'safe' property from options to avoid passing it to faker methods
+            delete args[0]?.safe;
+
+            // Here path represents a faker entity.
+            // Check desired data type and 'safe' option to determine whether to generate faker data or injection data.
+            // If global type is set to injection (to override faker data) but safe is explicitly set to true in options -
+            // generate faker data for this specific call regardless of global settings.
+            if (getDataType() === 'faker' || safe) {
+                return generateFake(path, args[0]);
+            } else {
+                return generateInjection(getDataType(), args[0]?.length);
+            }
+        }
+    }
+}) as any;
+
+export {jfaker};