# vue-plugin-test-id

**Repository Path**: qq9694526/vue-plugin-test-id

## Basic Information

- **Project Name**: vue-plugin-test-id
- **Description**: 一个极简的vue plugin，用于给所有vue组件的根节点添加测试id，以降低UI自动化测试场景下编写脚本时获取节点的难度。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-11-01
- **Last Updated**: 2024-11-01

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

vue-plugin-test-id

一个极简的vue plugin，用于给所有vue组件的根节点添加测试id，以降低UI自动化测试场景下编写脚本时获取节点的难度。

# 安装

```
yarn add vue-plugin-test-id
```

# 使用

1. 添加测试环境的构建命令
   
   ```json
   // package.json
   {
       "scripts": {
           "build:test": "VUE_APP_BUILD_TARGET=test npm run build",
       }
   }
   ```

2. 在应用中有条件的注册插件
   
   ```js
   // src/main.js
   import testIdPlugin from "vue-plugin-test-id";
   
   if(process.env.VUE_APP_BUILD_TARGET === "test"){
     Vue.use(testIdPlugin)
   }
   ```

3. 构建测试环境包
   
   ```bash
   npm run build:test
   ```

# API

## options.attrName

自定义插入节点的属性名称，默认值：data-test-id

```js
Vue.use(testIdPlugin,{
   attrName: 'my-test-id'
})
```