quickpickle 1.2.3 → 1.2.4
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/package.json +4 -1
- package/README.md +0 -216
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "quickpickle",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.4",
|
|
4
4
|
"description": "Plugin for Vitest to run tests written in Gherkin Syntax.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"BDD",
|
|
@@ -61,6 +61,9 @@
|
|
|
61
61
|
"typescript": "^5.6.2",
|
|
62
62
|
"vitest": "^2.1.2"
|
|
63
63
|
},
|
|
64
|
+
"peerDependencies": {
|
|
65
|
+
"vitest": "^1.0.0 || >=2.0.0"
|
|
66
|
+
},
|
|
64
67
|
"repository": {
|
|
65
68
|
"type": "git",
|
|
66
69
|
"url": "https://github.com/dnotes/quickpickle.git"
|
package/README.md
DELETED
|
@@ -1,216 +0,0 @@
|
|
|
1
|
-
# QuickPickle
|
|
2
|
-
|
|
3
|
-
QuickPickle is a plugin for [Vitest] to run tests written in [Gherkin Syntax].
|
|
4
|
-
It seamlessly integrates Gherkin Feature files into your Vitest testing workflow
|
|
5
|
-
by parsing them with the official [Gherkin Parser] and running them as Vitest tests.
|
|
6
|
-
|
|
7
|
-
## Features
|
|
8
|
-
|
|
9
|
-
- Seamless integration of Gherkin Feature files into Vitest testing workflow
|
|
10
|
-
- Parses Gherkin Feature files using the official [Gherkin Parser]
|
|
11
|
-
- Full typescript and javascript support (because it's really just Vitest)
|
|
12
|
-
- Full support for Gherkin 6 Syntax
|
|
13
|
-
|
|
14
|
-
### Benefits of Gherkin
|
|
15
|
-
|
|
16
|
-
- Write tests in plain English (or your team's language)
|
|
17
|
-
|
|
18
|
-
Because it uses natural language, Gherkin Syntax enables all stakeholders to
|
|
19
|
-
understand and contribute to tests, and having a common vocabulary to describe
|
|
20
|
-
functionality makes it easy to agree on and verify what the program does.
|
|
21
|
-
|
|
22
|
-
- Reuse test step definitions to minimize test code
|
|
23
|
-
|
|
24
|
-
Bugs can happen even in test code, so it's best if the test code changes as seldom
|
|
25
|
-
as possible, but functionality changes all the time. A small library of reusable step
|
|
26
|
-
definitions is much easier to maintain than a large corpus of test code.
|
|
27
|
-
|
|
28
|
-
### When NOT to use Gherkin
|
|
29
|
-
|
|
30
|
-
- For unit tests, it's usually better to use plain Vitest or another testing framework.
|
|
31
|
-
|
|
32
|
-
## Installation
|
|
33
|
-
|
|
34
|
-
```sh
|
|
35
|
-
npm install --save-dev quickpickle vitest
|
|
36
|
-
```
|
|
37
|
-
|
|
38
|
-
## Configuration
|
|
39
|
-
|
|
40
|
-
Add the quickpickle plugin to your Vitest configuration in vite.config.ts (or .js, etc.).
|
|
41
|
-
Also add the configuration to get the feature files, step definitions, world file, etc.
|
|
42
|
-
|
|
43
|
-
```ts
|
|
44
|
-
// vite.config.ts
|
|
45
|
-
import { quickpickle } from 'quickpickle';
|
|
46
|
-
|
|
47
|
-
export default {
|
|
48
|
-
plugins: [
|
|
49
|
-
quickpickle() // <-- Add the quickpickle plugin
|
|
50
|
-
],
|
|
51
|
-
test: {
|
|
52
|
-
include : [
|
|
53
|
-
'features/*.feature', // <-- Add Gherkin feature files into "test" configuration
|
|
54
|
-
// (you'll probably want other test files too, for unit tests etc.)
|
|
55
|
-
],
|
|
56
|
-
setupFiles: ['./tests/tests.steps.ts'] // <-- specify each setupfile here
|
|
57
|
-
},
|
|
58
|
-
};
|
|
59
|
-
```
|
|
60
|
-
|
|
61
|
-
If you have multiple configurations, you can also add the test settings in vitest.workspace.ts.
|
|
62
|
-
This is also where you could set up separate configurations for components vs. application,
|
|
63
|
-
different browser environments, different world constructors, etc.
|
|
64
|
-
|
|
65
|
-
```ts
|
|
66
|
-
// vitest.workspace.ts
|
|
67
|
-
import { defineWorkspace } from 'vitest/config';
|
|
68
|
-
|
|
69
|
-
export default defineWorkspace([
|
|
70
|
-
{ // configuration for feature files
|
|
71
|
-
extends: './vite.config.ts',
|
|
72
|
-
test: {
|
|
73
|
-
include : [ 'tests/*.feature' ],
|
|
74
|
-
setupFiles: [ 'tests/tests.steps.ts' ],
|
|
75
|
-
},
|
|
76
|
-
},
|
|
77
|
-
{ // configuration for unit tests
|
|
78
|
-
test: {
|
|
79
|
-
include : [ 'tests/*.test.ts' ],
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
])
|
|
83
|
-
```
|
|
84
|
-
|
|
85
|
-
## Usage
|
|
86
|
-
|
|
87
|
-
### Write Feature files
|
|
88
|
-
|
|
89
|
-
Write your feature files in the directory specified above. Common convention
|
|
90
|
-
is to place feature files in a "features" directory, though some prefer the
|
|
91
|
-
"tests" directory. You can put them anywhere as long as they're listed in the
|
|
92
|
-
"include" configuration in vite.config.ts.
|
|
93
|
-
|
|
94
|
-
```gherkin
|
|
95
|
-
# features/example.feature
|
|
96
|
-
Feature: A simple example
|
|
97
|
-
|
|
98
|
-
Scenario: Adding numbers
|
|
99
|
-
Given a number 1
|
|
100
|
-
And a number 2
|
|
101
|
-
And a number 3
|
|
102
|
-
And another number 3
|
|
103
|
-
Then the sum should be 9
|
|
104
|
-
```
|
|
105
|
-
|
|
106
|
-
### Run tests
|
|
107
|
-
|
|
108
|
-
```sh
|
|
109
|
-
npx vitest --run
|
|
110
|
-
```
|
|
111
|
-
|
|
112
|
-
### Write step definitions
|
|
113
|
-
|
|
114
|
-
Write your step definitions in a typescript or javascript file as configured
|
|
115
|
-
in the "setupFiles" declaration in your vitest config.
|
|
116
|
-
|
|
117
|
-
These files will be imported into the Vitest test runner, and the code for
|
|
118
|
-
`Given`, `When`, `Then` will register each of the step definitions with quickpickle.
|
|
119
|
-
These step definitions should run immediately, i.e. at the top level of the script,
|
|
120
|
-
not as exported functions like a normal node module would do.
|
|
121
|
-
|
|
122
|
-
```ts
|
|
123
|
-
// features/example.steps.ts
|
|
124
|
-
import { Given, Then } from 'quickpickle'
|
|
125
|
-
|
|
126
|
-
Given('a/another number {int}', (world, int) => {
|
|
127
|
-
if (!world.numbers) world.numbers = [int]
|
|
128
|
-
else world.numbers.push(int)
|
|
129
|
-
})
|
|
130
|
-
|
|
131
|
-
Then('the sum should be {int}', (world, int) => {
|
|
132
|
-
expect(world.numbers.reduce((a,b) => a + b, 0)).toBe(int)
|
|
133
|
-
})
|
|
134
|
-
```
|
|
135
|
-
|
|
136
|
-
### Define a custom "world" variable
|
|
137
|
-
|
|
138
|
-
...instructions coming soon! :)
|
|
139
|
-
|
|
140
|
-
## Differences from CucumberJS
|
|
141
|
-
|
|
142
|
-
The main library for Gherkin in the JS ecosystem is [CucumberJS],
|
|
143
|
-
a test runner written explicitly for Gherkin tests. QuickPickle aims to be
|
|
144
|
-
a complete replacement for that library, using Vite to handle bundling
|
|
145
|
-
and test running while maintaining functional parity with the original.
|
|
146
|
-
Nonetheless, there are differences. Here are the important ones that have
|
|
147
|
-
come to notice:
|
|
148
|
-
|
|
149
|
-
- Each step definition MUST have the "world" variable as its first parameter:
|
|
150
|
-
|
|
151
|
-
```ts
|
|
152
|
-
// QuickPickle step definition
|
|
153
|
-
Given('a number {int}', function(world:QuickPickleWorldInterface, int:number) {
|
|
154
|
-
if (!Array.isArray(world.numbers)) world.numbers = [int]
|
|
155
|
-
else world.numbers.push(int)
|
|
156
|
-
})
|
|
157
|
-
```
|
|
158
|
-
|
|
159
|
-
In CucumberJS, you would write your step definitions using "this":
|
|
160
|
-
|
|
161
|
-
```ts
|
|
162
|
-
// CucumberJS step definition
|
|
163
|
-
Given('a number {int}', function(int:number) {
|
|
164
|
-
if (!Array.isArray(this.numbers)) this.numbers = [int]
|
|
165
|
-
else this.numbers.push(int)
|
|
166
|
-
})
|
|
167
|
-
```
|
|
168
|
-
|
|
169
|
-
"this" led to some sub-optimal usage, including:
|
|
170
|
-
- Arrow functions couldn't be used, because "this" doesn't work with them.
|
|
171
|
-
- When using a custom world, you would have to add `(this:CustomWorldType, ...params)`
|
|
172
|
-
in typescript files or else you wouldn't get the right types.
|
|
173
|
-
|
|
174
|
-
- The default "world" variable contains information about the current step.
|
|
175
|
-
|
|
176
|
-
In CucumberJS, the default "world" variable contains information about the
|
|
177
|
-
test *suite*, but not the *current step*. It's the opposite in QuickPickle;
|
|
178
|
-
the "world" variable passed to each test step contains an "info" property
|
|
179
|
-
with data about the current feature, rule, scenario or example, step, and line:
|
|
180
|
-
|
|
181
|
-
```gherkin
|
|
182
|
-
Feature: Basic Test
|
|
183
|
-
|
|
184
|
-
Rule: Every step must have access to information about itself
|
|
185
|
-
This is so we can know what is happening when writing step definitions
|
|
186
|
-
|
|
187
|
-
@tag-test
|
|
188
|
-
Example: The world has info
|
|
189
|
-
Given I run the tests
|
|
190
|
-
Then the property "info.feature" should include "Basic Test"
|
|
191
|
-
And the property "info.rule" should include "Every step must have access to information about itself"
|
|
192
|
-
And the property "info.scenario" should include "The world has info"
|
|
193
|
-
And the property "info.tags" should include "@tag-test"
|
|
194
|
-
And the property "info.step" should include "FWAH!!! (or really whatever you write here, since it's part of the step)"
|
|
195
|
-
And the property "info.line" should include "23"
|
|
196
|
-
```
|
|
197
|
-
|
|
198
|
-
## Acknowledgements
|
|
199
|
-
|
|
200
|
-
This project started out as a fork of [vitest-cucumber-plugin] by Sam Ziegler.
|
|
201
|
-
It's been almost completely rewritten in the following ways:
|
|
202
|
-
|
|
203
|
-
- it has been converted to typescript
|
|
204
|
-
- a custom Gherkin parser has been replaced with the official [Gherkin Parser]
|
|
205
|
-
- the step definition format has been reverted to more closely match CucumberJS
|
|
206
|
-
|
|
207
|
-
Nonetheless, the brilliant ideas behind the original plugin are still present
|
|
208
|
-
in the architecture of this project. Thanks Sam, your work blew my mind.
|
|
209
|
-
|
|
210
|
-

|
|
211
|
-
|
|
212
|
-
[Vitest]: https://vitest.dev/
|
|
213
|
-
[Gherkin Syntax]: https://cucumber.io/docs/gherkin/reference/
|
|
214
|
-
[Gherkin Parser]: https://www.npmjs.com/package/@cucumber/gherkin
|
|
215
|
-
[CucumberJS]: https://github.com/cucumber/cucumber-js
|
|
216
|
-
[vitest-cucumber-plugin]: https://github.com/samuel-ziegler/vitest-cucumber-plugin
|