how to get property out of json response in cypress - json

i have cypress request call returning Json array
{ids:[one, two, three]}
How can i parse out one of the array values from the body of response and pass it to the next test?

Considering the given information I guess what you want is Asserting Network Calls from Cypress Tests.
There is a good example in the cypress-example-recipes
I guess you could do something like
describe('Test', () => {
let ids;
it('gets expected response', () => {
cy.server()
cy.route('GET', '/url').as('response')
cy.visit("url")
// log the request object
cy.get('#response').then(console.log)
// confirm the request status
cy.get('#response').should('have.property', 'status', 200)
// confirm the request's response
cy.get('#response').its('response').then((res) => {
expect(res.body).to.deep.equal({
"ids": ["one", "two", "three"]
})
// store the ids in a variable
ids = JSON.parse(res.body)?.ids
})
})
})

Related

Vue 3 how to send parameters as json to axios get

I have an api which I'm supposed to send a specific id as parameters to, so that it returns data based on the filtered list.
I tried to send it as :
await this.$store.dispatch("axiosGet",
{url: 'folder/api/property-walls'}, {propertyEid: this.id}).then(response => {
if (response.status === 'error') return
this.wallList = response.data.data.data
})
but it doesn't make any differences.
my API recieves sth like this.
can anyone help me out with the solution?
you can use params in your get requst
this will work!
axios.get('/api', {
params: {
foo: 'bar'
}
});
from this refrence
Axios get in url works but with second parameter as object it doesn't

Trying to dispatch an axios action with a string array as the payload, but keep getting 'undefined' at the reducer?

