Cypress plugin to generate json data from JSONNET files
npm install cy-jsonnetcy-jsonnet plugin is designed to auto generate cypress test definition and payload using jsonnet templates.
Core Ideas :
1. Eliminate duplication with object-orientation
1. Keep common data models in jsonnet file
1. Share and extend the models according to your user needs
1. Balance the logic between jsonnet and Cypress specs, e.g keep simple branching of positive and negative test cases only
1. Few things to note:
Jsonnet is hermetic: It always generates the same data no matter the execution environment. The addition of the native function was to support random data so we can generate idempotent payload for each test run.
Dynamic test case generation can be advantageous and must have native support for randomizing specific properties for the test payload. Jsonnet offers a solution to this by providing support for native methods extension, allowing for customization according to individual requirements.
| Core ideas | ... |
| -------- | ------- |
| Generate config data | Open source (Apache 2.0) |
| Side-effect free | Familiar syntax |
| Organize, simplify, unify | Reformatter, linter |
| Manage sprawling config | Editor & IDE integrations |
| simple extension of JSON | Formally specified |
1. Pre-requisite : Make sure you have these softwares
- Golang
- node js
- VS Code
- Go-Jsonnet
Run go install github.com/google/go-jsonnet/cmd/jsonnet@latest
2. Create folder where you like to test this plugin.
3. Open your favorite terminal window and cd to the folder
4. Init Node project npm init -y
5. Install Cypress npm install cypress
6. Install TypeScript npm install -g typescript
7. Install this plugin npm install cy-jsonnet
8. Open Cypress npx cypress open
- This will create required cypress folders and config files
9. Add tsconfig.json to project tsc --init
10. Open VS Code code .
- Edit cypress.config.ts
``TS*/${spec.fileName}*.jsonnet
import { interpretJsonnet } from "cy-jsonnet";
import { defineConfig } from "cypress";
import * as path from 'path';
const jsonnetFolder: string = "jsonnet";
const testDefinitionFolder: string = "testDefinition";
const testDataFolder: string = "testData";
let jsonnetPath = path.join('./cypress/support/', jsonnetFolder);
let testDefinitionPath = path.join('./cypress/fixtures/', testDefinitionFolder);
let testDataPath = path.join('./cypress/fixtures/', testDataFolder);
export default defineConfig({
e2e: {
setupNodeEvents(on, config) {
on("before:run", (details) => {
interpretJsonnet(jsonnetPath, '*/.jsonnet', testDefinitionPath, false);
});
on("before:spec", (spec) => {
interpretJsonnet(jsonnetPath, , testDataPath, true);`
});
return config;
},
experimentalRunAllSpecs: true,
experimentalInteractiveRunEvents: true
},
});
- Edit
`TS`
{
"compilerOptions": {
"target": "es2021",
"lib": ["es2021", "dom"],
"moduleResolution": "node",
"resolveJsonModule": true,
"types": ["cypress", "node", "@cypress/grep"],
"strictNullChecks": true,
"allowSyntheticDefaultImports": true,
"baseUrl": "./",
"paths": {
"@fixtures/": ["cypress/fixtures/"],
"@support/": ["cypress/support/"]
}
},
"include": ["/.ts", "/.js"],
}
10. Now your Cypress test setup is ready to configure dynamic test example using this plugin.
- Create a new file "cypress\e2e\person.cy.ts"
`TS`
import * as testInfo from "@fixtures/testDefinition/person.json";
before(() => {
cy.fixture("testData/person.json").as("testData");
});
describe("Cypress Dynamic Tests Positive Scenario Examples", () => {
testInfo.positiveScenarios.forEach((testMetaData, index) => {
it(testMetaData.testDefinition.scenario, { tags: testMetaData.testDefinition.tags }, function (data: any = this.testData.positiveScenarios[index].testData) {
expect(true).equals(true);
// Add your test logic here
console.log(data.person);
});
});
});
describe("Cypress Dynamic Tests Negative Scenario Examples", () => {
testInfo.negativeScenarios.forEach((testMetaData, index) => {
it(testMetaData.testDefinition.scenario, { tags: testMetaData.testDefinition.tags }, function (data: any = this.testData.negativeScenarios[index].testData) {
expect(true).equals(true);
// Add your test logic here
console.log(data.person);
});
});
});
11. Add required jsonnet and libsonnet files for using standard pattern
- Add libsonnet file "cypress\support\jsonnet\lib\utils.libsonnet"
`JS
{
testDefinition(fileName, scenario, tags=[])::
{
scenario: scenario,
testIdentifier: std.md5(fileName+scenario),
tags: tags + [self.testIdentifier],
},
}
`
- Add libsonnet file "cypress\support\jsonnet\lib\models.libsonnet"
`JS`
{
Person(firstName=std.native("fake")("{firstname}"),lastName=std.native("fake")("{lastname}"), ssn=std.native("fake")("{ssn}"), address={})::
{
person: {
firstName: firstName,
lastName: lastName,
ssn:ssn,
address: address,
},
},
Address(city='bellevue', state=std.native('fake')('{state}'))::
{
city: city,
state: state,
},
}
- Add sample jsonnet files "cypress\support\jsonnet\person.jsonnet"JS`
local model = import './lib/models.libsonnet';
local utils = import './lib/utils.libsonnet';
local DynamicTest(definition={}, data={}) = {
testDefinition: definition,
testData: if std.extVar('generateTestData') == 'true' then data else {},
};
{
positiveScenarios: [
// Person
DynamicTest(
definition=utils.testDefinition(fileName=std.thisFile,scenario='Verify person entity can be created with empty address', tags=['sanity', 'person']),
data=model.Person()
),
DynamicTest(
definition=utils.testDefinition(fileName=std.thisFile,scenario='Verify person is created with name=joe', tags=['sanity', 'regression']),
data=model.Person(firstName='joe')
)
],
negativeScenarios: [
DynamicTest(
definition=utils.testDefinition(fileName=std.thisFile,scenario='Verify person failed with empty firstname', tags=['regression', 'sanity']),
data=model.Person(firstName="",address=model.Address(city=std.native("fake")("{city}")))
),
DynamicTest(
definition=utils.testDefinition(fileName=std.thisFile,scenario='Verify person failed when ssn in null or empty', tags=['regression']),
data=model.Person(ssn="")
),
],
}
12. Now we can see how dynamic test and data from jsonnet can load into person.cy.ts
- Run š npx cypress open --e2e
- Select
13. To use Cypress grep plugin
- Install
- Add these lines to
`TS`
import registerCypressGrep from '@cypress/grep'
registerCypressGrep()
14. This will help with running using grep tags
npx cypress run --env grepTags="sanity"`
- More examples @cypress/grep
Contributions, issues and feature requests are welcome. Please email your ideas to us.
š¤ Sumit Agarwal BD :email: Personal :email:
š¤ Anoop Sasi BD :email: Personal :email:
This project exists thanks to all the people who contributed.
- Kunal Nain BD :email:
- David Lukic-Hanomihl š§
- Marko Kolasinac š§
-
If you find this useful please spread the words :thumbsup:
This project is [MIT] licensed.
---