Configuration and Parameters

interface A11yParameters {
  /**
   * Context parameter for axe-core's run function, except without support for passing Nodes and
   * NodeLists directly.
   *
   * @see https://github.com/dequelabs/axe-core/blob/develop/doc/context.md
   */
  context?: ContextSpecWithoutNode;
  /**
   * Options for running axe-core.
   *
   * @see https://github.com/dequelabs/axe-core/blob/develop/doc/API.md#options-parameter
   */
  options?: RunOptions;
  /**
   * Configuration object for axe-core.
   *
   * @see https://github.com/dequelabs/axe-core/blob/develop/doc/API.md#api-name-axeconfigure
   */
  config?: Spec;
  /** Whether to disable accessibility tests. */
  disable?: boolean;
  /** Defines how accessibility violations should be handled: 'off', 'todo', or 'error'. */
  test?: A11yTest;
}

type A11yTest = 'off' | 'todo' | 'error';

// Basic story configuration
export const BasicButton: Story = {
  parameters: {
    a11y: {
      // Disable testing for this story
      disable: true
    }
  }
};

// Configure test mode
export const ButtonWithTodoTests: Story = {
  parameters: {
    a11y: {
      // Show violations as warnings instead of errors
      test: 'todo'
    }
  }
};

// Configure axe-core options
export const ButtonWithCustomRules: Story = {
  parameters: {
    a11y: {
      options: {
        rules: {
          'color-contrast': { enabled: true },
          'button-name': { enabled: true },
          'aria-allowed-attr': { enabled: false }
        }
      }
    }
  }
};

interface A11yGlobals {
  /**
   * Accessibility configuration
   *
   * @see https://storybook.js.org/docs/writing-tests/accessibility-testing
   */
  a11y?: {
    /**
     * Prevent the addon from executing automated accessibility checks upon visiting a story. You
     * can still trigger the checks from the addon panel.
     *
     * @see https://storybook.js.org/docs/writing-tests/accessibility-testing#turn-off-automated-a11y-tests
     */
    manual?: boolean;
  };
}

// .storybook/preview.ts
export const globals = {
  a11y: {
    // Disable automatic testing, require manual trigger
    manual: true
  }
};

type SelectorWithoutNode = Omit<Selector, 'Node'> | Omit<SelectorList, 'NodeList'>;

type ContextObjectWithoutNode =
  | {
      include: SelectorWithoutNode;
      exclude?: SelectorWithoutNode;
    }
  | {
      exclude: SelectorWithoutNode;
      include?: SelectorWithoutNode;
    };

type ContextSpecWithoutNode = SelectorWithoutNode | ContextObjectWithoutNode;

// Include only specific elements
export const FormStory: Story = {
  parameters: {
    a11y: {
      context: {
        include: ['.form-container', '#main-form']
      }
    }
  }
};

// Exclude decorative elements
export const LayoutStory: Story = {
  parameters: {
    a11y: {
      context: {
        exclude: ['.decorative-bg', '.visual-flourish']
      }
    }
  }
};

// Complex context configuration
export const ComponentStory: Story = {
  parameters: {
    a11y: {
      context: {
        include: ['.component-root'],
        exclude: ['.component-root .debug-panel']
      }
    }
  }
};

const initialGlobals = {
  a11y: {
    manual: false,
  },
};

const parameters = {
  a11y: {
    test: 'todo',
  } as A11yParameters,
};

// .storybook/preview.ts
// Option 1: Import from preview entry point
import { initialGlobals, parameters } from '@storybook/addon-a11y/preview';

// Option 2: Import from main entry point (re-exported)
import { initialGlobals, parameters } from '@storybook/addon-a11y';

export { initialGlobals, parameters };

// Or customize defaults
export const globals = {
  ...initialGlobals,
  a11y: {
    manual: true // Override default
  }
};

export const parameters = {
  ...parameters,
  a11y: {
    test: 'error', // Override default test mode
    options: {
      // Add global axe-core options
      rules: {
        'region': { enabled: false } // Disable region rule globally
      }
    }
  }
};

const PARAM_KEY = 'a11y';
const ADDON_ID = 'storybook/a11y';
const PANEL_ID = 'storybook/a11y/panel';
const TEST_PROVIDER_ID = 'storybook/addon-a11y/test-provider';

// Event constants for internal communication (not exported)
// const EVENTS = {
//   RESULT: 'storybook/a11y/result',
//   REQUEST: 'storybook/a11y/request', 
//   RUNNING: 'storybook/a11y/running',
//   ERROR: 'storybook/a11y/error',
//   MANUAL: 'storybook/a11y/manual',
//   SELECT: 'storybook/a11y/select'
// };

// Internal documentation constants (not exported)
const DOCUMENTATION_LINK = 'writing-tests/accessibility-testing';
const DOCUMENTATION_DISCREPANCY_LINK = 'writing-tests/accessibility-testing#why-are-my-tests-failing-in-different-environments';