Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: e2e test & CI integration #2740

Merged
merged 38 commits into from
Dec 11, 2024
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
38 commits
Select commit Hold shift + click to select a range
6a16d1f
chore: cupress
Alex-huxiyang Nov 11, 2024
99c005f
chore: cypress ci
Alex-huxiyang Nov 12, 2024
140b31e
chore: update
Alex-huxiyang Nov 12, 2024
8d3f08e
chore: update
Alex-huxiyang Nov 12, 2024
8beff5c
fix: install
Alex-huxiyang Nov 12, 2024
22cc2fe
fix: install
Alex-huxiyang Nov 12, 2024
7fe0719
chore: update
Alex-huxiyang Nov 12, 2024
2524793
chore: update
Alex-huxiyang Nov 12, 2024
75d817a
chore: update
Alex-huxiyang Nov 12, 2024
23661fa
chore: update
Alex-huxiyang Nov 12, 2024
69268e6
chore: update
Alex-huxiyang Nov 12, 2024
2b051dd
chore: update
Alex-huxiyang Nov 12, 2024
c89278d
chore: update
Alex-huxiyang Nov 12, 2024
d860276
chore: update
Alex-huxiyang Nov 12, 2024
efc90b7
chore: update
Alex-huxiyang Nov 12, 2024
e821c24
chore: update
Alex-huxiyang Nov 12, 2024
d71669d
chore: update
Alex-huxiyang Nov 13, 2024
eeefcbc
chore: update
Alex-huxiyang Nov 13, 2024
515a12b
chore: update
Alex-huxiyang Nov 13, 2024
16f267c
chore: update
Alex-huxiyang Nov 13, 2024
1a392de
fix: revert commit log
Alex-huxiyang Dec 5, 2024
9a07d69
fix: resolve conflicts with v3
Alex-huxiyang Dec 5, 2024
ab38f06
fix: ci failed
Alex-huxiyang Dec 5, 2024
7db2f3c
fix: ci no reaction
Alex-huxiyang Dec 5, 2024
9939b3b
fix: save content
Alex-huxiyang Dec 6, 2024
0498272
fix: update lock file to resolve conflicts
Alex-huxiyang Dec 10, 2024
d3f4658
Merge branch 'feat_v3.x' into hxy/cypress/ci-1111
Alex-huxiyang Dec 10, 2024
b8bfcfa
fix: update lock file to resolve conflicts
Alex-huxiyang Dec 10, 2024
75f4799
refactor: cypress directory common and utils test method
Alex-huxiyang Dec 10, 2024
cd07550
refactor: cypress directory common and utils test method
Alex-huxiyang Dec 10, 2024
aa13e8b
refactor: cypress directory common and utils test method
Alex-huxiyang Dec 10, 2024
88a4c6e
fix: re
Alex-huxiyang Dec 11, 2024
650fe55
fix: re
Alex-huxiyang Dec 11, 2024
d4fc196
fix: resolve conflicts
Alex-huxiyang Dec 11, 2024
e221ea8
fix: resolve conflicts
Alex-huxiyang Dec 11, 2024
4ff94e2
Merge branch 'feat_v3.x' into hxy/cypress/ci-1111
Alex-huxiyang Dec 11, 2024
4931cba
fix: resolve conflicts
Alex-huxiyang Dec 11, 2024
912f64a
fix: resolve conflicts
Alex-huxiyang Dec 11, 2024
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -106,4 +106,4 @@ jobs:
uses: actions-ecosystem/action-add-labels@v1
with:
github_token: ${{ secrets.GITHUB_TOKEN }}
labels: ${{ env.label }}
labels: ${{ env.label }}
37 changes: 37 additions & 0 deletions .github/workflows/cypress.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
name: E2E Tests

on:
push:
branches:
- V3.0
pull_request:
branches:
- V3.0

jobs:
test:
runs-on: ubuntu-latest

steps:
- uses: actions/checkout@v4

- name: Install pnpm
run: corepack enable pnpm

- uses: actions/setup-node@v4
with:
node-version: '20'
cache: 'pnpm'

- name: Install dependencies
run: pnpm install

- name: Run E2E Tests for H5
env:
CI: true
run: pnpm e2e:h5:run

- name: Run E2E Tests for Taro
env:
CI: true
run: pnpm e2e:taro:run
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

建议增强测试执行和报告机制

