Vuelidate pass array to not sameAs - vue.js

Ok I hope this has a simple solution.
I am trying to make a validation with Vuelidate on a field to be different than an array of strings.
So - sending a single string is working: not(sameAs(() =>"hello"))
But trying to send an array or comma seperated values wont validate anymore :not(sameAs(() => ["hello", "helloo"])) or not(sameAs(() => "hello", "helloo")).
Hopefully someone can help me, Thanks!

Alright if anyone is interested -
I just created my own validator ->
usedTitles:['hello','helloo'];
const checkDuplicates = () => this.usedTitles.indexOf(this.val) === -1;
val.unique = checkDuplicates;

Related

Push method in useState hook || REACT NATIVE

I have an array of items in a state variable like this.
const [items, setItems] = useState(["item1", "item2", "item3")])
How to replace one item in the array. Below is the method I have used to get it done.
{
let dummy = [...items]
dummy[1] = "items 1.1"
setItems(dummy)
}
But, I am thinking that this is not at all the right way to do this.
Is there any other simplified way to solve this? Thanks in Advance
Your solution is not wrong, but I would add an extra check to make sure that items array contains an element which you wish to change.
let dummy = [...items]
if(typeof dummy[1] == 'undefined') {
// does not exist
}
else {
// does exist
dummy[1] = "items 1.1"
}
setItems(dummy)
Or you can use slice
const idxToChange = 1
setItems([items.slice(0, idxToChange), "items 1.1", items.slice(idxToChange+1, items.length)])
A good explanation of slice
https://www.w3schools.com/jsref/jsref_slice_array.asp
Heres another way to do it. I don't know it's cleaner for you or not.
setItems(items=> items.map((item,idx)=> idx===1?"items 1.1":item));

Issue with getting data from an array of objects - vue.js / API / axios / proxy

First of all I'm using Vue.js to access data of an API using axios and a proxy
I'm trying to access the property of an object nested in the last array of several other arrays but I'm kinda hitting a wall, here's the detail :
Global details
the property I'm trying to access
I've tried different ways but here's my latest try :
axios
.get(proxyurl + history_url, {
reqHeaders
})
.then((reponse) => {
console.log(reponse.data)
this.lastItem = reponse.data.data.history[history.length-1]
console.log(this.lastItem)
this.lastEvol = this.lastItem.price
console.log(this.lastEvol)
})
The issue here is that the answer to "console.log(this.lastItem)" is :
lastItem answer
The value of the properties are now different and incorrect.
Since it's showing "Proxy" as the root object name I thought that may be the issue but I'm not sure.
I've tried several other ways to access this property but only had errors.
Any help would be greatly appreciated.
history is undefined in the history.length expression. Try this:
.then((reponse) => {
const history = reponse.data.data.history;
console.log(reponse.data)
this.lastItem = history[history.length-1]
console.log(this.lastItem)
this.lastEvol = this.lastItem.price
console.log(this.lastEvol)
})

Cypress Get Attribute value and store in Variable

I want to get the Attribute value and store in a variable how we can achieve this in cypress
In my case I want to get the complete class value and store it in variable.
This code just give me the attribute class value but how I can store the fetch value in variable
cy.get('div[class*="ui-growl-item-container ui-state-highlight ui-corner-all ui-shadow ui-growl-message"]').invoke('attr', 'class')
I was trying to compare the style of one element with another to make sure they were equal. Here's the code that seems to work for me.
cy.get('.searchable-group-selector-card-image')
.eq(4)
.invoke('attr', 'style')
.then(($style1) => {
const style1 = $style1
})
A good way to solve this kind of scenario is to use the alias mechanism. One could leverage this functionality to enqueue multiple elements and then check all of them together by chaining the results. I've recently come to a case in an SPA where the assertion had to happen between elements that were spread across different angular routes (call them different pages).
In your use case, this would like:
cy.get('.searchable-group-selector-card-image')
.eq(4)
.invoke('attr', 'style')
.as('style_1')
cy.get('.another-element')
.invoke('attr', 'style')
.as('style_2')
// later on for example you could do
cy.get('#style_1').then(style_1 => {
cy.get('#style_2').then(style_2 => {
// Both values are available and any kind of assertion can be performed
expect(style_1).to.include(style_2)
});
});
This is described in Variables and Aliases section of the Cypress Documentation.
Here is how I got the value of for attribute in a label tag which had text "Eat" inside.
cy.contains('Eat').then(($label) => {
const id = $label.attr('for');
}
Most important thing is to get the selector right, so it exactly finds the value you are looking for. In this case you already found it. By using then() gives you the ability to store it in a variable.
cy.get('div[class*="ui-growl-item-container ui-state-highlight ui-corner-all ui-shadow ui-growl-message"]').invoke('attr', 'class')
.then($growl-message => {
const message = $growl-message.text()
//do the checks with the variable message. For example:
cy.contains(message)
})
Note that the scope of the variable is within the curly brackets. Thus using the variable has to be within those curly brackets.

Checking button text matches a certain string in Nightwatch.js

I'm having a heck of a time trying to write a test where I check that text on a button matches a certain string. I tried ".valueContains", ".attributeContains" and got blank or null, and I've tried getText(), but that only seems to return an object.
I feel like it's something obvious I'm missing, so any help would be appreciated!
Based on what you have written so far in your question, I am wondering if there is there a reason you cannot use .containsText?
.waitForElementVisible('.yourclass', this.timeout)
.assert.containsText('.yourclass', 'Text of Button you expect to match')
http://nightwatchjs.org/api#assert-containsText
Without actually looking at the code its little difficult to predict whats going on. However all of the methods in selenium return a promise, so you need to wait for it to resolve.
function async getTextOfButton() {
const element = await driver.findElement(By.className('item-class'));
const text = await element.getText();
}
If you are not using async/await you could do
driver.findElement(By.className('item-class')).then(function(element) {
element.getText().then(function(text) {
console.log(text);
});
});

KoLite asyncCommand accessing element data

So I'm displaying a observable array in my view, and I want to be able to remove an element from that list using asyncCommand. However, I'm not sure how I should be getting that element. Is there a way of accessing or passing the selected element into the asyncCommand method?
Thanks for the input
addGroupCmd = ko.asyncCommand({
execute: function (data, complete) {
//access your observable here with the data object
//EX. var demo = data.id();
},
canExecute: function (isExecuting) {
return !isExecuting && isEditing();
}
}),
Ok, so I figured it out with it little bit of google's help. All you have to do is pass in the data parameter and ko.lite will figure out what object your talking about. pretty nice, not really sure how it works, but it does.