What I have
I have command that can request token and it resolves promise on response. Once the promise is being resolved - I put the token into the sessionStorage in SomeTest.js. It works. But I have to put exactly same cy.window()... in every test.
SomeTest.js:
before(()=>{
cy.login().then(res=>
cy.window().then((window) => {
window.sessionStorage.setItem('token', JJSON.stringify(res))
})
);
});
command in commands.js
Cypress.Commands.add('login', function () {
fetcher.emit('tokenRequest',{email:'dummy#mail.com', password:'dummy'});
return new Cypress.Promise((resolve, reject) => {
fetcher.on('onTokenResponse',function(response) {
resolve(response);
});
});
});
What I want
I would like to set sessionStorage in command login() too.
SomeTest.js:
before(()=>{
cy.login();
});
command in commands.js
Cypress.Commands.add('login', function () {
fetcher.emit('tokenRequest',{email:'dummy#mail.com', password:'dummy'});
return new Cypress.Promise((resolve, reject) => {
fetcher.on('onTokenResponse',function(response) {
cy.window().then((window) => {
window.sessionStorage.setItem('token', JSON.stringify(response));
resolve(response);
})
});
});
});
But it throws error: Uncaught CypressError: Cypress detected that you returned a promise from a command while also invoking one or more cy commands in that promise., The cy command you invoked inside the promise was:> cy.window().
I understand the problem is that I am trying to call another promise which is not being returned. But how can I achieve something like this?
I need to
emit tokenRequest
wait for the tokenResponse
get cy.window() and set some sessionStorage item
Edit:
I've found walkaround and I've wrapped login into another function/command which seems to be working but I am not sure how pretty is this solution.
Cypress.Commands.add('loginFull', function () {
return cy.login().then((response)=>{
cy.window().then((window) => {
window.sessionStorage.setItem('token', JSON.stringify(response));
});
});
});
One way that works is to move the cy.window() command to the outermost level of the custom command, so you are not trying to use it within the Promise.
Test
describe('web socket event handler', () => {
let fetcher;
before(() => {
const io = require('socket.io-client');
fetcher = io.connect('http://127.0.0.1:5000');
cy.window().then(win => {
win.sessionStorage.clear(); // ensure clean before test
})
})
Cypress.Commands.add('login', function () {
cy.window().then(win => {
fetcher.emit('tokenRequest',{email:'dummy#mail.com', password:'dummy'});
return new Cypress.Promise((resolve, reject) => {
fetcher.on('onTokenResponse',function(response) {
win.sessionStorage.setItem('token', JSON.stringify(response));
return resolve(response);
});
});
});
});
it('waits for token', () => {
cy.login().then(_ => {
cy.window().then(win => {
console.log(win.sessionStorage.getItem('token'))
// logs "Response: dummy#mail.com"
})
})
})
})
Server
io.on('connection', function(socket){
socket.on('tokenRequest', function(msg){
setTimeout(() => {
io.emit('onTokenResponse', `Response: ${msg.email}`);
}, 2000)
});
});
Ideally would want to make the login command wait on the fetcher event (with timeout?).
I tried this approach Spying on the DOM API, but no luck so far.
Another way is to set a flag within the event listener, and add a command to the queue that waits on it.
Cypress.Commands.add('login', function () {
cy.window().then(win => {
fetcher.emit('tokenRequest',{email:'dummy#mail.com', password:'dummy'});
let flag = { done: false };
fetcher.on('onTokenResponse',function(response) {
win.sessionStorage.setItem('token', JSON.stringify(response));
flag.done = true;
})
cy.wrap(flag).its('done').should('equal', true); // wait here until done
});
});
Now you can call login synchronously
it('waits for token', () => {
cy.login();
cy.window().then(win => {
console.log(win.sessionStorage.getItem('token'))
// logs "Response: dummy#mail.com"
})
})
Cypress.Commands.add('login', function () {
function waitForSocket(callback) {
fetcher.emit('tokenRequest',{email:'dummy#mail.com', password:'dummy'});
fetcher.on('onTokenResponse',function(response) {
callback(response);
});
}
waitForSocket((res) => {
cy.window().then((window) => {
window.sessionStorage.setItem('token', JJSON.stringify(res))
})
})
});
The error points to this: Cypress commands are already promises and they will wait/resolve themselves. So I think there should not be a wrapping promise for the fetcher.
Edit: I think you can wrap the socket tasks in a callback function.
Related
In my header component:
signIn() {
signInWithPopup(auth, provider).then((result) => {
this.updateUser(result.user.uid);
const userRef = doc(db, 'users', result.user.uid);
this.firestoreUser(userRef)
.then((userDoc) => {
if (!userDoc.exists()) {
this.addNewUserToFirestore(userRef, result.user);
}
})
.then(() => {
console.log('Read user from firestore');
// FIXME: readUserFromFirestore still isn't finishing before moving on...
this.readUserFromFirestore();
})
.then(() => {
console.log('Read personal patches');
this.readPersonalPatches();
})
.then(() => {
console.log('Add watcher');
this.geolocationId = navigator.geolocation.watchPosition(
this.nearLandmark,
this.errorCallback
);
});
});
},
readUserFromFirestore:
async readUserFromFirestore({ commit, state }) {
const userRef = doc(db, 'users', state.user);
try {
const userDoc = await getDoc(userRef);
await (() => {
return new Promise((resolve) => {
for (const property in userDoc.data()) {
const propertyValue = userDoc.data()[property];
commit('addProfileProperty', {
propertyName: property,
propertyValue,
});
}
console.log(
'Just finished putting in user patches',
state.profile.patches
);
resolve();
});
})();
} catch (e) {
alert('Error!');
console.error(e);
}
},
};
readPersonalPatches:
async readPersonalPatches({ commit, state }) {
try {
if (state.user) {
// Get a copy of all the user's patches
state.ownedPatchesArray = [];
state.unownedPatchesArray = [];
await (function () {
console.log('Made it inside the await from readpersonalpatches');
return new Promise((resolve) => {
console.log('raw badges', state.rawPatches);
console.log('user badges', state.profile.patches);
state.rawPatches.forEach((patch) => {
if (JSON.stringify(state.profile.patches).includes(patch.slug)) {
commit('addToArray', {
arr: 'ownedPatchesArray',
value: patch,
});
} else {
commit('addToArray', {
arr: 'unownedPatchesArray',
value: patch,
});
}
});
resolve();
});
})();
}
} catch (error) {
alert('Error reading personal patches');
console.log(error);
}
},
Console Output:
Read user from firestore
Read personal patches
Made it inside the await from readpersonalpatches
raw badges **accurate badge list**
user badges undefined
TypeError: Cannot read properties of undefined (reading 'includes')
Add watcher
Just finished putting in user patches **accurate user patch list**
In readUserFromFirestore I wasn't sure exactly how to approach waiting on the user's patches to be added to the array before moving on in the sign-in process. One of the properties that is being looped over is profile.patches. readPersonalPatches() uses that property. But on fresh logins I get an error in readPersonalPatches() because profile.patches is undefined at that point. (On logins after cacheing I do not have an issue reading profile.patches apart from the data potentially being outdated.)
I am using Vue, Vuex, and Firebase for Authentication and Firestore.
For my purposes patch and badge are interchangeable terms.
Thanks to Luaan for educating me on how then blocks work I have it going now. I wasn't returning the promises, only calling the function and then not doing anything with the returned promises 🤦
Fixed lines:
.then((userDoc) => {
return (function () {
if (!userDoc.exists()) {
this.addNewUserToFirestore(userRef, result.user);
}
})();
})
.then(() => {
console.log('Read user from firestore');
return this.readUserFromFirestore();
})
.then(() => {
console.log('Read personal patches');
return this.readPersonalPatches();
})
I use the Jest framework to create unit tests. When I run them. there is the message at the end:
"Jest did not exit one second after the test run has completed.
This usually means that there are asynchronous operations that weren't stopped in your tests. Consider running Jest with --detectOpenHandles to troubleshoot this issue."
To exit, I use the command "--forceExit".
Also, I've tried to find an issue with --detectOpenHandles, but it didn't show anything.
I can't find what it hasn't closed, session or driver, or something else.
How could it be fixed?
const neo4j = require("neo4j-driver");
const driver = neo4j.v1.driver(
`bolt://${host}`,
neo4j.v1.auth.basic(username, password)
);
beforeAll(async () => {
await cleanDB();
});
afterAll(async () => {
await cleanDB();
driver.close();
});
async function cleanDB() {
await runQuery(`...query`);
}
async function runQuery(query) {
const session = driver.session();
return session
.writeTransaction(tx => tx.run(query))
.then(result => {
session.close();
return result;
})
.catch(error => {
session.close();
return { error };
});
}
describe(`bla-bla-bla`, function() {
beforeAll(async () => {
await dataBaseLoader(data);
});
test(`bla-bla-bla`, async function() {
const result = await runQuery(
'...query' );
//Body of Test
expect(result).toStrictEqual(expected);
});
There is no need to use async before function if you don't use await in body, also if function is not async access it without await
function cleanDB() {
runQuery(`...query`);
}
function runQuery(query) {
const session = driver.session();
return session
.writeTransaction(tx => tx.run(query))
.then(result => {
session.close();
return result;
})
.catch(error => {
session.close();
return { error };
});
}
and so on, check all your functions, maybe it will help
I have a function that looks like following
export const checkForAvailableAgent = (topicId, serviceUrl, serviceId) => {
const serviceInfo = new window.adiaLive.ServiceInfo({
topicId: topicId, // set here the topicId which you want listen for
OnError: e => {
// react to error message (optional)
console.log("error: ", e);
},
OnServiceStateChange: e => {
if (e.ConnectedAdvisers > 0) {
// there are advisers online for given topicId
console.log("studio available");
return true;
} else {
console.log("studio not available");
return false;
}
}
});
serviceInfo.connect(serviceUrl, serviceId);
};
however the return statements don't return anything when I use the function in the following manner
useEffect(() => {
const agent = checkForAvailableAgent(
`sales_${i18n.language}`,
"https://linktoserviceurl",
"serviceid"
);
// console.log("studio available is: ", agent);
}, []);
the console.log massages appear but the return statement is undefined.
any help would be appreciated.
You can not return from a callback function, as it is running asynchronously and you are not waiting for it to have a result ready.
You can however make the function itself async by returning a Promise instead of the actual result and wait until the Promise has a result ready (e.g. it is resolved):
export const checkForAvailableAgent = (topicId, serviceUrl, serviceId) => {
return new Promise((resolve, reject) => {
const serviceInfo = new window.adiaLive.ServiceInfo({
topicId: topicId, // set here the topicId which you want listen for
OnError: e => {
// react to error message (optional)
console.log("error: ", e);
reject(); // reject on failure
},
OnServiceStateChange: e => {
if (e.ConnectedAdvisers > 0) {
// there are advisers online for given topicId
console.log("studio available");
resolve(true); // resolve instead of return
} else {
console.log("studio not available");
resolve(false);
}
}
});
serviceInfo.connect(serviceUrl, serviceId);
})
};
useEffect(() => {
checkForAvailableAgent(
`sales_${i18n.language}`,
"https://linktoserviceurl",
"serviceid"
).then((agent) => { // then callback is called when the promise resolved
console.log("studio available is: ", agent);
}).catch(error => { // catch is called when promise got rejected
console.log('An error happened');
});
}, []);
The function servceInfo.OnServiceStateChange is a function into the object (seems to be an event).
I'd suggest declaring a variable on the checkForAvailableAgent like connected and change it's value when the event is called.
Then access it using checkForAvailableAgent.connected.
A version with async/await and try/catch
export const checkForAvailableAgent = (topicId, serviceUrl, serviceId) => {
return new Promise((resolve, reject) => {
const serviceInfo = new window.adiaLive.ServiceInfo({
topicId: topicId,
OnError: reject,
OnServiceStateChange: e => resolve(e.ConnectedAdvisers > 0)
});
serviceInfo.connect(serviceUrl, serviceId);
})
};
useEffect(() => {
(async () => {
try {
const isAvailable = await checkForAvailableAgent(
`sales_${i18n.language}`,
"https://linktoserviceurl",
"serviceid"
);
// console.log("Result", isAvailable)
} catch(e) {
console.error(e)
}
})()
// console.log("studio available is: ", agent);
}, []);
There are 2 possible reasons
you are not returning anything from checkForAvailableAgent.
After returning from the checkForAvailableAgent, it might be asynchronous function. You can use async & await.
We have a method in our CLI which uses method returning a promise to print message to user.
exports.handler = (argv) => {
let customUtils = new Utils(argv);
Utils.deploy()
.then(res => console.log(`Ressource was deployed`))
.catch(e => {
console.error(`Ressource was not deployed`);
console.error(e);
process.exit(1);
});
}
We are looking for a way to test console errors and process exit in case of deploy() promise rejection.
We tried using sandbox stub then assert in an async test:
describe('when promise is errored', () => {
beforeEach(() => {
sandbox = sinon.createSandbox();
utilsStub = sandbox.stub(Utils.prototype, 'deploy').rejects('rejected');
processStub = sandbox.stub(process, 'exit');
consoleStub = sandbox.stub(console, 'error');
});
afterEach(() => {
sandbox.restore();
});
it('should call deploy and log the error before exiting', async () => {
await handler({});
expect(utilsStub).to.have.been.called;
expect(console.error).to.have.been.called;
});
});
This test doesn't work: AssertionError: expected error to have been called at least once, but it was never called.
The same happens when we expect(process.exit).to.have.been.called;. It's never called.
We successfuly tested the then part in a similary way:
describe('when promise is resolved', () => {
beforeEach(() => {
sandbox = sinon.createSandbox();
utilsStub = sandbox.stub(Utils.prototype, 'deploy').callsFake(() => Promise.resolve('some text'));
consoleStub = sandbox.stub(console, 'log');
});
afterEach(() => {
sandbox.restore();
});
it('should call deploy and print success message', async () => {
await handler({});
expect(utilsStub).to.have.been.called;
expect(console.log).to.have.been.calledWith('Ressource was deployed');
});
});
There are some things to fix the source and test file.
For source file, we must use customUtils to call deploy() function. Since, you can use async/await, convert it from Promise can produce better code.
exports.handler = async argv => { // put async
let customUtils = new Utils(argv);
try {
await customUtils.deploy(); // change to await and use customUtils
console.log(`Ressource was deployed`);
} catch (e) {
console.error(`Ressource was not deployed`);
console.error(e);
process.exit(1);
}
};
For test file, nothing changes
describe('when promise is errored', () => {
beforeEach(() => {
sandbox = sinon.createSandbox();
utilsStub = sandbox.stub(Utils.prototype, 'deploy').rejects('rejected');
processStub = sandbox.stub(process, 'exit');
consoleStub = sandbox.stub(console, 'error');
});
afterEach(() => {
sandbox.restore();
});
it('should call deploy and log the error before exiting', async () => {
await handler({});
expect(utilsStub).to.have.been.called;
expect(console.error).to.have.been.called;
expect(process.exit).to.have.been.called; // add it
});
});
UPDATED:
In case want to still use promise, we have to make sure we return the promise.
exports.handler = (argv) => {
let customUtils = new Utils(argv);
return customUtils.deploy() // <== specify return here
.then(res => console.log(`Ressource was deployed`))
.catch(e => {
console.error(`Ressource was not deployed`);
console.error(e);
process.exit(1);
});
};
Hope it helps
You need to be able await the result of exports.handler before you test your assertions. You are awaiting it, but exports.handler is not returning the promise, so there's nothing to await in the test — exports.handler returns undefined immediately so the test runs the assertions in the same event loop before console.error can be called.
I'm not sure why you aren't seeing similar problems in the test where the promise resolves. (Maybe worth checking that that test fails properly)
This should help:
exports.handler = (argv) => {
let customUtils = new Utils(argv);
//Utils.deploy() // <- is that a typo?
return customUtils.deploy()
.then(res => console.log(`Ressource was deployed`))
.catch(e => {
console.error(`Ressource was not deployed`);
console.error(e);
process.exit(1);
});
}
Also in your tests you are creating a spy with:
consoleStub = sandbox.stub(console, 'error');
But writing the assertion directly on console.error. I don't think this should work:
expect(console.error).to.have.been.called;
// maybe expect(consoleStub)...
With those changes the test passes for me and (more importantly) fails when I don't call console.error in the catch.
I have the following test case:
it("should pass the test", async function (done) {
await asyncFunction();
true.should.eq(true);
done();
});
Running it asserts:
Error: Resolution method is overspecified. Specify a callback or
return a Promise; not both.
And if I remove the done(); statement, it asserts:
Error: Timeout of 2000ms exceeded. For async tests and hooks, ensure
"done()" is called; if returning a Promise, ensure it resolves.
How to solve this paradox?
You need to remove the done parameter as well, not just the call to it. Testing frameworks like Mocha look at the function's parameter list (or at least its arity) to know whether you're using done or similar.
Using Mocha 3.5.3, this works for me (had to change true.should.be(true) to assert.ok(true) as the former threw an error):
const assert = require('assert');
function asyncFunction() {
return new Promise(resolve => {
setTimeout(resolve, 10);
});
}
describe('Container', function() {
describe('Foo', function() {
it("should pass the test", async function () {
await asyncFunction();
assert.ok(true);
});
});
});
But if I add done:
describe('Container', function() {
describe('Foo', function() {
it("should pass the test", async function (done) { // <==== Here
await asyncFunction();
assert.ok(true);
});
});
});
...then I get
Error: Timeout of 2000ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
Removing done as a param from it worked for me! Instead only use expect/should. Example is as follows:
getResponse(unitData, function callBack(unit, error, data){ try {
return request.post(unit, function (err, resp) {
if (!err && resp.statusCode === 200) {
if (resp.body.error) {
return callback(obj, JSON.stringify(resp.body.error), null);
}
return callback(obj, null, resp);
} else {
if (err == null) {
err = { statusCode: resp.statusCode, error: 'Error occured.' };
}
return callback(obj, err, null);
}
});
} catch (err) {
return callback(obj, err, null);
}}
BEFORE:
it('receives successful response', async (done) => {
const getSomeData = await getResponse(unitData, function callBack(unit, error, data){
expect(data.statusCode).to.be.equal(200);
done();
}) })
AFTER (works):
it('receives successful response', async () => {
const getSomeData = await getResponse(unitData, function callBack(unit, error, data){
expect(data.statusCode).to.be.equal(200);
}) })
Sometimes there are cases you need to use async/await + done function in mocha.
For example, in one of my socket.io unit test cases, I have to call db functions with async functions and test socket event handlers which are callback functions:
context("on INIT_CHAT", ()=> {
it("should create a room", async (done) => {
const user = await factory.create("User");
socket.emit("INIT_CHAT", user);
socket.on("JOIN_CHAT", async (roomId) => {
const room = await ChatRoom.findByPk(roomId);
expect(room).to.exist;
// then I need to close a test case here
done();
});
});
});
This will causes the exact same error as in the OP:
Error: Resolution method is overspecified. Specify a callback or return a Promise; not both.
My Workaround:
I just wrapped the entire test code in a promise generator:
context("on INIT_CHAT", ()=> {
it("should create a room", async () => {
const asyncWrapper = () => {
return new Promise(async (resolve) => {
const user = await factory.create("User");
socket.emit("INIT_CHAT", user);
socket.on("JOIN_CHAT", async (roomId) => {
const room = await ChatRoom.findByPk(roomId);
expect(room).to.exist;
resolve(true);
});
});
});
await asyncWrapper();
});
});