@react-native-ama/core 1.2.1 → 2.0.0-beta.1

package/dist/src/hooks/useButtonChecks.js

@@ -1,51 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useButtonChecks = void 0;
-const internal_1 = require("@react-native-ama/internal");
-const useChecks_1 = require("./useChecks");
-exports.useButtonChecks = __DEV__
-    ? (props, children, shouldPerformContrastCheck = true) => {
-        const checks = (0, useChecks_1.useChecks)();
-        if (checks === null) {
-            return null;
-        }
-        const { noUndefinedProperty, contrastChecker, onLayout, noUppercaseStringChecker, checkCompatibleAccessibilityState, checkAccessibilityRole, debugStyle, } = checks;
-        let style = props.style || {};
-        const isAccessible = props.accessible !== false;
-        isAccessible &&
-            noUndefinedProperty({
-                properties: props,
-                property: 'accessibilityRole',
-                rule: 'NO_ACCESSIBILITY_ROLE',
-            });
-        isAccessible &&
-            noUndefinedProperty({
-                properties: props,
-                property: 'accessibilityLabel',
-                rule: 'NO_ACCESSIBILITY_LABEL',
-            });
-        isAccessible &&
-            noUppercaseStringChecker({
-                text: props.accessibilityLabel,
-            });
-        checkCompatibleAccessibilityState({
-            accessibilityStates: props === null || props === void 0 ? void 0 : props.accessibilityState,
-            accessibilityRole: props === null || props === void 0 ? void 0 : props.accessibilityRole,
-        });
-        checkAccessibilityRole(props.accessibilityRole);
-        const contrastCheckerCallback = shouldPerformContrastCheck
-            ? contrastChecker
-            : undefined;
-        const theStyle = internal_1.applyStyle === null || internal_1.applyStyle === void 0 ? void 0 : (0, internal_1.applyStyle)({
-            style,
-            debugStyle,
-            // @ts-ignore
-            children,
-            contrastCheckerCallback,
-        });
-        return {
-            onLayout,
-            debugStyle: theStyle,
-        };
-    }
-    : null;

package/dist/src/hooks/useChecks.d.ts

@@ -1,15 +0,0 @@
-import { LogParams, type CheckFocusTrap, type ContrastChecker, type NoUndefinedProperty, type UppercaseChecker, type UppercaseStringChecker } from '@react-native-ama/internal';
-import { AccessibilityRole, LayoutChangeEvent } from 'react-native';
-export declare const useChecks: () => {
-    logResult: (name: string, result: LogParams | LogParams[] | null) => Record<string, any>;
-    noUndefinedProperty: <T>(params: NoUndefinedProperty<T>) => Record<string, any>;
-    contrastChecker: (params: ContrastChecker) => Record<string, any>;
-    onLayout: (event: LayoutChangeEvent) => void;
-    noUppercaseStringChecker: (params: UppercaseStringChecker) => Record<string, any>;
-    uppercaseChecker: (params: UppercaseChecker) => Record<string, any>;
-    checkFocusTrap: (params: CheckFocusTrap) => void;
-    minimumSizeFailed: boolean;
-    checkCompatibleAccessibilityState: (props: Record<string, any>) => void;
-    checkAccessibilityRole: (param: AccessibilityRole) => void;
-    debugStyle: any;
-} | null;

package/dist/src/hooks/useChecks.js