当前的测试执行配置可以通过以下方式增强:

  1. 添加测试结果存档
  2. 集成测试报告
  3. 配置失败重试机制

建议添加以下步骤:

 - name: Run E2E Tests for H5
   env:
     CI: true
-  run: pnpm e2e:h5:run
+  run: pnpm e2e:h5:run --reporter junit || pnpm e2e:h5:run --reporter junit
+  continue-on-error: true

+- name: Upload H5 Test Results
+  if: always()
+  uses: actions/upload-artifact@v3
+  with:
+    name: h5-test-results
+    path: cypress/results/h5/*.xml

 - name: Run E2E Tests for Taro
   env:
     CI: true
-  run: pnpm e2e:taro:run
+  run: pnpm e2e:taro:run --reporter junit || pnpm e2e:taro:run --reporter junit
+  continue-on-error: true

+- name: Upload Taro Test Results
+  if: always()
+  uses: actions/upload-artifact@v3
+  with:
+    name: taro-test-results
+    path: cypress/results/taro/*.xml

+- name: Publish Test Results
+  uses: EnricoMi/publish-unit-test-result-action@v2
+  if: always()
+  with:
+    files: "cypress/results/**/*.xml"
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
- name: Run E2E Tests for H5
env:
CI: true
run: pnpm e2e:h5:run
- name: Run E2E Tests for Taro
env:
CI: true
run: pnpm e2e:taro:run
- name: Run E2E Tests for H5
env:
CI: true
run: pnpm e2e:h5:run --reporter junit || pnpm e2e:h5:run --reporter junit
continue-on-error: true
- name: Upload H5 Test Results
if: always()
uses: actions/upload-artifact@v3
with:
name: h5-test-results
path: cypress/results/h5/*.xml
- name: Run E2E Tests for Taro
env:
CI: true
run: pnpm e2e:taro:run --reporter junit || pnpm e2e:taro:run --reporter junit
continue-on-error: true
- name: Upload Taro Test Results
if: always()
uses: actions/upload-artifact@v3
with:
name: taro-test-results
path: cypress/results/taro/*.xml
- name: Publish Test Results
uses: EnricoMi/publish-unit-test-result-action@v2
if: always()
with:
files: "cypress/results/**/*.xml"

3 changes: 1 addition & 2 deletions cypress.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@ import { defineConfig } from 'cypress'

