I need to define an acceptance test, I need it quickly
It is a javascript library based on jQuery, that load a JSON and render a recursive structure populating nested html elements, including label, input, dropdown, etc. (interactive elements).
The acceptance test must ensure every element is rendered, and is what is expected by the JSON payload
I am using
- jsdom
- jest
- legacy code in jquery (very old version)
- the Javascript code to test is in the page
I copy from the page and paste it into prepare.js
Given I have to load it from NodeJs and excute jQuery staff, I define it by a parameter $, this way:
let start = ($) = {
$(function() {
var actions = ActionGroup($("#actions"));
.... // e blablabla
function loadExample() {
const fs = require('fs');
var exJson = fs.readFileSync(.....)
actions.loadObject(JSON.parse(exJson);
}
loadExample();
})
}
module.exports = start
But I can define just a use case, a single json payload.
This was enough to release a fix. But now it arrives another case: another JSON payload. First thought was to transform everything in a class, move staff there and … Or use a promise returning a function:
let start = ($) => {
return new Promise((resolve, reject) => {
$(function() {
actions e blablabla ....
. ...
function loadExample(filename) { // parametro
.....
..}
resolve(loadExample);
});
}); // no reject()
};
module.exports = start
So I can executeexpect() after loading into the page by:
let prepare = require('./prepare');
prepare(window.$).then((loadAction) => {
loadAction('./path/tothe1.json');
expect(window.$('#selector').html()).equals(blabla1);
loadAction('./path/tothe2.json');
expect(window.$('#selector').html()).equals(blabla2);
})
.catch( (err) => expect(false).equals(true) )
Outcome
The page is rendered by jsdom, the JSON is injected by a separated module able to load JSON from file, as if the payload comes from an http (ajax) request, the rendered page can be parsed for expect()’ation