@@ -1,152 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useChecks = void 0;
-const internal_1 = require("@react-native-ama/internal");
-const React = __importStar(require("react"));
-const react_native_1 = require("react-native");
-const AMAProvider_1 = require("../components/AMAProvider");
-const useChecks = () => {
-    const context = (0, AMAProvider_1.useAMAContext)();
-    if (!(0, AMAProvider_1.isDevContextValue)(context)) {
-        return null;
-    }
-    /**
-     * Because the AMA Error view cannot be removed by default, this hacky solution
-     * allows the dev to hide it if all the issues have been solved.
-     */
-    const fakeRandom = React.useRef('' + Date.now() + Math.random() * 42);
-    const hasErrors = React.useRef(false);
-    const failedTests = React.useRef([]);
-    const shouldCheckLayout = React.useRef(true);
-    const layoutCheckTimeout = React.useRef();
-    const [minimumSizeFailed, setMinimumSizeFailed] = React.useState(false);
-    const [debugStyle, setDebugStyle] = React.useState({});
-    const { trackError, removeError } = context;
-    const logResult = (name, result) => {
-        const index = failedTests.current.indexOf(name);
-        if (result === null) {
-            if (index >= 0 && hasErrors.current) {
-                failedTests.current.splice(index);
-                hasErrors.current = false;
-                react_native_1.InteractionManager.runAfterInteractions(() => {
-                    removeError(fakeRandom.current);
-                    setTimeout(() => {
-                        setDebugStyle({});
-                    }, 100);
-                });
-            }
-        }
-        const results = Array.isArray(result) ? result : [result];
-        results.forEach(logParam => {
-            if (logParam === null) {
-                return;
-            }
-            const action = internal_1.getRuleAction === null || internal_1.getRuleAction === void 0 ? void 0 : (0, internal_1.getRuleAction)(logParam.rule);
-            const hasFailed = action === 'MUST_NOT' || action === 'MUST';
-            if (index < 0) {
-                // @ts-ignore
-                internal_1.logFailure === null || internal_1.logFailure === void 0 ? void 0 : (0, internal_1.logFailure)(Object.assign({ action }, logParam));
-            }
-            if (!hasFailed) {
-                return;
-            }
-            else if (index >= 0) {
-                return;
-            }
-            failedTests.current.push(name);
-            react_native_1.InteractionManager.runAfterInteractions(() => {
-                trackError(fakeRandom.current);
-                setDebugStyle(internal_1.ERROR_STYLE);
-            });
-            hasErrors.current = true;
-        });
-        // @ts-ignore
-        return hasErrors.current ? internal_1.ERROR_STYLE : {};
-    };
-    const noUndefinedProperty = (params) => logResult(`noUndefinedProperty ${params.property}`, (0, internal_1.noUndefinedProperty)(params));
-    const contrastChecker = (params) => logResult('contrastChecker', (0, internal_1.contrastChecker)(params));
-    const checkMinimumSize = (params) => {
-        return logResult('checkMinimumSize', (0, internal_1.checkMinimumSize)(params));
-    };
-    const noUppercaseStringChecker = (params) => logResult('accessibilityLabelChecker', (0, internal_1.uppercaseStringChecker)(params));
-    const uppercaseChecker = (params) => logResult('uppercaseChecker', (0, internal_1.uppercaseChecker)(params));
-    const checkFocusTrap = (params) => {
-        (0, internal_1.checkFocusTrap)(params).then(result => {
-            logResult('checkFocusTrap', result);
-        });
-    };
-    const checkAccessibilityRole = (param) => {
-        logResult('checkAccessibilityRole', (0, internal_1.checkAccessibilityRole)(param));
-    };
-    const checkCompatibleAccessibilityState = (props) => {
-        const amaStates = ['checked', 'selected'];
-        const params = {
-            accessibilityRole: props.accessibilityRole,
-            accessibilityState: props === null || props === void 0 ? void 0 : props.accessibilityState,
-        };
-        amaStates.forEach(amaState => {
-            if (amaState in props) {
-                // @ts-ignore
-                params[amaState] = props[amaState];
-            }
-        });
-        logResult('checkCompatibleAccessibilityState', (0, internal_1.checkForAccessibilityState)(params));
-    };
-    const onLayout = (event) => {
-        /**
-         * When the check fails there are situation when adding a border makes the
-         * component meet the minimum size requirement, and this causes a loop as the
-         * state is update continuously between true and false.
-         * To "avoid" that we wait at least 100ms before checking the size again, as
-         * this gives the dev time to hot-reload the changes.
-         */
-        if (!shouldCheckLayout.current) {
-            return;
-        }
-        shouldCheckLayout.current = false;
-        // @ts-ignore
-        clearTimeout(layoutCheckTimeout.current);
-        layoutCheckTimeout.current = setTimeout(() => {
-            shouldCheckLayout.current = true;
-        }, 1000);
-        const result = checkMinimumSize(event);
-        setMinimumSizeFailed(Object.keys(result).length > 0);
-    };
-    return {
-        logResult,
-        noUndefinedProperty,
-        contrastChecker,
-        onLayout,
-        noUppercaseStringChecker,
-        uppercaseChecker,
-        checkFocusTrap,
-        minimumSizeFailed,
-        checkCompatibleAccessibilityState,
-        checkAccessibilityRole,
-        debugStyle,
-    };
-};
-exports.useChecks = useChecks;