I'm new to web development and as part of a project have made a Django React Redux app. The frontentd has a component with form entry - when a form is submitted, the component calls an action that sends an axios request to a python twitter crawler script in the backend. The script returns a response containing a string array (the tweets are inside the array). I then try to dispatch the array contained in the response.data, as a payload to a reducer. However I keep getting an error saying that the payload of what I have dispatched is undefined.
This is the return statement of the python method that is called - corpus is a string array.
return JsonResponse({"results:": corpus})
This is the code for the action that sends a GET request to the python method. It's then returned the string array inside a json object.
// GET_TWEETS - get list of tweets from hashtag search
export const getTweets = (hashtag) => dispatch => {
axios
.get('http://localhost:8000/twitter_search', {
params: {text: hashtag}
})
.then(res => {
console.log(res.data); //check if python method returns corpus of tweets
//const results = Array.from(res.data.results);
dispatch({
type: GET_TWEET,
payload: res.data.results
});
})
.catch(err => console.log(err));
}
The console log shows that the object is returned successfully from the python script.
console log
This is the code for my reducer. I want my action to contain the string array and then assign that string array to 'tweets' in the state, so that I can return this to a component and then access the array from the component and then display contents of thisx array of tweets on the frontend
import { GET_TWEET } from '../actions/types';
const initialState = {
tweets: []
}
export default function(state = initialState, action) {
console.log(action.payload)
switch(action.type) {
case GET_TWEET:
return {
...state,
tweets: [...action.payload]
}
default:
return state;
}
}
Also, this is some of the code for the component that I want to receive the string array, I hope I have set this part up properly:
export class Tweets extends Component {
static propTypes = {
tweets: PropTypes.array.isRequired,
getTweets: PropTypes.func.isRequired
}
...
const mapStateToProps = state => ({
tweets: state.TweetsReducer.tweets
});
export default connect(mapStateToProps, { getTweets })(Tweets);
Here is the error I get from the console. Console logging the payload of the action also shows that its value is undefined: undefined error
I've been trying to solve this for several days now, but am completely lost and I have a hunch the solution to this is pretty simple...

Sending multiple reply messages on single postback in Facebook Messenger Bots

I want to send multiple replies for a single user-triggered postback on Messenger. I've been following Messenger's developer documentation and couldn't really find how to do this.
My code structure is very similar to the tutorials they've given on the site, I have a 'handlePostback' function which identifies the received postback and compares it to a set of predefined payloads to find the 'response' JSON object. This response is given to 'callSendAPI' which puts this JSON object into the basic format of sending the message back to the Messenger API.
function handlePostback(sender_psid,receivedPostback)
{ if(payload== 'defined_payload') {
response = {
text: 'Some text'
};
callSendAPI(sender_psid,response);
}
function callSendAPI(sender_psid,response) {
let body = {
recipient: {
id= sender_psid
},
message: response
};
// Followed by code for POST request to the webhook
}
This being the basic structure, now I want to send multiple messages as a reply to one postback. I did some digging, and I found that the solution might be to create a message [] array. But how do I do this? Because my 'response' is being generated through that function, and the messages structure should look like this (I think):
let body = {
recipient: {
id=sender_psid
},
messages: [ {
response1
},
{
response2
}
]
};
I hope I could explain my question, please let me know if I can provide more details!
Nice question. If you are not familiar with Node.js the way to do it is not too obvious and this is not documented well on Facebook's Send API Documentation.
Firstly, your approach of sending multiple messages, using an array, as you may have observed won't work. Facebook has a solution for sending up to 100 API Calls with one request but in my opinion this is not needed in your situation. If you want to find out more about it check out the Batched Request Documentation, you'll find out that the implementation is different than yours.
One solution that will work is to call the callSendAPI function multiple times. But this solution has one major drawback: You won't be able to control the actual sequence of the messages sent. For example if you want to send two separate messages, you cannot guarantee which will be sent first to the user.
To solve this issue you need to chain your callSendAPI functions in a way that guarantees that the next callSendAPI call will happen only after the first message is already sent. You can do this in NodeJS by using either callbacks or promises. If you are not familiar with either of them, you can read this for callbacks and this for promises.
You'll need to modify your callSendAPI function and especially the part that sends the POST request to Facebook. I will present a solution to your issue by using promises and the module node-fetch.
const fetch = require('node-fetch');
function handlePostback(sender_psid,receivedPostback){
if (payload == 'defined_payload') {
response = {
text: 'Some text'
};
response2 = //... Another response
response3 = //... Another response
callSendAPI(sender_psid,response).then(() => {
return callSendAPI(sender_psid, response2).then(() => {
return callSendAPI(sender_psid, response3); // You can add as many calls as you want
});
});
}
}
function callSendAPI(sender_psid,response) {
let body = {
recipient: {
id= sender_psid
},
message: response
};
const qs = 'access_token=' + encodeURIComponent(FB_PAGE_TOKEN); // Here you'll need to add your PAGE TOKEN from Facebook
return fetch('https://graph.facebook.com/me/messages?' + qs, {
method: 'POST',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify(body),
});
}
I found the below link useful to sort out the way to implement multiple responses on single post back.
https://codingislove.com/build-facebook-chat-bot-javascript/
Like you said, array should work. Create an array variable with multiple response messages
var multipleResponse = {
messages: [{
response1
},
{
response2
}]
};
And push the array variable to your function
function callSendAPI(sender_psid,response) {
let body = {
recipient: {
id= sender_psid
},
message: []
};
// Followed by code for POST request to the webhook
}
Finally push the array to your function array
body.message.push(multipleResponse.messages);
#Christos Panagiotakopoulos. I am not getting my mainMenuResponse which is chained using then. Rather, i am getting response thrice.
handlePostback function =>
// Handles messaging_postbacks events
function handlePostback(sender_psid, received_postback) {
let response;
// Get the payload for the postback
let payload = received_postback.payload;
// Set the response based on the postback payload
if (payload === 'fashionTip') {
response = { "text": getFashionTip() } // calls a function which gives a fashion-tip
// Send the message to acknowledge the postback
callSendAPI(sender_psid, response).then(() => {
return callSendAPI(sender_psid, mainMenuResponse)
});
callSendAPI function =>
// Sends response messages via the Send API
function callSendAPI(sender_psid, response) {
// construct the message body
let request_body = {
"recipient": {
"id": sender_psid
},
"message": response
}
// Send the HTTP request to the messenger platform
request({
"uri": "https://graph.facebook.com/v2.6/me/messages",
"qs": {"access_token": PAGE_ACCESS_TOKEN},
"method": "POST",
"json": request_body
}, (err, res, body) => {
if (!err) {
console.log("Message sent!");
} else {
console.error("Unable to send mesage:" + err);
}
});
}
Don't modify callSendAPI function. In your handlePostback function call callSendAPI multiple times.
callsendAPI(sender_psid,response1);
callsendAPI(sender_psid,response2);

RestEasy - JSON response - From Angular2 client, how to only get JSON Object

I'm new to REST services, I have an Angular2 client calling a RestEasy JAX-RS service. All I am trying to get is a "Hello World" message in JSON format. I was expecting only a JSON object, but I get my response with the following structure:
_body: "{"message":"Hello World!!"}"
headers: t
ok: true
status: 200
statusText: "OK"
type: 2
url: "http://localhost:8080/helloapp/rest/hello/world"
__proto__: ...
My question is, Is that the way it should be?
I mean, I thought I would be able to access the JSON object straight from the response. Something like
this.service.getHello()
.then( result => {
console.log(JSON.parse(result)); //{message: "Hello World"}
this.message = JSON.parse(result).message;
});
But I actually have to get it from _body:
this.service.getHello()
.then( result => {
this.message = JSON.parse(result._body).message;
console.log(this.message);//Hello World
});
Is it a RestEasy configuration thing, is there a way to change that?
Or
Should I consider that I will always have a field _body in my response with my data, and that's the default response structure?
For eventual consideration, here is my backend code:
HelloWorld Service:
#Path("/hello")
#Produces({ "application/json" })
#Consumes({ "application/json" })
public class HelloWorld {
public HelloWorld() {}
#GET
#Path("/world")
public Message getHello(){
return new Message("Hello World!!");
}
}
My RestEasy version is 3.1.1.Final running in Wildfly 10.1.0.Final
What you're getting back is the Response object from the Http request. This is what all Http operations will return. The easiest way to parse the JSON from that is to just call the json() method on it
this.service.getHello()
.then((res: Response) => {
let obj = res.json();
});
If you want the getHello to just return the object without having to parse it (on the calling client), then you can do it inside the getHello method by mapping it (using the Observable.map operation)
getHello() {
this.http.get(..)
.map((res: Response) => res.json())
.toPromise();
}
As peeskillet says above, you're getting back the entire Response from the request, and while sometimes you may want to examine the headers, perhaps to handle the different return conditions (retry or redirect on 4xx or 5xx responses for example), most of the time we assume a successful request and we just want the payload.
Angular2 encourages the use of Observables, so your service might look something like this:
getHello()
{
return this.http.get(http://localhost:8080/helloapp/rest/hello/world)
}
And your component may look something like this:
data: string;
ngOnInit() {
this.service
.getHello()
.map(response => response.json())
.subscribe (
data => {
this.data = data,
},
err => console.log('Error',err),
() => console.log('data',this.data)
);
}
You call the service, which is an http.get() and returns an Observable object, and we use .map to parse the response as JSON, which also returns an Observable, which we subscribe to.
Subscribe has three callback functions,
.subscribe(success, failure, complete)
In the example above on success we assign the payload - data - to this.data, if the subscribe fails, you log the error, and when it completes, we can do whatever we like, but in this case, we log this.data to the console - that's optional, but I log out the results while developing and then strip them out later.

Send non-stringified objects with fetch

I'm using the fetch-api for the first time and having trouble passing a non-stringified JSON objects to the server.
Basically I want to achieve the same behavior as this:
$.post(url, {"test": "test"}, function(response) {
console.log(response);
});
The fetch method is communicating with an web API which is unaccessable for me and expects a plain JSON object.
Normally I would just use FormData to pass data to the server, however the JSON will be transformed to a string [Object object]:
fetch(url, {
method: 'POST',
body: {"test": "test"}
})
.then(data => data.json())
.then(json => console.log(json))
.catch(e => console.error(e));
The body request seems to be empty when using $_POST (which is what the API is using), though gives the right value when using file_get_contents('php://input).
I though this had something to do with the wrong header given to the request. So I tried to add the header Ajax post uses: content-type:multipart/form-data;. However, this also did not get any value.
I was wondering if this was explicity intentional to not use plain JSON object to give as data, or that I'm simply missing something?
This does work, but is not allowed as it is a stringify version of the JSON object:
var formData = new FormData();
formData.append('data', JSON.stringify(data));
fetch(url, {
method: 'POST',
body: formData
})
.then(data => data.json())
.then(json => console.log(json))
.catch(e => console.error(e));
Let's say your data is inside a variable var data = { a: "some data", b: 123 }. If you want your code in PHP to access these fields this way:
$_POST["a"] == "some data";
$_POST["b"] == 123;
Then you need to send the data in the formData format this way:
var fdata = new FormData();
fdata.append('a', 'some data');
fdata.append('b', '123');
Now you can send that data and PHP will have access to separated fields a and b but notice b will be a string, not a number.
What if you want to send an array. Let's say { c: ['hello', 'world', '!'] }? You must follow PHP name conventions and add the same name multiple times:
var fdata = new FormData();
fdata.append('c[]', 'hello');
fdata.append('c[]', 'world');
fdata.append('c[]', '!');
After setting the form data instance, you can use it as the body of the request.
So firstly, I need to post to the POST-protocol, which is used by $_POST. I do this by adding a header of application/x-www-form-urlencoded (which is the protocol used by $_POST, as described in the docs) to the fetch post request:
fetch(url, {
headers: new Headers({'Content-Type': 'application/x-www-form-urlencoded'}), // Default header which $_POST listens to
...
Now the way $.post actually sends data is by creating a serialized string (eg: a%5Bone%5D=1) of the given object. To transform an object to a serialized string, you can use $.param:
fetch(url, {
headers: new Headers({'Content-Type': 'application/x-www-form-urlencoded'}), // Default header which $_POST listens to
method: 'POST',
body: $.param(data)
})
This will make you able to retreive data from $_POST like you would do with a simple $.post.