@xosen/vuetify-grid 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.test.md +133 -0
- package/dist/index.cjs +4 -4
- package/dist/index.d.ts +46 -46
- package/dist/index.mjs +5186 -4917
- package/dist/vuetify-grid.css +1 -1
- package/package.json +9 -1
- package/dist/packages/vuetify-grid/tsconfig.tsbuildinfo +0 -1
package/README.test.md
ADDED
|
@@ -0,0 +1,133 @@
|
|
|
1
|
+
# Test Documentation
|
|
2
|
+
|
|
3
|
+
## Overview
|
|
4
|
+
|
|
5
|
+
The vuetify-grid package includes comprehensive unit tests for all composables using Vitest and Vue Test Utils.
|
|
6
|
+
|
|
7
|
+
## Test Coverage
|
|
8
|
+
|
|
9
|
+
### Composables
|
|
10
|
+
|
|
11
|
+
#### useCrudGrid (18 tests)
|
|
12
|
+
Tests for CRUD operations, pagination, search, filtering, and sorting:
|
|
13
|
+
- ✅ Initialization with defaults and custom options
|
|
14
|
+
- ✅ Data loading (success and error handling)
|
|
15
|
+
- ✅ Pagination (page count calculation, page reset on limit change)
|
|
16
|
+
- ✅ Search (page reset, search params)
|
|
17
|
+
- ✅ Filtering (page reset, filter params spreading)
|
|
18
|
+
- ✅ Sorting (ascending/descending, sort params)
|
|
19
|
+
- ✅ Reload and goToFirstPageAndLoad methods
|
|
20
|
+
|
|
21
|
+
#### useActions (21 tests)
|
|
22
|
+
Tests for action management and execution:
|
|
23
|
+
- ✅ Parameter resolution (getParam with functions and values)
|
|
24
|
+
- ✅ Action click handling (success, errors, loading states)
|
|
25
|
+
- ✅ Action visibility (boolean and function-based)
|
|
26
|
+
- ✅ Action disabled state (boolean and function-based)
|
|
27
|
+
- ✅ Action text generation (static and dynamic)
|
|
28
|
+
- ✅ Default handlers and error callbacks
|
|
29
|
+
|
|
30
|
+
#### useSearch (16 tests)
|
|
31
|
+
Tests for search functionality:
|
|
32
|
+
- ✅ Initialization (empty and with initial value)
|
|
33
|
+
- ✅ Search model changes and emit
|
|
34
|
+
- ✅ External prop changes
|
|
35
|
+
- ✅ Clear search functionality
|
|
36
|
+
- ✅ Show/hide search mode
|
|
37
|
+
- ✅ Search field ref management and focus
|
|
38
|
+
|
|
39
|
+
## Running Tests
|
|
40
|
+
|
|
41
|
+
```bash
|
|
42
|
+
# Run all tests
|
|
43
|
+
pnpm test
|
|
44
|
+
|
|
45
|
+
# Run tests in watch mode
|
|
46
|
+
pnpm test:watch
|
|
47
|
+
|
|
48
|
+
# Run tests with UI
|
|
49
|
+
pnpm test:ui
|
|
50
|
+
|
|
51
|
+
# Run tests with coverage
|
|
52
|
+
pnpm test:coverage
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
## Test Structure
|
|
56
|
+
|
|
57
|
+
```
|
|
58
|
+
src/
|
|
59
|
+
├── composables/
|
|
60
|
+
│ ├── __tests__/
|
|
61
|
+
│ │ ├── useCrudGrid.spec.ts
|
|
62
|
+
│ │ ├── useActions.spec.ts
|
|
63
|
+
│ │ └── useSearch.spec.ts
|
|
64
|
+
│ ├── useCrudGrid.ts
|
|
65
|
+
│ ├── useActions.ts
|
|
66
|
+
│ └── useSearch.ts
|
|
67
|
+
└── test-setup.ts
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
## Test Setup
|
|
71
|
+
|
|
72
|
+
The tests use:
|
|
73
|
+
- **Vitest** - Fast unit test framework
|
|
74
|
+
- **@vue/test-utils** - Official Vue testing utilities
|
|
75
|
+
- **happy-dom** - Lightweight DOM implementation
|
|
76
|
+
- **Mock functions** - For testing callbacks and async operations
|
|
77
|
+
|
|
78
|
+
### Global Test Setup
|
|
79
|
+
|
|
80
|
+
The `test-setup.ts` file provides:
|
|
81
|
+
- ResizeObserver mock
|
|
82
|
+
- IntersectionObserver mock
|
|
83
|
+
- Other DOM API mocks for happy-dom compatibility
|
|
84
|
+
|
|
85
|
+
## Writing New Tests
|
|
86
|
+
|
|
87
|
+
When adding new composables or features:
|
|
88
|
+
|
|
89
|
+
1. Create a new spec file in `src/composables/__tests__/`
|
|
90
|
+
2. Follow the existing test structure
|
|
91
|
+
3. Test all public methods and state changes
|
|
92
|
+
4. Mock external dependencies
|
|
93
|
+
5. Test error cases and edge cases
|
|
94
|
+
|
|
95
|
+
### Example Test Structure
|
|
96
|
+
|
|
97
|
+
```typescript
|
|
98
|
+
import { describe, it, expect, beforeEach, vi } from 'vitest';
|
|
99
|
+
import { useMyComposable } from '../useMyComposable';
|
|
100
|
+
|
|
101
|
+
describe('useMyComposable', () => {
|
|
102
|
+
beforeEach(() => {
|
|
103
|
+
vi.clearAllMocks();
|
|
104
|
+
});
|
|
105
|
+
|
|
106
|
+
describe('feature group', () => {
|
|
107
|
+
it('should do something', () => {
|
|
108
|
+
const { method } = useMyComposable();
|
|
109
|
+
|
|
110
|
+
method();
|
|
111
|
+
|
|
112
|
+
expect(something).toBe(expected);
|
|
113
|
+
});
|
|
114
|
+
});
|
|
115
|
+
});
|
|
116
|
+
```
|
|
117
|
+
|
|
118
|
+
## CI/CD Integration
|
|
119
|
+
|
|
120
|
+
Tests run automatically on:
|
|
121
|
+
- Pre-commit hooks
|
|
122
|
+
- Pull request checks
|
|
123
|
+
- CI/CD pipelines
|
|
124
|
+
|
|
125
|
+
All tests must pass before merging to main branch.
|
|
126
|
+
|
|
127
|
+
## Test Results
|
|
128
|
+
|
|
129
|
+
Current test status:
|
|
130
|
+
- ✅ **55 tests passing**
|
|
131
|
+
- ✅ **3 test files**
|
|
132
|
+
- ✅ **All composables covered**
|
|
133
|
+
- ⏱️ **~489ms execution time**
|