package/dist/src/index.js

@@ -1,20 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useTimedAction = exports.useFocus = exports.useChecks = exports.useButtonChecks = exports.HideChildrenFromAccessibilityTree = exports.useAMAContext = exports.AMAProvider = exports.AutofocusContainer = void 0;
-// Components
-var AutofocusContainer_1 = require("./components/AutofocusContainer");
-Object.defineProperty(exports, "AutofocusContainer", { enumerable: true, get: function () { return AutofocusContainer_1.AutofocusContainer; } });
-var AMAProvider_1 = require("./components/AMAProvider");
-Object.defineProperty(exports, "AMAProvider", { enumerable: true, get: function () { return AMAProvider_1.AMAProvider; } });
-Object.defineProperty(exports, "useAMAContext", { enumerable: true, get: function () { return AMAProvider_1.useAMAContext; } });
-var HideChildrenFromAccessibilityTree_1 = require("./components/HideChildrenFromAccessibilityTree");
-Object.defineProperty(exports, "HideChildrenFromAccessibilityTree", { enumerable: true, get: function () { return HideChildrenFromAccessibilityTree_1.HideChildrenFromAccessibilityTree; } });
-// Hooks
-var useButtonChecks_1 = require("./hooks/useButtonChecks");
-Object.defineProperty(exports, "useButtonChecks", { enumerable: true, get: function () { return useButtonChecks_1.useButtonChecks; } });
-var useChecks_1 = require("./hooks/useChecks");
-Object.defineProperty(exports, "useChecks", { enumerable: true, get: function () { return useChecks_1.useChecks; } });
-var useFocus_1 = require("./hooks/useFocus");
-Object.defineProperty(exports, "useFocus", { enumerable: true, get: function () { return useFocus_1.useFocus; } });
-var useTimedAction_1 = require("./hooks/useTimedAction");
-Object.defineProperty(exports, "useTimedAction", { enumerable: true, get: function () { return useTimedAction_1.useTimedAction; } });

package/src/hooks/useButtonChecks.ts

