I am looking for the best way to match the following:
expect([
{
C1: 'xxx',
C0: 'this causes it not to match.'
}
]).to.deep.include.members([
{
C1: 'xxx'
}
]);
The above doesn't work because C0 exists in the actual, but not the expected. In short, I want this expect to PASS, but I'm not sure how to do it without writing a bunch of custom code...
chai-subset or chai-fuzzy might also perform what you're looking for.
Chai-subset should work like this:
expect([
{
C1: 'xxx',
C0: 'this causes it not to match.'
}
]).to.containSubset([{C1: 'xxx'}]);
Personally if I don't want to include another plugin I will use the property or keys matchers that chai includes:
([
{
C1: 'xxx',
C0: 'this causes it not to match.'
}
]).forEach(obj => {
expect(obj).to.have.key('C1'); // or...
expect(obj).to.have.property('C1', 'xxx');
});
without plugins:
http://chaijs.com/api/bdd/#method_property
expect([
{
C1: 'xxx',
C0: 'this causes it not to match.'
}
]).to.have.deep.property('[0].C1', 'xxx');
Clean, functional and without dependencies
simply use a map to filter the key you want to check
something like:
const array = [
{
C1: 'xxx',
C0: 'this causes it not to match.'
}
];
expect(array.map(e=>e.C1)).to.include("xxx");
https://www.chaijs.com/api/bdd/
======
Edit: For more readability, abstract it into a utility function:
// test/utils.js
export const subKey = (array, key) => array.map(e=>e[key]);
Then import it in your test, which can be read as a sentence:
expect(subKey(array,"C1")).to.include("xxx");
There are a few different chai plugins which all solve this problem. I am a fan of shallow-deep-equal. You'd use it like this:
expect([
{
C1: 'xxx',
C0: 'this causes it not to match.'
}
]).to.shallowDeepEqual([
{
C1: 'xxx'
}
]);
I believe the simplest (and certainly easiest) way would be to:
var actual=[
{
C1:'xxx',
C0:'yyy'
}
];
actual.forEach(function(obj){
expect(obj).to.have.property('C1','xxx');
});
You can use pick and omit underscore functions to select/reject properties to test:
const { pick, omit } = require('underscore');
const obj = {
C1: 'xxx',
C0: 'this causes it not to match.',
};
it('tests sparse object with pick', () => {
expect(pick(obj, 'C1')).to.eql({ C1: 'xxx' });
});
it('tests sparse object with omit', () => {
expect(omit(obj, 'C0')).to.eql({ C1: 'xxx' });
});
I wrote chai-match-pattern and lodash-match-pattern to handle partial matching (and many more) deep matching scenarios.
var chai = require('chai');
var chaiMatchPattern = require('chai-match-pattern');
chai.use(chaiMatchPattern);
// Using JDON pattern in expectation
chai.expect([
{
C1: 'xxx',
C0: 'this causes it not to match.'
}
]).to.matchPattern([
{
C1: 'xxx',
'...': ''
}
]);
// Using the slightly cleaner string pattern notation in expectation
chai.expect([
{
C1: 'xxx',
C0: 'this causes it not to match.'
}
]).to.matchPattern(`
[
{
C1: 'xxx',
...
}
]
`
);
Slightly updated version of #RobRaisch because for empty comparison giving error because '' not equal ""
let expected = {
dateOfBirth: '',
admissionDate: '',
dischargeDate: '',
incidentLocation: null
};
Object.keys(expected).forEach(function(key) {
expect(actual[key]).to.equal(expected[key]);
});
In case, you need to use it with spy and called.with, please check this answer : https://stackoverflow.com/a/58940221/1151741
for example
expect(spy1).to.have.been.called.with.objectContaining({ a: 1 });
Related
I'm using Vue 3 for sending POST data to my API. The objects look like
const externalResults: ref(null)
const resource = ref({
id: null,
name: null,
state: {}
})
Before sending the data to the API I'm parsing the resource object to avoid sending a nested object related to state property. So the payload sent looks like
{
id: 1,
name: 'Lorem ipsum',
state_id: 14
}
The API returns a 422 in case of missing/wrong data
{
"message":"Some fields are wrong.",
"details":{
"state_id":[
"The state_id field is mandatory."
]
}
}
So here comes the question: how can I rename object keys in order to remove always the string _id from keys?
Since I'm using vuelidate I have to "map" the returned error details to model property names. Now I'm doing this to get details once the request is done
externalResults.value = e.response.data.details
but probably I will need something like
externalResults.value = e.response.data.details.map(item => { // Something here... })
I'd like to have a 1 line solution, no matter if it uses ES6 or lodash.
Please note that state_id is just a sample, there will be many properties ended with _id which I need to remove.
The expected result is
externalResults: {
"state":[
"The state_id field is mandatory."
]
}
I don't know how long you allow your one-liners to be, but this is what I come up with in ECMAScript, using Object.entries() and Object.fromEntries() to disassemble and reassemble the object:
const data = {
id: 1,
name: 'Lorem ipsum',
state_id: 14
};
const fn = (x) => Object.fromEntries(Object.entries(x).map(([k, v]) => [k.endsWith('_id') ? k.slice(0, -3) : k, v]));
console.log(fn(data));
You can shorten it a little more by using replace() with a regex:
const data = {
id: 1,
name: 'Lorem ipsum',
state_id: 14
};
const fn = (x) => Object.fromEntries(Object.entries(x).map(([k, v]) => [k.replace(/_id$/, ''), v]));
console.log(fn(data));
If you use lodash, you can go shorter still by using the mapKeys() function:
const data = {
id: 1,
name: 'Lorem ipsum',
state_id: 14
};
const fn = (x) => _.mapKeys(x, (v, k) => k.replace(/_id$/, ''));
console.log(fn(data));
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js"></script>
I am using ionic 4. I get the result from the API then get the result show like this
[
{"name":John,"age":20},
{"name":Peter,"age":35},
{"name":Alex,"age":15}
]
But I want to get the name only to check whether have same name with my condition or not. But I cannot straight a way get the result from the API, I need to hard code to do comparison. Here is my code:
this.http.get(SERVER_URL).subscribe((res) => {
const data = [
{ name: John, age: 21 },
{ name: Thomas, age: 25 },
];
const ppl= data.find(people=> people.name === 'alex');
console.log(ppl);
});
So, My first question is How to get the name from the API directly, not like now I hard code the result from API. My Second Question is when I do comparison I want to show the result 'already exist' or 'can use this name'. Because if I write my code like this I will get the error Type 'void' is not assignable to type 'boolean':
const ppl= data.find((people)=> {
if(people.name === 'alex') {
this.text = 'already exist'
} else {
this.text = 'can use this name'
}});
console.log(ppl);
Anyone can help me? Thank you very much
Instead of defining data, use the contents of the response; res will have the exact same contents that you are declaring in data.
this.http.get(SERVER_URL).subscribe(res => {
// If successful, res is an array with user data like the following
// [
// {name: "John", age: 21},
// {name: "Thomas", age: 25},
// ...
// ]
if (res.find(user => user.name === 'alex')) {
console.log ('Username has been taken');
} else {
console.log('Username is available');
}
});
Taken from the MDN docs on Array.prototype.find():
The find() method returns the value of the first element in the array that satisfies the provided testing function. Otherwise undefined is returned.
In that case
res.find(user => user.name === 'alex')
will return a user object if any of the usernames match alex, or undefined if none of the user.name attributes match alex.
undefined evaluates to false and a user object evaluates to true in the conditional.
Keep in mind that you are comparing strings with ===, so, for example, Alex will not match alex, if you want to look into other ways to compare strings, have a look at this question.
You also might want to handle errors, how you handle them is up to you, and it will depend on the response, but you can access the error inside your subscribe like this:
this.http.get(SERVER_URL).subscribe(res => {
if (res.find(user => user.name === 'alex')) {
console.log ('Username has been taken');
} else {
console.log('Username is available');
}
}, error => {
console.log(error);
}, () => {
// There is also a 'complete' handler that triggers in both cases
});
Edit. API returns Object not array
If your API returns an Object instead of an array like in your question, you can still iterate over the properties
this.http.get(SERVER_URL).subscribe(res => {
// If successful, res is an array with user data like the following
// {
// key1: {name: "John", age: 21},
// key2: {name: "Thomas", age: 25},
// ...
// }
let match = false;
Object.keys(res).forEach(key => {
if (res[key].name === 'alex') {
match = true;
}
});
if (match) {
console.log ('Username has been taken');
} else {
console.log('Username is available');
}
});
Instead of Object.keys() you could use Object.values() to get an array with user objects, then use find() as before, but that seems less efficient, something like this:
if (Object.values(res).find(user => user.name === 'alex')) {
console.log ('Username has been taken');
} else {
console.log('Username is available');
}
So, I will go straight to the point. I am getting such data from api:
[
{
id: 123,
email: asd#asd.com
},
{
id: 456,
email: asdasd.com
},
{
id: 789,
email: asd#asd
},
...
]
and I should validate email and show this all info in a list, something like this:
asd#asd.com - valid
asdasd.com - invalid
asd#asd - invalid
...
My question is what is the best way to store validation data in a store? Is it better to have something like "isValid" property by each email? I mean like this:
store = {
emailsById: [
123: {
value: asd#asd.com,
isValid: true
},
456: {
value: asdasd.com,
isValid: false
},
789: {
value: asd#asd,
isValid: false
}
...
]
}
or something like this:
store = {
emailsById: [
123: {
value: asd#asd.com
},
456: {
value: asdasd.com
},
789: {
value: asd#asd
}
...
],
inValidIds: ['456', '789']
}
which one is better? Or maybe there is some another better way to have such data in store? Have in mind that there can be thousands emails in a list :)
Thanks in advance for the answers ;)
I recommend reading the article "Avoiding Accidental Complexity When Structuring Your App State" by Tal Kol which answers exactly your problem: https://hackernoon.com/avoiding-accidental-complexity-when-structuring-your-app-state-6e6d22ad5e2a
Your example is quite simplistic and everything really depends on your needs but personally I would go with something like this (based on linked article):
var store = {
emailsById: {
123: {
value: '123#example.com',
},
456: {
value: '456#example.com',
},
789: {
value: '789#example.com',
},
// ...
},
validEmailsMap: {
456: true, // true when valid
789: false, // false when invalid
},
};
So your best option would be to create a separate file that will contain all your validations methods. Import that into the component you're using and then when you want to use the logic for valid/invalid.
If its something that you feel you want to put in the store from the beginning and the data will never be in a transient state you could parse your DTO through an array map in your reducer when you get the response from your API.
export default function (state = initialState, action) {
const {type, response} = action
switch (type) {
case DATA_RECIEVED_SUCCESS:
const items = []
for (var i = 0; i < response.emailsById.length; i++) {
var email = response.emailsById[i];
email.isValid = checkEmailValid(email)
items.push(email)
}
return {
...state,
items
}
}
}
However my preference would be to always check at the last moment you need to. It makes it a safer design in case you find you need to change you design in the future. Also separating the validation logic out will make it more testable
First of all, the way you defined an array in javascript is wrong.
What you need is an array of objects like,
emails : [
{
id: '1',
email: 'abc#abc.com',
isValid: true
},
{
id: '2',
email: 'abc.com',
isValid: false;
}
];
if you need do access email based on an id, you can add an id property along with email and isValid. uuid is a good way to go about it.
In conclusion, it depends upon your use case.
I believe, the above example is a good way to keep data in store because it's simple.
What you described in your second example is like maintaining two different states. I would not recommend that.
I am new to Gun. I have existing code that very effectively reduces an array of objects based on a pattern. I am thinking I should tweak this to run in the context of Gun's .map and return undefined for non-matches. I think I will also have to provide two arguments, one of which is the where clause and the other the properties I want shown on returned objects. I also presume that if I use .on future matches will automagically get spit out! Am I on the right path?
const match = (object,key,value) => {
const type = typeof(value);
if(value && type==="object") {
return Object.keys(value).every(childkey =>
match(object[key],childkey,value[childkey]));
if(type==="function") return value(object[key]);
return object[key]===value;
}
const reduce = (objects,where) => {
const keys = Object.keys(where);
return objects.reduce((accumulator,current) => {
if(keys.every(key => match(current,key,where[key]))) {
accumulator.push(current);
}
return accumulator;
},[]);
}
let rows = reduce([{name: "Joe",address:{city: "Seattle"},age:25},
{name: "Mary",address:{city: "Seattle"},age:16},
{name: "Joe",address:{city: "New York"},age:20}],
{name: () => true,
address: {city: "Seattle"},
age: (age) => age > 10});
// results in
[{name: "Joe",address:{city: "Seattle"},age:25},
{name: "Mary",address:{city: "Seattle"},age:16}]
Further exploration of this resulted in the code below, which is stylistically different, but conforms to the immediate responsive nature of Gun. However, it is unclear how to deal with nested objects. The code below only works for primitives.
const match = (object,key,value) => {
const type = typeof(value);
if(!object || typeof(object)!=="object") return false;
if(value && type==="object") {
const child = gun.get(object[key]["#"]);
for(let key in value) {
const value = {};
child.get(key).val(v => value[key] = v,{wait:0});
if(!match(value,key,value[key])) return;
}
}
if(type==="function") return value(object[key]);
return object[key]===value;
}
const gun = Gun(["http://localhost:8080/gun"]),
users = [{name: "Joe",address:{city: "Seattle"},age:25},
{address:{city: "Seattle"},age:25},
{name: "Mary",address:{city: "Seattle"},age:16},
{name: "Joe",address:{city: "New York"},age:20}];
//gun.get("users").map().put(null);
for(let user of users) {
const object = gun.get(user.name).put(user);
gun.get("users").set(object);
}
gun.get("users").map(user => {
const pattern = {name: (value) => value!=null, age: (age) => age > 20}; //, address: {city: "Seattle"}
for(let key in pattern) {
if(!match(user,key,pattern[key])) return;
}
return user;
}).on(data => console.log(data));
Yes. GUN's .map method does more than what it seems.
Say we have var users = gun.get('users'). We can do:
users.map() with no callback acts like a forEach because the default callback is to return the data as-is.
users.map(user => user.age * 2) with a callback, it lets you transform the data like you would expect from a map, except where:
users.map(function(){ return }) if you return undefined, it will filter out that record.
WARNING: As of the current time, .map(transform) function is currently experimental and my have bugs with it. Please try it and report any you find.
Now we can combine it with some other methods, to get some cool behavior:
users.map().on(cb) will get current and future users as they are added to the table, and gets notified for updates on each of those users.
users.map().val(cb) will get current and future users as they are added to the table, but only gets each one once.
users.val().map().on(cb) gets only the current users (not future), but gets the updates to those users.
users.val().map().val(cb) gets only the current users (not future), and only gets them once.
So yes, you are on the right track. For instance, I have a test in gun core that does this:
list.map(user => user.age === 27? user.name + "thezombie" : u).on(function(data){
// verify
});
list.set({name: 'alice', age: 27});
list.set({name: 'bob', age: 27});
list.set({name: 'carl', age: 29});
list.set({name: 'dave', age: 25});
This creates a live map that filters the results and locally (view only) transforms the data.
In the future, this is how the SQL and MongoDB Mango query extensions will work for gun.
Note: GUN only loads the property you request on an object/node, so it is bandwidth efficient. If we do users.map().get('age') it will only load the age value on every user, nothing else.
So internally, you can do some efficient checks, and if all your conditionals match, only /then/ load the entire object. Additionally, there are two other options: (1) you can use an in-memory version of gun to create server-side request-response patterns, so you can have server-side filtering/querying that is efficient. (2) if you become an adapter developer and learn the simple wire spec and then write your own custom query language extensions!
Anything else? Hit me up! More than happy to answer.
Edit: My reply in the comments, comments apparently can't have code. Here is pseudo-code of how to "build up" more complex queries, which will be similar to how SQL/Mango query extensions will work:
mutli-value & nested value matching can be "built up" from this as the base, but yes, you are right, until we have SQL/Mango query examples, there isn't a simple/immediate "out of the box" example. This is pseudo code, but should get the idea across:
```
Gun.chain.match = function(query, cb){
var gun = this;
var fields = Object.keys(query);
var check = {};
fields.forEach(function(field){
check[field] = true;
gun.get(field).val(function(val){
if(val !== query[field]){ return }
check[field] = false;
//all checks done?
cb(results)
});
});
return gun;
}
```
Solution, the trick is to use map and not val:
Gun.chain.match = function(pattern,cb) {
let node = this,
passed = true,
keys = Object.keys(pattern);
keys.every(key => {
const test = pattern[key],
type = typeof(test);
if(test && type==="object") {
node.get(key).match(test);
} else if(type==="function") {
node.get(key).map(value => {
if(test(value[key])) {
return value;
} else {
passed = false;
}
});
} else {
node.get(key).map(value => {
if(value[key]===test) {
return value;
} else {
passed = false;
}
});
}
return passed;
});
if(passed && cb) this.val(value => cb(value))
return this;
}
const gun = new Gun();
gun.get("Joe").put({name:"Joe",address:{city:"Seattle"},age:20});
gun.get("Joe").match({age: value => value > 15,address:{ city: "Seattle"}},value => console.log("cb1",value));
Happy New Year...
I am extremely new to RN and am building a small app to get a feel for it.
I am trying to figure out if there is a way to clean this part up.
Below I have a nested multidimensional object state in the constructor and a reset function.
I have four input fields and a plain text area which I update dynamically based on a result.
Now whilst this works it feels not so clean, say if I wanted to add another nested multidimensional object state which sets different default values on reset I am going to have to add another if block to handle that so the it compounds the problem even further.
Any thoughts how to improve this or am I going about it the wrong way :/
constructor(props) {
super(props)
this.state = {
input1: '',
input2: '',
input3: '',
input4: '',
result: {
'ratio': 0,
'style': '',
},
}
}
reset() {
let newState = {};
for (const field of Object.keys(this.state)) {
if (field == 'result') {
this.setState({
result: {
ratio: 0,
style: '',
}
});
continue;
}
newState[field] = '';
}
this.setState(newState);
}
** edit **
To make it clearer if I add another multidimensional object to the state I will need to include another if statement
for (const field of Object.keys(this.state)) {
if (field == 'reset') {
// ...
}
if (field == 'extra') {
// ...
}
newState[field] = '';
}
Ideally what I need is a copy of this.state before its updated then just restore the copy which has the default parameters this.setState(copy)
Many thanks.
I am not entirely sure what you mean by 'nested', but here are a couple of suggestions:
reset() {
let newState = {};
for (const field of Object.keys(this.state)) {
if (field == 'result') {
newState.result = {
ratio: 0,
style: '',
};
}else{
newState[field] = '';
}
}
this.setState(newState);
}
Looping this way you avoid triggering multiple renders since you only call setState once.
Edit: If you want to avoid checking for fields with known names, you can just access those directly. 'Wrap' all your inputs in a new entry in the state, and just loop through that one:
constructor(props) {
super(props)
this.state = {
inputs:{
input1: '',
input2: '',
input3: '',
input4: '',
},
result: {
'ratio': 0,
'style': '',
},
extra = {
extraKey: 1,
}
}
}
reset() {
let newState = {};
newState.result = {ratio: 0, style: ''};
newState.extra = // ...
newState.inputs = {};
for (const field of Object.keys(this.state.inputs)) {
newState.inputs[field] = '';
}
this.setState(newState);
}
It is a bit cumbersome to use a loop to update the keys in an object, but I cannot think of a simpler solution when the key names are not known in advance.