# @etchteam/storybook-addon-a11y-interaction-tests 中文文档

规范地址：https://npmcn.com/package/%40etchteam/storybook-addon-a11y-interaction-tests/

版本：2\.0\.1
npm 元数据更新时间：2026-02-16T12:30:20.806Z
中文译文更新时间：2026-11-13T23:14:37.672Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40etchteam/storybook-addon-a11y-interaction-tests
原文对照：https://npmcn.com/package/%40etchteam/storybook-addon-a11y-interaction-tests/?lang=original
项目主页：https://github.com/etchteam/storybook-addon-a11y-interaction-tests#readme
源码仓库：https://github.com/etchteam/storybook-addon-a11y-interaction-tests

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：152 kB，95 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：3 个
- 首次发布：2025-04-01T10:06:39.595Z
- 最新版本发布：2026-02-16T12:30:20.477Z
- 近 30 天下载量：3100（2026-10-14 至 2026-11-12，npm 官方下载统计）
- 已发布版本数：14（近 12 个月 1 个）

## 中文简介

用于无障碍互动测试的故事手册附加

## 安装

```sh
npm install @etchteam/storybook-addon-a11y-interaction-tests
```

也可以使用：`pnpm add @etchteam/storybook-addon-a11y-interaction-tests`、`yarn add @etchteam/storybook-addon-a11y-interaction-tests`、`bun add @etchteam/storybook-addon-a11y-interaction-tests`

## README

# 故事书 A11y 交互测试

用于常见UI图案的可再用可访问性交互测试的集合,可以被用到Storybook的测试跑道游戏功能中.

## 安装

```bash
npm install --save-dev @etchteam/storybook-addon-a11y-interaction-tests
# or
yarn add -D @etchteam/storybook-addon-a11y-interaction-tests
```

## 使用量

此附加提供了一组可重复使用的可访问性交互测试,您可以在您的"故事本"故事的游戏功能中使用. 测试跟随 [W3C ARIA 设计模式](https://www.w3.org/WAI/ARIA/apg/patterns/) 并测试 ARIA 恰当的角色,状态,属性,和键盘交互.

### 示例使用

```tsx
import type { Meta, StoryObj } from '@storybook/react';
import { expect, userEvent } from '../utils/test-utils';
import { a11yButton } from '@etchteam/storybook-addon-a11y-interaction-tests';

import { Button } from './Button';

const meta: Meta<typeof Button> = {
  component: Button,
  argTypes: {
    // ... your argTypes
  },
};

export default meta;
type Story = StoryObj<typeof Button>;

export const Primary: Story = {
  args: {
    label: 'Button',
    primary: true,
  },
  play: async ({ canvasElement, step }) => {
    // Run the a11y button tests
    await a11yButton({
      step,
      canvasElement,
      isDisabled: false,
      isToggle: false,
    });
    
    // Add any additional tests specific to your button component
  },
};

export const Disabled: Story = {
  args: {
    label: 'Disabled Button',
    disabled: true,
  },
  play: async ({ canvasElement, step }) => {
    await a11yButton({
      step,
      canvasElement,
      isDisabled: true,
    });
  },
};
```

### 使用多测试模式

您可以对组合模式的组件使用多重无障碍测试:

```tsx
import { a11yButton, a11yDisclosure } from '@etchteam/storybook-addon-a11y-interaction-tests';

// ...

export const DisclosureButton: Story = {
  args: {
    // ...
  },
  play: async ({ canvasElement, step }) => {
    // Test both button and disclosure aspects
    await a11yButton({ step, canvasElement });
    await a11yDisclosure({ step, canvasElement });
  },
};
```

### 可用测试

此加法包括对下列ARIA模式的测试:

-   `a11yAccordion` - 手风琴部件试验
-   `a11yAlert` - 警报组件测试
-   `a11yAlertDialog` - 警报对话框组件测试
-   `a11yButton` - 按钮组件测试
-   `a11yCarousel` - 旋转木马部件试验
-   `a11yCheckbox` - 复选框组件测试
-   `a11yCombobox` - 组合框组件测试
-   `a11yDisclosure` - 披露内容测试
-   `a11yLink` - 测试链接组件
-   `a11yModal` - 模式对话框组件测试
-   `a11yRadio` - 无线电按钮组件测试
-   `a11ySwitch` - 测试开关组件
-   `a11yTable` - 表格组件测试
-   `a11yTabs` - 标签组件测试

每个测试函数接受该组件类型的特定参数.

## 许可证

麻省理工学院

## 常见问题

### @etchteam/storybook-addon-a11y-interaction-tests 是什么？

用于无障碍互动测试的故事手册附加

### 如何安装 @etchteam/storybook-addon-a11y-interaction-tests？

在项目目录运行 npm install @etchteam/storybook-addon-a11y-interaction-tests，或使用 pnpm add / yarn add / bun add。

### @etchteam/storybook-addon-a11y-interaction-tests 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @etchteam/storybook-addon-a11y-interaction-tests 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @etchteam/storybook-addon-a11y-interaction-tests 可以商用吗？

@etchteam/storybook-addon-a11y-interaction-tests 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @etchteam/storybook-addon-a11y-interaction-tests 的下载量有多少？

根据 npm 官方下载统计，@etchteam/storybook-addon-a11y-interaction-tests 在 2026/10/14 – 2026/11/12 这 30 天内被下载 3,100 次，日均约 103 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @etchteam/storybook-addon-a11y-interaction-tests 还在维护吗？

最新版本 2\.0\.1 发布于 2026/02/16（8 个月前）；至今共发布 14 个版本，其中过去 12 个月发布了 1 个；首次发布于 2025/04/01。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。