@@ -1,73 +0,0 @@
-import { applyStyle } from '@react-native-ama/internal';
-import type React from 'react';
-import type { PressableStateCallbackType } from 'react-native';
-
-import { useChecks } from './useChecks';
-
-export const useButtonChecks = __DEV__
-  ? (
-      props: Record<string, any>,
-      children?:
-        | React.ReactNode
-        | ((state: PressableStateCallbackType) => React.ReactNode)
-        | undefined,
-      shouldPerformContrastCheck: boolean = true,
-    ) => {
-      const checks = useChecks();
-      if (checks === null) {
-        return null;
-      }
-      const {
-        noUndefinedProperty,
-        contrastChecker,
-        onLayout,
-        noUppercaseStringChecker,
-        checkCompatibleAccessibilityState,
-        checkAccessibilityRole,
-        debugStyle,
-      } = checks;
-
-      let style = props.style || {};
-
-      const isAccessible = props.accessible !== false;
-
-      isAccessible &&
-        noUndefinedProperty({
-          properties: props,
-          property: 'accessibilityRole',
-          rule: 'NO_ACCESSIBILITY_ROLE',
-        });
-      isAccessible &&
-        noUndefinedProperty({
-          properties: props,
-          property: 'accessibilityLabel',
-          rule: 'NO_ACCESSIBILITY_LABEL',
-        });
-      isAccessible &&
-        noUppercaseStringChecker({
-          text: props.accessibilityLabel,
-        });
-      checkCompatibleAccessibilityState({
-        accessibilityStates: props?.accessibilityState,
-        accessibilityRole: props?.accessibilityRole,
-      });
-      checkAccessibilityRole(props.accessibilityRole);
-
-      const contrastCheckerCallback = shouldPerformContrastCheck
-        ? contrastChecker
-        : undefined;
-
-      const theStyle = applyStyle?.({
-        style,
-        debugStyle,
-        // @ts-ignore
-        children,
-        contrastCheckerCallback,
-      });
-
-      return {
-        onLayout,
-        debugStyle: theStyle,
-      };
-    }
-  : null;

package/src/hooks/useChecks.test.ts

