I'm trying to test for the presence of some api response properties that I want to require across all tests (a status and data property).
Here's a generic test that asserts the desired properties in a supertest expect() method:
it('should create a widget', done => {
let status = 200;
request(test_url)
.post('/api/widgets')
.set('Authorization', `Bearer ${token}`)
.send({
sku: my_widget_data.sku,
name: my_widget_data.name,
description: ''
})
.expect(res => {
assert(
Object.keys(res.body).includes('status'),
'`status` is a required field'
);
assert(
Object.keys(res.body).includes('data'),
'`data` is a required field'
);
assert.strictEqual(res.body.status, status);
assert.strictEqual(res.status, status);
})
.end((err, res) => {
if (err) return done(err);
done();
});
});
This expect() behavior is going to be common to almost all my tests.
How can I extract the expect() behavior to DRY up my tests, while still passing arbitrary status numbers?
You could extrapolate the function that expect() calls into another one which returns a function you pass status into:
export function statusCheck(status) {
return res => {
assert(
Object.keys(res.body).includes("status"),
"`status` is a required field",
)
assert(Object.keys(res.body).includes("data"), "`data` is a required field")
assert.strictEqual(res.body.status, status)
assert.strictEqual(res.status, status)
}
}
Now in your original file, you could call:
.expect(statusCheck(200))
Here's a snippet showing how it works as well:
// Ignored since status is scoped below
const status = 400
// Returns your (res) => {} function, uses status
function statusCheck(status) {
return res => {
console.log(`Desired status number is ${status}`)
if(res.status === status) console.log(`Response: ${res.status}, It worked!`)
else console.log(`Response: ${res.status}, It failed!`)
}
}
// Testing if it works with a mockup
const thisGoesInsideExpect = statusCheck(200)
const res = {status: 200}
thisGoesInsideExpect(res)
Related
I have a bunch of fixtures generated by the backend, and named based on the hash of the request body.
I am trying to find a way to load fixtures dynamically based on the sent request, something like this:
cy.intercept('POST', '**/login', (req) => {
const hash = md5(req.body);
cy.fixture(`${hash}.json`).then(data => {
req.reply(res => {
res.statusCode = data.statusCode;
res.body = data.body;
})
})
}).as('response');
cy.visit("/login");
cy.get('input[name="email"]').type('test#email.com');
cy.get('input[name="password"]').type('wrongpassword');
cy.contains('button', 'Login').click();
cy.wait('#response');
cy.contains('Invalid credentials.');
But every time I try to load a fixture inside an intercept, I get the following error:
The following error originated from your test code, not from Cypress.
> A request callback passed to cy.intercept() threw an error while intercepting a request:
Cypress detected that you returned a promise from a command while also invoking one or more cy commands in that promise.
The command that returned the promise was:
> cy.wait()
The cy command you invoked inside the promise was:
> cy.fixture()
Is there any way, I could possibly load fixtures dynamically based on something inside the request?
You can just read the fixture first
cy.fixture('login_incorrect.json').then(data => { // may not need it, but in case...
cy.intercept('POST', '**/login', (req) => {
const body = JSON.parse(req.body);
if(body.password === 'wrongpassword') {
req.reply(res => {
res.statusCode = data.statusCode; // data = closure from above
res.body = data.body;
})
} else {
// load a different fixture based on something, etc.
}
}).as('response');
})
Combined fixture
{
"put-first-hash-here": {
statusCode: ...,
body: ...
},
"put-second-hash-here": {
statusCode: ...,
body: ...
},
}
Test
cy.fixture('combined.json').then(data => {
cy.intercept('POST', '**/login', (req) => {
const body = JSON.parse(req.body);
const hash = md5(req.body);
if(body.password === 'wrongpassword') {
req.reply(res => {
res.statusCode = data[hash].statusCode;
res.body = data[hash].body;
})
}
}).as('response');
})
I have seen axios documentation, but all it says is
// Add a request interceptor
axios.interceptors.request.use(function (config) {
// Do something before request is sent
return config;
}, function (error) {
// Do something with request error
return Promise.reject(error);
});
// Add a response interceptor
axios.interceptors.response.use(function (response) {
// Do something with response data
return response;
}, function (error) {
// Do something with response error
return Promise.reject(error);
});
Also many tutorials only show this code but I am confused what it is used for, can someone please give me simple example to follow.
To talk in simple terms, it is more of a checkpoint for every HTTP action. Every API call that has been made, is passed through this interceptor.
So, why two interceptors?
An API call is made up of two halves, a request, and a response. Since it behaves like a checkpoint, the request and the response have separate interceptors.
Some request interceptor use cases -
Assume you want to check before making a request if your credentials are valid. So, instead of actually making an API call, you can check at the interceptor level that your credentials are valid.
Assume you need to attach a token to every request made, instead of duplicating the token addition logic at every Axios call, you can make an interceptor that attaches a token on every request that is made.
Some response interceptor use cases -
Assume you got a response, and judging by the API responses you want to deduce that the user is logged in. So, in the response interceptor, you can initialize a class that handles the user logged in state and update it accordingly on the response object you received.
Assume you have requested some API with valid API credentials, but you do not have the valid role to access the data. So, you can trigger an alert from the response interceptor saying that the user is not allowed. This way you'll be saved from the unauthorized API error handling that you would have to perform on every Axios request that you made.
Here are some code examples
The request interceptor
One can print the configuration object of axios (if need be) by doing (in this case, by checking the environment variable):
const DEBUG = process.env.NODE_ENV === "development";
axios.interceptors.request.use((config) => {
/** In dev, intercepts request and logs it into console for dev */
if (DEBUG) { console.info("✉️ ", config); }
return config;
}, (error) => {
if (DEBUG) { console.error("✉️ ", error); }
return Promise.reject(error);
});
If one wants to check what headers are being passed/add any more generic headers, it is available in the config.headers object. For example:
axios.interceptors.request.use((config) => {
config.headers.genericKey = "someGenericValue";
return config;
}, (error) => {
return Promise.reject(error);
});
In case it's a GET request, the query parameters being sent can be found in config.params object.
The response interceptor
You can even optionally parse the API response at the interceptor level and pass the parsed response down instead of the original response. It might save you the time of writing the parsing logic again and again in case the API is used in the same way in multiple places. One way to do that is by passing an extra parameter in the api-request and use the same parameter in the response interceptor to perform your action. For example:
//Assume we pass an extra parameter "parse: true"
axios.get("/city-list", { parse: true });
Once, in the response interceptor, we can use it like:
axios.interceptors.response.use((response) => {
if (response.config.parse) {
//perform the manipulation here and change the response object
}
return response;
}, (error) => {
return Promise.reject(error.message);
});
So, in this case, whenever there is a parse object in response.config, the manipulation is done, for the rest of the cases, it'll work as-is.
You can even view the arriving HTTP codes and then make the decision. For example:
axios.interceptors.response.use((response) => {
if(response.status === 401) {
alert("You are not authorized");
}
return response;
}, (error) => {
if (error.response && error.response.data) {
return Promise.reject(error.response.data);
}
return Promise.reject(error.message);
});
You can use this code for example, if you want to catch the time that takes from the moment that the request was sent until the moment you received the response:
const axios = require("axios");
(async () => {
axios.interceptors.request.use(
function (req) {
req.time = { startTime: new Date() };
return req;
},
(err) => {
return Promise.reject(err);
}
);
axios.interceptors.response.use(
function (res) {
res.config.time.endTime = new Date();
res.duration =
res.config.time.endTime - res.config.time.startTime;
return res;
},
(err) => {
return Promise.reject(err);
}
);
axios
.get("http://localhost:3000")
.then((res) => {
console.log(res.duration)
})
.catch((err) => {
console.log(err);
});
})();
It is like a middle-ware, basically it is added on any request (be it GET, POST, PUT, DELETE) or on any response (the response you get from the server).
It is often used for cases where authorisation is involved.
Have a look at this: Axios interceptors and asynchronous login
Here is another article about this, with a different example: https://medium.com/#danielalvidrez/handling-error-responses-with-grace-b6fd3c5886f0
So the gist of one of the examples is that you could use interceptor to detect if your authorisation token is expired ( if you get 403 for example ) and to redirect the page.
I will give you more practical use-case which I used in my real world projects. I usually use, request interceptor for token related staff (accessToken, refreshToken), e.g., whether token is not expired, if so, then update it with refreshToken and hold all other calls until it resolves. But what I like most is axios response interceptors where you can put your apps global error handling logic like below:
httpClient.interceptors.response.use(
(response: AxiosResponse) => {
// Any status code that lie within the range of 2xx cause this function to trigger
return response.data;
},
(err: AxiosError) => {
// Any status codes that falls outside the range of 2xx cause this function to trigger
const status = err.response?.status || 500;
// we can handle global errors here
switch (status) {
// authentication (token related issues)
case 401: {
return Promise.reject(new APIError(err.message, 409));
}
// forbidden (permission related issues)
case 403: {
return Promise.reject(new APIError(err.message, 409));
}
// bad request
case 400: {
return Promise.reject(new APIError(err.message, 400));
}
// not found
case 404: {
return Promise.reject(new APIError(err.message, 404));
}
// conflict
case 409: {
return Promise.reject(new APIError(err.message, 409));
}
// unprocessable
case 422: {
return Promise.reject(new APIError(err.message, 422));
}
// generic api error (server related) unexpected
default: {
return Promise.reject(new APIError(err.message, 500));
}
}
}
);
How about this. You create a new Axios instance and attach an interceptor to it. Then you can use that interceptor anywhere in your app
export const axiosAuth = axios.create()
//we intercept every requests
axiosAuth.interceptors.request.use(async function(config){
//anything you want to attach to the requests such as token
return config;
}, error => {
return Promise.reject(error)
})
//we intercept every response
axiosAuth.interceptors.request.use(async function(config){
return config;
}, error => {
//check for authentication or anything like that
return Promise.reject(error)
})
Then you use axiosAuth the same way you use axios
This is the way I used to do in my project. The code snippet refers how to use access and refresh token in the axios interceptors and will help to implements refresh token functionalities.
const API_URL =
process.env.NODE_ENV === 'development'
? 'http://localhost:8080/admin/api'
: '/admin-app/admin/api';
const Service = axios.create({
baseURL: API_URL,
headers: {
Accept: 'application/json',
},
});
Service.interceptors.request.use(
config => {
const accessToken = localStorage.getItem('accessToken');
if (accessToken) {
config.headers.common = { Authorization: `Bearer ${accessToken}` };
}
return config;
},
error => {
Promise.reject(error.response || error.message);
}
);
Service.interceptors.response.use(
response => {
return response;
},
error => {
let originalRequest = error.config;
let refreshToken = localStorage.getItem('refreshToken');
const username = EmailDecoder(); // decode email from jwt token subject
if (
refreshToken &&
error.response.status === 403 &&
!originalRequest._retry &&
username
) {
originalRequest._retry = true;
return axios
.post(`${API_URL}/authentication/refresh`, {
refreshToken: refreshToken,
username,
})
.then(res => {
if (res.status === 200) {
localStorage.setItem(
'accessToken',
res.data.accessToken
);
localStorage.setItem(
'refreshToken',
res.data.refreshToken
);
originalRequest.headers[
'Authorization'
] = `Bearer ${res.data.accessToken}`;
return axios(originalRequest);
}
})
.catch(() => {
localStorage.clear();
location.reload();
});
}
return Promise.reject(error.response || error.message);
}
);
export default Service;
I have implemented in the following way
httpConfig.js
import axios from 'axios'
import { baseURL } from '../utils/config'
import { SetupInterceptors } from './SetupInterceptors'
const http = axios.create({
baseURL: baseURL
})
SetupInterceptors(http)
export default http
SetupInterceptors.js
import { baseURL } from '../utils/config'
export const SetupInterceptors = http => {
http.interceptors.request.use(
config => {
config.headers['token'] = `${localStorage.getItem('token')}`
config.headers['content-type'] = 'application/json'
return config
},
error => {
return Promise.reject(error)
}
)
http.interceptors.response.use(function(response) {
return response
}, function (error) {
const status = error?.response?.status || 0
const resBaseURL = error?.response?.config?.baseURL
if (resBaseURL === baseURL && status === 401) {
if (localStorage.getItem('token')) {
localStorage.clear()
window.location.assign('/')
return Promise.reject(error)
} else {
return Promise.reject(error)
}
}
return Promise.reject(error)
})
}
export default SetupInterceptors
Reference : link
I submitted a transaction to Hyperledger Fabric, but I'd like to get object created by this.
The object that I get from this is Undefined.
Obs: The transaction is successfully created in Hyperledger Fabric.
async submit(resource, method) {
try{
this.businessNetworkDefinition = await this.bizNetworkConnection.connect(cardname);
if (!this.businessNetworkDefinition) {
console.log("Error in network connection");
throw "Error in network connection";
}
let factory = this.businessNetworkDefinition.getFactory();
let transaction = factory.newTransaction(NS, method);
Object.assign(transaction, resource)
return await this.bizNetworkConnection.submitTransaction(transaction);
}catch(error){
console.log(error);
throw error;
}
}
Currently the submitTransaction function is not returning anything. It is a bug or working as intended.
To go into more detail: When you delve through the source code of the composer you will finally get to the following code in composer-connector-hlfv1.
invokeChainCode(securityContext, functionName, args, options) {
const method = 'invokeChainCode';
LOG.entry(method, securityContext, functionName, args, options);
if (!this.businessNetworkIdentifier) {
return Promise.reject(new Error('No business network has been specified for this connection'));
}
// Check that a valid security context has been specified.
HLFUtil.securityCheck(securityContext);
// Validate all the arguments.
if (!functionName) {
return Promise.reject(new Error('functionName not specified'));
} else if (!Array.isArray(args)) {
return Promise.reject(new Error('args not specified'));
}
try {
args.forEach((arg) => {
if (typeof arg !== 'string') {
throw new Error('invalid arg specified: ' + arg);
}
});
} catch(error) {
return Promise.reject(error);
}
let txId = this._validateTxId(options);
let eventHandler;
// initialize the channel if it hasn't been initialized already otherwise verification will fail.
LOG.debug(method, 'loading channel configuration');
return this._initializeChannel()
.then(() => {
// check the event hubs and reconnect if possible. Do it here as the connection attempts are asynchronous
this._checkEventhubs();
// Submit the transaction to the endorsers.
const request = {
chaincodeId: this.businessNetworkIdentifier,
txId: txId,
fcn: functionName,
args: args
};
return this.channel.sendTransactionProposal(request); // node sdk will target all peers on the channel that are endorsingPeer
})
.then((results) => {
// Validate the endorsement results.
LOG.debug(method, `Received ${results.length} result(s) from invoking the composer runtime chaincode`, results);
const proposalResponses = results[0];
let {validResponses} = this._validatePeerResponses(proposalResponses, true);
// Submit the endorsed transaction to the primary orderers.
const proposal = results[1];
const header = results[2];
// check that we have a Chaincode listener setup and ready.
this._checkCCListener();
eventHandler = HLFConnection.createTxEventHandler(this.eventHubs, txId.getTransactionID(), this.commitTimeout);
eventHandler.startListening();
return this.channel.sendTransaction({
proposalResponses: validResponses,
proposal: proposal,
header: header
});
})
.then((response) => {
// If the transaction was successful, wait for it to be committed.
LOG.debug(method, 'Received response from orderer', response);
if (response.status !== 'SUCCESS') {
eventHandler.cancelListening();
throw new Error(`Failed to send peer responses for transaction '${txId.getTransactionID()}' to orderer. Response status '${response.status}'`);
}
return eventHandler.waitForEvents();
})
.then(() => {
LOG.exit(method);
})
.catch((error) => {
const newError = new Error('Error trying invoke business network. ' + error);
LOG.error(method, newError);
throw newError;
});
}
As you can see at the end, all that is happening is waiting for Events and Log.exit which return nothing. So currently you have to get your transaction result in another way.
The only way I could get something from my chaincode is through events. There's native interface that might be able to query for transaction data or something like this, but i haven't looked into it yet.
I want to set an http status code in my GraphQL authentication query, depending on if auth attempt was successful (200), unauthorised (401) or missing parameters (422).
I am using Koa and Apollo and have configured my server like so:
const graphqlKoaMiddleware = graphqlKoa(ctx => {
return ({
schema,
formatError: (err) => ({ message: err.message, status: err.status }),
context: {
stationConnector: new StationConnector(),
passengerTypeConnector: new PassengerTypeConnector(),
authConnector: new AuthConnector(),
cookies: ctx.cookies
}
})
})
router.post("/graphql", graphqlKoaMiddleware)
As you can see, I have set my formatError to return a message and status but currently only the message is getting returned. The error message comes from the error that I throw in my resolver function.
For example:
const resolvers = {
Query: {
me: async (obj, {username, password}, ctx) => {
try {
return await ctx.authConnector.getUser(ctx.cookies)
}catch(err){
throw new Error(`Could not get user: ${err}`);
}
}
}
}
My only issue with this method is it is setting the status code in the error message and not actually updating the response object.
Does GraphQL require a 200 response even for failed queries / mutations or can I some how update the response objects status code? If not, How do I set the aforementioned error object status code?
Unless the GraphQL request itself is malformed, GraphQL will return a 200 status code, even if an error is thrown inside one of the resolvers. This is by design so there's not really a way to configure Apollo server to change this behavior.
That said, you could easily wire up your own middleware. You can import the runHttpQuery function that the Apollo middleware uses under the hood. In fact, you could pretty much copy the source code and just modify it to suit your needs:
const graphqlMiddleware = options => {
return (req, res, next) => {
runHttpQuery([req, res], {
method: req.method,
options: options,
query: req.method === 'POST' ? req.body : req.query,
}).then((gqlResponse) => {
res.setHeader('Content-Type', 'application/json')
// parse the response for errors and set status code if needed
res.write(gqlResponse)
res.end()
next()
}, (error) => {
if ( 'HttpQueryError' !== error.name ) {
return next(error)
}
if ( error.headers ) {
Object.keys(error.headers).forEach((header) => {
res.setHeader(header, error.headers[header])
})
}
res.statusCode = error.statusCode
res.write(error.message)
res.end()
next(false)
})
}
}
For apollo-server, install the apollo-server-errors package. For authentication errors,
import { AuthenticationError } from "apollo-server-errors";
Then, in your resolver
throw new AuthenticationError('unknown user');
This will return a 400 status code.
Read more about this topic in this blog
as you can see here formatError doesn't support status code, what you could do is create a status response type with message and status fields and return the corresponding on your resolver.
Does GraphQL require a 200 response even for failed queries / mutations?
No, if the query fails it will return null and the error that you throw in the server side.
Try adding response and setting the response status code as so, assuming your err.status is already an integer like 401 etc.:
const graphqlKoaMiddleware = graphqlKoa(ctx => {
return ({
schema,
response: request.resonse,
formatError: (err) => {
response.statusCode = err.status;
return ({message: err.message, status: err.status})},
context: {
stationConnector: new StationConnector(),
passengerTypeConnector: new PassengerTypeConnector(),
authConnector: new AuthConnector(),
cookies: ctx.cookies
}
})})
Based on Daniels answer i have managed to write middleware.
import { HttpQueryError, runHttpQuery } from 'apollo-server-core';
import { ApolloServer } from 'apollo-server-express';
// Source taken from: https://github.com/apollographql/apollo-server/blob/928f70906cb881e85caa2ae0e56d3dac61b20df0/packages/apollo-server-express/src/ApolloServer.ts
// Duplicated apollo-express middleware
export const badRequestToOKMiddleware = (apolloServer: ApolloServer) => {
return async (req, res, next) => {
runHttpQuery([req, res], {
method: req.method,
options: await apolloServer.createGraphQLServerOptions(req, res),
query: req.method === 'POST' ? req.body : req.query,
request: req,
}).then(
({ graphqlResponse, responseInit }) => {
if (responseInit.headers) {
for (const [name, value] of Object.entries(responseInit.headers)) {
res.setHeader(name, value);
}
}
res.statusCode = (responseInit as any).status || 200;
// Using `.send` is a best practice for Express, but we also just use
// `.end` for compatibility with `connect`.
if (typeof res.send === 'function') {
res.send(graphqlResponse);
} else {
res.end(graphqlResponse);
}
},
(error: HttpQueryError) => {
if ('HttpQueryError' !== error.name) {
return next(error);
}
if (error.headers) {
for (const [name, value] of Object.entries(error.headers)) {
res.setHeader(name, value);
}
}
res.statusCode = error.message.indexOf('UNAUTHENTICATED') !== -1 ? 200 : error.statusCode;
if (typeof res.send === 'function') {
// Using `.send` is a best practice for Express, but we also just use
// `.end` for compatibility with `connect`.
res.send(error.message);
} else {
res.end(error.message);
}
},
);
};
}
app.use(apolloServer.graphqlPath, badRequestToOKMiddleware(apolloServer));
apollo-server-express V3 supports this. Create your own plugin. Then you can look in the errors that are thrown to determine the status code.
import {ApolloServerPlugin} from "apollo-server-plugin-base/src/index";
const statusCodePlugin:ApolloServerPlugin = {
async requestDidStart(requestContext) {
return {
async willSendResponse(requestContext) {
const errors = (requestContext?.response?.errors || []) as any[];
for(let error of errors){
if(error?.code === 'unauthorized'){
requestContext.response.http.status = 401;
}
if(error?.code === 'access'){
requestContext.response.http.status = 403;
}
}
}
}
},
};
export default statusCodePlugin;
Basically this is my react code
getDetails: function () {
var apiUrl = ConfigStore.get('api')
request
.get(apiUrl)
.set('X-Auth-Token', AuthStore.jwt)
.set('Accept', 'application/json')
.end(function (err, response) {
if (!err) {
if(response.text.indexOf("string") > -1){
this.dispatch('COMMAND1', response);
}
else {
this.dispatch('COMMAND2', response.body.options);
}
}
else {
this.dispatch('COMMAND3', response && response.body);
}
}.bind(this));
}
I've written an unit test for the above function of COMMAND1
it('Getting Latest Details', () => {
let eventSpy = sinon.spy();
require('superagent').__setMockResponse({
body: {
firstName: 'blah',
lastName: 'm ',
username: 'blah',
text: {
text : jest.fn()
}
}
});
let dispatchListener = AppDispatcher.register((payload) => {
if (payload.action.type === 'COMMAND1') {
eventSpy(payload.action.payload);
}
});
AuthStore.loggedIn = jest.genMockFunction().mockReturnValue(true);
AuthStore.getToken = jest.genMockFunction().mockReturnValue('545r5e45er4e5r.erereere');
MedsAlertsActions.getDetails();
expect(eventSpy.called).toBe(true);
dispatch('COMMAND1', data);
AppDispatcher.unregister(dispatchListener);
});
When i run
npm test myfile.test
I'm getting
TypeError: Cannot read property 'indexOf' of undefined
So how do i put the indexOf the response in my body? How to resolve the type error
How to write test cases for command2 and command3 as well.
I can see you're using sinon. You can create a sandbox and a fake server in it who return the response expected for each test case. Something like this, for example:
describe('your test suite', () => {
let sandbox;
let server;
beforeAll(() => {
sandbox = sinon.sandbox.create();
server = sandbox.useFakeServer();
});
it('Calls COMMAND1', () => {
//Sinon takes some ms to respond, so you have to use a setTimeout
setTimeout(
() => server.respond([200, { 'Content-Type': 'text/html' }, 'some string']),
0
);
// Put here your assertions
});
});
You can use server.restore() and sandbox.restore() to clean each one when you needed. Besides, you can access the requests made with sandbox.requests
Here's a great post that may help you: https://medium.com/#srph/axios-easily-test-requests-f04caf49e057, it's about axios, but you can implement it in the same way.
Also, you can know more about it at the official sinon documentation for sandboxes: http://sinonjs.org/releases/v1.17.7/sandbox