export default defineConfig({
e2e: {
baseUrl: 'http://localhost:10086/#/',
specPattern: 'cypress/e2e/**/*.js',
specPattern: 'cypress/e2e/**/*.{js,jsx,ts,tsx}',
},
viewportWidth: 414,
viewportHeight: 896,
Expand Down
67 changes: 0 additions & 67 deletions cypress/component/Actionsheet.cy.jsx

This file was deleted.

6 changes: 0 additions & 6 deletions cypress/component/Button.cy.jsx

This file was deleted.

37 changes: 0 additions & 37 deletions cypress/component/Cell.cy.jsx

This file was deleted.

13 changes: 13 additions & 0 deletions cypress/e2e/h5/base.cy.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
import { componentTest } from './utils'

describe('base components test', () => {
componentTest('Button', () => {})
componentTest('Cell', () => {})
componentTest('ConfigProvider', () => {})
componentTest('Icon', () => {})
componentTest('Image', () => {})
componentTest('Overlay', () => {})
})
Alex-huxiyang marked this conversation as resolved.
Show resolved Hide resolved
Cypress.on('uncaught:exception', (err, runnable) => {
return false
})
Alex-huxiyang marked this conversation as resolved.
Show resolved Hide resolved
10 changes: 10 additions & 0 deletions cypress/e2e/h5/bussiness.cy.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import { componentTest } from './utils'

describe('bussiness components test', () => {
componentTest('Barrage', () => {})
componentTest('Card', () => {})
componentTest('TimeSelect', () => {})
componentTest('TrendArrow', () => {})
componentTest('WaterMark', () => {})
componentTest('AvatarCropper', () => {})
Alex-huxiyang marked this conversation as resolved.
Show resolved Hide resolved
})
25 changes: 25 additions & 0 deletions cypress/e2e/h5/dentry.cy.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import { componentTest } from './utils'

describe('dentry components test', () => {
componentTest('Address', () => {})
componentTest('Calendar', () => {})
componentTest('CalendarCard', () => {})
componentTest('Cascader', () => {})
componentTest('Checkbox', () => {})
componentTest('DatePicker', () => {})
componentTest('Form', () => {})
componentTest('Input', () => {})
componentTest('InputNumber', () => {})
componentTest('Menu', () => {})
componentTest('NumberKeyboard', () => {})
componentTest('Picker', () => {})
componentTest('Radio', () => {})
componentTest('Range', () => {})
componentTest('Rate', () => {})
componentTest('SearchBar', () => {})
componentTest('ShortPassword', () => {})
componentTest('Signature', () => {})
componentTest('Switch', () => {})
componentTest('TextArea', () => {})
componentTest('Uploader', () => {})
})
Alex-huxiyang marked this conversation as resolved.
Show resolved Hide resolved
23 changes: 23 additions & 0 deletions cypress/e2e/h5/exhibition.cy.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import { componentTest } from './utils'

describe('exhibition components test', () => {
Alex-huxiyang marked this conversation as resolved.
Show resolved Hide resolved
componentTest('Animate', () => {})
componentTest('AnimatingNumbers', () => {})
componentTest('Audio', () => {})
componentTest('Avatar', () => {})
componentTest('CircleProgress', () => {})
componentTest('Collapse', () => {})
componentTest('CountDown', () => {})
componentTest('Ellipsis', () => {})
componentTest('ImagePreview', () => {})
componentTest('Indicator', () => {})
componentTest('Pagination', () => {})
componentTest('Price', () => {})
componentTest('Progress', () => {})
componentTest('Swiper', () => {})
componentTest('Table', () => {})
componentTest('Tag', () => {})
componentTest('Tour', () => {})
componentTest('Video', () => {})
componentTest('VirtualList', () => {})
Alex-huxiyang marked this conversation as resolved.
Show resolved Hide resolved
})
20 changes: 20 additions & 0 deletions cypress/e2e/h5/feedback.cy.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import { componentTest } from './utils'

describe('feedback components test', () => {
componentTest('ActionSheet', () => {})
componentTest('Badge', () => {})
componentTest('Dialog', () => {})
componentTest('Drag', () => {})
componentTest('Empty', () => {})
componentTest('ResultPage', () => {})
componentTest('InfiniteLoading', () => {})
componentTest('Loading', () => {})
componentTest('NoticeBar', () => {})
componentTest('Notify', () => {})
componentTest('Popover', () => {})
componentTest('Popup', () => {})
componentTest('PullToRefresh', () => {})
componentTest('Skeleton', () => {})
componentTest('Swipe', () => {})
componentTest('Toast', () => {})
})
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

测试用例缺少具体实现

当前所有组件的测试用例都是空实现,这可能会导致测试覆盖率不足。建议为每个组件添加以下测试项:

  • 组件渲染验证
  • 组件交互测试
  • 组件事件处理
  • 组件状态变化
  • 边界条件测试

我可以协助您生成具体的测试用例实现。以下是一个示例实现:

componentTest('Dialog', () => {
  it('应该正确渲染对话框', () => {
    cy.get('.nut-dialog').should('not.exist')
    cy.get('.dialog-btn').click()
    cy.get('.nut-dialog').should('be.visible')
  })

  it('应该响应确认和取消操作', () => {
    cy.get('.dialog-btn').click()
    cy.get('.nut-dialog__footer').contains('确定').click()
    cy.get('.nut-dialog').should('not.exist')
  })
})

需要我为其他组件也生成类似的测试用例实现吗?

11 changes: 11 additions & 0 deletions cypress/e2e/h5/index.cy.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import './base.cy'
import './layout.cy'
import './nav.cy'
import './dentry.cy'
import './bussiness.cy'
import './exhibition.cy'
import './feedback.cy'

Cypress.on('uncaught:exception', (err, runnable) => {
return false
})
Alex-huxiyang marked this conversation as resolved.
Show resolved Hide resolved
10 changes: 10 additions & 0 deletions cypress/e2e/h5/layout.cy.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import { componentTest } from './utils'

describe('layout components test', () => {
componentTest('Divider', () => {})
componentTest('Grid', () => {})
componentTest('Layout', () => {})
componentTest('Space', () => {})
componentTest('Sticky', () => {})
componentTest('SafeArea', () => {})
Alex-huxiyang marked this conversation as resolved.
Show resolved Hide resolved
})
12 changes: 12 additions & 0 deletions cypress/e2e/h5/nav.cy.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import { componentTest } from './utils'

describe('nav components test', () => {
componentTest('BackTop', () => {})
componentTest('Elevator', () => {})
componentTest('FixedNav', () => {})
componentTest('HoverButton', () => {})
componentTest('NavBar', () => {})
componentTest('SideNavBar', () => {})
componentTest('Tabbar', () => {})
componentTest('Tabs', () => {})
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

需要实现具体的测试用例

当前所有导航组件的测试用例都是空的,建议为每个组件添加以下测试内容:

  • 组件渲染验证
  • 交互功能测试
  • 边界条件处理
  • 响应式布局验证

以下是优先级较高的测试场景:

  1. BackTop: 滚动触发、显示隐藏逻辑
  2. NavBar: 导航项点击、活动状态
  3. Tabs: 标签切换、内容更新
  4. FixedNav: 固定定位、展开收起

需要我为这些组件生成具体的测试用例代码吗?

})
17 changes: 17 additions & 0 deletions cypress/e2e/h5/utils.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
export const componentTest = (comName, fn, delay = 800) => {
const getPath = (component) => `${Cypress.env('baseUrl')}${component}`

it(`${comName} successfully passes`, () => {
cy.visit(getPath(comName), {
onBeforeLoad: (win) => {
Object.defineProperty(win.navigator, 'userAgent', {
value:
'Mozilla/5.0 (iPhone; CPU iPhone OS 10_3 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) Version/10.0 Mobile/14E5239e Safari/602.1',
})
},
})
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

建议改进用户代理模拟方式

当前的实现存在以下问题:

  1. 硬编码的 User Agent 字符串可能会过时
  2. 缺少不同设备的测试支持

建议实现一个可配置的设备模拟方案:

+const DEVICE_AGENTS = {
+  iPhone: 'Mozilla/5.0 (iPhone; CPU iPhone OS 10_3 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) Version/10.0 Mobile/14E5239e Safari/602.1',
+  iPad: 'Mozilla/5.0 (iPad; CPU OS 11_0 like Mac OS X) AppleWebKit/604.1.34 (KHTML, like Gecko) Version/11.0 Mobile/15A5341f Safari/604.1',
+  Android: 'Mozilla/5.0 (Linux; Android 8.0.0;) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.132 Mobile Safari/537.36'
+};
+
+export const componentTest = (comName, fn, { delay = 800, device = 'iPhone' } = {}) => {
   it(`${comName} successfully passes`, () => {
     cy.visit(getPath(comName), {
       onBeforeLoad: (win) => {
         Object.defineProperty(win.navigator, 'userAgent', {
-          value: 'Mozilla/5.0 (iPhone; CPU iPhone OS 10_3 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) Version/10.0 Mobile/14E5239e Safari/602.1',
+          value: DEVICE_AGENTS[device]
         })
       },
     })

Committable suggestion skipped: line range outside the PR's diff.

cy.get('#nav').contains(comName)
cy.wait(delay)
fn()
})
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

建议增强测试流程的稳定性

当前实现存在以下问题:

  1. 固定延时可能导致测试不稳定
  2. 缺少错误处理机制
  3. 对 DOM 元素的存在性假设过于绝对

建议添加更多的错误处理和重试机制:

-    cy.get('#nav').contains(comName)
-    cy.wait(delay)
-    fn()
+    cy.get('#nav', { timeout: 10000 })
+      .should('exist')
+      .contains(comName)
+      .should('be.visible')
+    
+    // 等待页面加载完成
+    cy.document().then((doc) => {
+      return new Cypress.Promise((resolve) => {
+        if (doc.readyState === 'complete') {
+          resolve()
+        } else {
+          doc.addEventListener('load', resolve)
+        }
+      })
+    })
+    
+    // 执行测试函数
+    cy.wrap(null).then(() => fn())
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
cy.get('#nav').contains(comName)
cy.wait(delay)
fn()
})
cy.get('#nav', { timeout: 10000 })
.should('exist')
.contains(comName)
.should('be.visible')
// 等待页面加载完成
cy.document().then((doc) => {
return new Cypress.Promise((resolve) => {
if (doc.readyState === 'complete') {
resolve()
} else {
doc.addEventListener('load', resolve)
}
})
})
// 执行测试函数
cy.wrap(null).then(() => fn())
})

}
8 changes: 0 additions & 8 deletions cypress/e2e/index.cy.js

This file was deleted.

Loading
Loading