@@ -1,214 +0,0 @@
-import { type RuleAction } from '@react-native-ama/internal';
-import * as CheckForAccessibilityRole from '@react-native-ama/internal/src/checks/checkAccessibilityRole';
-import * as CheckForAccessibilityState from '@react-native-ama/internal/src/checks/checkForAccessibilityState';
-import * as Logger from '@react-native-ama/internal/src/utils/logger';
-import { renderHook } from '@testing-library/react-native';
-
-import * as AMAProvider from '../components/AMAProvider';
-import { useChecks } from './useChecks';
-
-const trackError = jest.fn();
-const removeError = jest.fn();
-
-beforeEach(() => {
-  jest.clearAllMocks();
-
-  jest.spyOn(console, 'warn').mockImplementation();
-  jest.spyOn(console, 'error').mockImplementation();
-  jest.spyOn(console, 'info').mockImplementation();
-
-  jest.spyOn(AMAProvider, 'useAMAContext').mockReturnValue({
-    trackError,
-    removeError,
-  } as any);
-});
-
-describe('useChecks', () => {
-  it.each(['MUST_NOT', 'MUST'])(
-    'tracks the error only if the rule is %s',
-    ruleValue => {
-      jest
-        // @ts-ignore
-        .spyOn(Logger, 'getRuleAction')
-        // @ts-ignore
-        .mockReturnValue(ruleValue as RuleAction);
-
-      const { result } = renderHook(() => useChecks());
-
-      result.current?.logResult('test-me', {
-        rule: 'NO_UNDEFINED',
-        extra: 'extra',
-        message: 'message',
-      });
-
-      expect(trackError).toHaveBeenCalledTimes(1);
-      expect(trackError).toHaveBeenCalledWith(expect.any(String));
-    },
-  );
-
-  it.each(['SHOULD', 'SHOULD_NOT'])(
-    'does not track the error if the rule is %s',
-    ruleValue => {
-      const spy = jest.spyOn(console, 'warn');
-
-      jest
-        // @ts-ignore
-        .spyOn(Logger, 'getRuleAction')
-        // @ts-ignore
-        .mockReturnValue(ruleValue as RuleAction);
-
-      const { result } = renderHook(() => useChecks());
-
-      result.current?.logResult('test-me', {
-        rule: 'NO_UNDEFINED',
-        extra: 'extra',
-        message: 'message',
-      });
-
-      expect(trackError).not.toHaveBeenCalled();
-
-      expect(spy).toHaveBeenCalled();
-    },
-  );
-
-  it.each(['MUST_NOT', 'MUST'])(
-    'tracks the same error only once',
-    ruleValue => {
-      jest
-        // @ts-ignore
-        .spyOn(Logger, 'getRuleAction')
-        // @ts-ignore
-        .mockReturnValue(ruleValue as RuleAction);
-
-      const { result } = renderHook(() => useChecks());
-
-      result.current?.logResult('test-me', {
-        rule: 'NO_UNDEFINED',
-        extra: 'extra',
-        message: 'message',
-      });
-
-      expect(trackError).toHaveBeenCalledTimes(1);
-
-      trackError.mockClear();
-
-      result.current?.logResult('test-me', {
-        rule: 'NO_UNDEFINED',
-        extra: 'extra',
-        message: 'message',
-      });
-
-      expect(trackError).toHaveBeenCalledTimes(0);
-    },
-  );
-
-  it('removes the tracked error after has been fixed', () => {
-    // @ts-ignore
-    jest.spyOn(Logger, 'getRuleAction').mockReturnValue('MUST');
-
-    const { result } = renderHook(() => useChecks());
-
-    result.current?.logResult('test-me', {
-      rule: 'NO_UNDEFINED',
-      extra: 'extra',
-      message: 'message',
-    });
-
-    expect(trackError).toHaveBeenCalledWith(expect.any(String));
-
-    result.current?.logResult('test-me', null);
-
-    expect(removeError).toHaveBeenCalledWith(trackError.mock.calls[0][0]);
-  });
-
-  it('checks for compatible accessibility state', () => {
-    const check = jest
-      .spyOn(CheckForAccessibilityState, 'checkForAccessibilityState')
-      .mockReturnValue(null);
-    const { result } = renderHook(() => useChecks());
-
-    result.current?.checkCompatibleAccessibilityState({
-      hello: 'world',
-      busy: true,
-      checked: 'wow',
-      accessibilityRole: 'button',
-    });
-
-    expect(check).toHaveBeenCalledWith({
-      accessibilityRole: 'button',
-      accessibilityState: undefined,
-      checked: 'wow',
-    });
-  });
-
-  it('checks for compatible accessibility state when accessibilityState is passed', () => {
-    const check = jest
-      .spyOn(CheckForAccessibilityState, 'checkForAccessibilityState')
-      .mockReturnValue(null);
-    const { result } = renderHook(() => useChecks());
-
-    result.current?.checkCompatibleAccessibilityState({
-      hello: 'world',
-      checked: false,
-      accessibilityState: {
-        selected: 'yeah',
-      },
-      accessibilityRole: 'button',
-    });
-
-    expect(check).toHaveBeenCalledWith({
-      accessibilityRole: 'button',
-      accessibilityState: {
-        selected: 'yeah',
-      },
-      checked: false,
-    });
-  });
-
-  it('checks for compatible accessibility role', () => {
-    const check = jest
-      .spyOn(CheckForAccessibilityRole, 'checkAccessibilityRole')
-      .mockReturnValue(null);
-    const { result } = renderHook(() => useChecks());
-
-    result.current?.checkAccessibilityRole('button');
-
-    expect(check).toHaveBeenCalledWith('button');
-  });
-});
-
-jest.mock('react-native', () => {
-  const ReactNative = jest.requireActual('react-native');
-
-  // Extend ReactNative
-  return Object.setPrototypeOf(
-    {
-      // Redefine an export, like a component
-      Button: 'Button',
-      // Mock out properties of an already mocked export
-      LayoutAnimation: {
-        ...ReactNative.LayoutAnimation,
-        configureNext: jest.fn(),
-      },
-      Platform: {
-        ...ReactNative.Platform,
-        OS: 'ios',
-        Version: 123,
-        isTesting: true,
-        select: (objs: { ios: any }) => objs.ios,
-      },
-      // Mock a native module
-      NativeModules: {
-        ...ReactNative.NativeModules,
-        Override: { great: 'success' },
-      },
-      InteractionManager: {
-        // @ts-ignore
-        runAfterInteractions: callback => {
-          callback();
-        },
-      },
-    },
-    ReactNative,
-  );
-});