How to disable chromeWebSecurity in a certain test suite, in cypress - automated-tests

I am using cypress, and I want to disable chromeWebSecurity in test cases, but dont want change cypress config.
before each:
beforeEach('before test', () => {
Cypress.config('chromeWebSecurity',false);
cy.createUser('type').then((response) => {
ssoId = response.id;
phone = response.phone;
});
});
If I add ""chromeWebSecurity": false" in cypress config (cypress.json) - it works, but i dont want disable this in all my test suites.
I’m trying to add "Cypress.config('chromeWebSecurity',false);" before "cy.createUser('type').then((response) => {" in before each like this:
beforeEach('before test', () => {
Cypress.config('chromeWebSecurity',false);
cy.createUser('type').then((response) => {
ssoId = response.id;
phone = response.phone;
});
});
but it doesn’t work

According to cypress docs, you can add it as an option to the describe or it:
describe(
'login',
{
chromeWebSecurity: true
},
() => {
it('With webSecurity', () => {
// ...
})
it('Without webSecurity',
{chromeWebSecurity: false},
() => {
//...
}
)
}
)

Related

How can I get an array of URLs from the Cypress environment variable and then loop over them and run the tests for each one individually?

In my cypress.json file I have the following
{
"env":{
"urls":["https://somedomain/index.html","https://someotherdomain/index.html"]
}
}
Then in my spec.js file I have
describe('Test', () => {
Cypress.env('urls').forEach(url => {
before(() => {
cy.visit(url)
})
describe(`Current file: ${url}`, () => {
it('Contains Header Element', () => {
cy.get('header')
})
it('Contains Main Element', () => {
cy.get('main')
})
})
})
})
What I want to happen is to gets the first url from env.urls and runs all the tests against it, then gets the second url and runs all the tests against it. Instead it is visiting both urls first (which does makes sense since it is in the before block) and then running the tests afterwards. What is the correct way to structure this?
Incidentally, originally I tried to put the env.urls array into a .json file and retrieve it using cy.readFile() and then loop over the contents, but I couldn't figure out how to make that work at all since it wanted the cy.readFile() to be inside of a test.
To read URLs or any data outside a test, use require().
To explain the problem, Cypress merges consecutive before() hooks in the same block, but introducing a context block between them prevents it.
const urls = require('../fixtures/urls.json') // alternative to cy.readFile()
// data is read at test loading time
// instead of during the test
describe('Test', () => {
urls.forEach(url => {
describe(`Current file: ${url}`, () => { // multiple blocks define here
// one for each url
before(() => {
cy.visit(url)
})
it('Contains Header Element', () => {
...
})
it('Contains Main Element', () => {
...
})
})
})
})
The before block needs to be inside the describe block. Rest everything looks good.
Cypress.env('urls').forEach((url) => {
describe(`Test for ${url}`, () => {
before(() => {
cy.visit(url)
})
it('Contains Header Element', () => {
cy.get('header')
})
it('Contains Main Element', () => {
cy.get('main')
})
})
})

Getting parent and child document data from Firestore in a single Vue component

I have a parent (organisation) document in firestore and multiple child documents. I want load he data based on if the parent or child was clicked in the same component.
The below code works, the data is shown, but updates to the child organisations are not shown in real time (I have to reload to see it.). I'm guessing it is because I'm binding the array orgArray and not the object org that I actually use to display the data. Is there a way to just bind the object and not the whole array?
<template>
<div class="route-container">
<div class="item__container">
<FmisTitle/>
<Hero
:orgName="org.name"
:orgLogo="org.logo"
:orgState="org.state"
:orgNumber="org.number"
:orgType="org.type"
:orgDateStart="org.dateStart"
:orgDateEnd="org.dateEnd"
:orgDateStartF="org.dateStartFunctional"
:orgDateEndF="org.dateEndFunctional"
:orgCoverImage="org.coverImagex745"
:childRef="org.id"
:orgRef="orgRef"
/>
<Contact
:orgEmail="org.email"
:orgPhone="org.phoneNumber"
:orgAddress="org.address"
:orgWebsite="org.website"
:orgSocials="org.socials"
:childRef="org.id"
:orgRef="orgRef"
/>
<ButtonDuo/>
</div>
</div>
</template>
export default {
data() {
return {
org: {},
orgArray: [],
orgRef: '',
};
},
created() {
firebase.auth().onAuthStateChanged((user) => {
firestore.collectionGroup('people').where('userId', '==', user.uid).get().then((query) => {
query.forEach((userRef) => {
const orgRef = userRef.ref.parent.parent.id;
this.orgRef = orgRef;
if (!this.$route.params.parent) {
const organisation = firestore.collection('organisations').doc(orgRef).collection('childOrganisations').where('name', '==', this.$route.params.id);
this.$bind('orgArray', organisation).then((doc) => {
const org = doc[0];
this.org = org;
});
} else {
const organisation = firestore.collection('organisations').doc(orgRef);
this.$bind('org', organisation);
}
});
});
}, (error) => {
console.log(error);
});
},
}
I solved this by using the id from the childOrg and getting the data with that id, that way I could bind the data object directly.
firebase.auth().onAuthStateChanged((user) => {
firestore.collectionGroup('people').where('userId', '==', user.uid).get().then((query) => {
query.forEach((userRef) => {
const orgRef = userRef.ref.parent.parent.id;
this.orgRef = orgRef;
if (this.$route.query.parent !== 'true') {
firestore.collection('organisations').doc(orgRef).collection('childOrganisations').where('name', '==', this.$route.params.id)
.get()
.then((q) => {
q.forEach((ref) => {
const orgId = ref.id;
const organisation = firestore.collection('organisations').doc(orgRef).collection('childOrganisations').doc(orgId);
this.$bind('org', organisation);
});
});
} else {
const organisation = firestore.collection('organisations').doc(orgRef);
this.$bind('org', organisation);
}
});
});
}, (error) => {
console.log(error);
});

shouldn't I dispatch an action inside a .then statement?

I found a code on git which I'm trying to understand and in the code the guy have this function:
export function startAddTodo(text) {
return (dispatch, getState) => {
const UID = firebase.auth().currentUser.uid;
const todo = {
text,
isDone: false,
isStarred: false
};
const todoRef = firebaseRef.child(`todos/${UID}`).push(todo);
dispatch(addTodo({
id: todoRef.key,
...todo
}));
todoRef.then(snapshot => {
return;
}, error => {
Alert.alert(JSON.stringify(error.message));
});
};
}
Why shouldn't it be like
const todoRef = firebaseRef.child(`todos/${UID}`).push(todo);
todoRef.then(snapshot => {
dispatch(addTodo({
id: snapshot.key,
...todo
}));
})
I think this because the promise may be rejected, but in the first code he may get an error when trying to call todoRef.key inside the dispatch method.

ionic 3 alert button handler async issue

I am currently applying code on an error from an http.post call.
this.http.post('api here', {'email':this.username})
.subscribe(response => {
if(response === true){
localStorage.setItem('Username', this.username);
this.navCtrl.push(Page_1);
},
(error) => {
if(error == '404'){
let alert = this.alertCtrl.create({
title:'',
message:'',
buttons: [
{
text:'no',
handler: () => {
console.log('no clicked');
}
},
{
test:'yes',
handler: () => {
localStorage.setItem('Register_User',
this.username);
this.navCtrl.push(Page_2);
}
}
]
});
alert.present();
}}
})
So the problem i am having above, is that when i get a 404 error from the server and I want to direct them to page 2, it does not set the local storage register_username. My guess is, that this is an async thing, and its pushing to the page before it can set the storage. How do i resolve this?
If localStorage.setItem is Promise, then
handler: () => {
localStorage.setItem('Register_User', this.username)
.then(()=>{this.navCtrl.push(Page_2);})
}

Add Firebase image URL to my collection

I have the following method I'm accessing when my VueJS component is loading:
getServices () {
fb.servicesCollection.get().then(querySnapshot => {
this.serviceList = []
querySnapshot.forEach(doc => {
const { name, icon } = doc.data()
fb.storage.ref().child(icon).getDownloadURL().then(function (url) {
console.log(url)
})
this.serviceList.push({id: doc.id, name: name, icon: 'iconURL'})
})
this.isLoading = false
}).catch(error => {
console.log(error)
})
}
What I want to achieve is to get the url to replace the current 'iconURL' string. Didn't find any method to do that in the last couple of hours. Please help!
The following should do the trick. (However note that I could no test it, so it may need a bit of fine tuning... You can report how it works in the comments and we correct it if necessary)
Since you want to execute several getDownloadURL() asynchronous calls to Firebase Storage in parallel, you have to use Promise.all(), since getDownloadURL() returns a promise, see the doc.
getServices () {
let namesArray = []
let docIdArray = []
fb.servicesCollection.get().then(querySnapshot => {
this.serviceList = []
let promises = []
querySnapshot.forEach(doc => {
const icon = doc.data().icon;
promises.push(fb.storage.ref().child(icon).getDownloadURL())
namesArray.push(doc.data().name)
docIdArray.push(doc.id)
})
return Promise.all(promises)
})
.then(results => {
results.forEach((value, index) => {
this.serviceList.push({id: docIdArray[index], name: namesArray[index], icon: value})
})
})
}).catch(error => {
console.log(error)
})
}
This is how I got it in the end...
getServices () {
fb.servicesCollection.get().then(querySnapshot => {
this.serviceList = []
querySnapshot.forEach(doc => {
const { name, icon } = doc.data()
fb.storage.ref(icon).getDownloadURL().then(url => {
this.serviceList.push({id: doc.id, name: name, icon: url})
})
})
this.isLoading = false
}).catch(error => {
console.log(error)
})
}
Thank you for all your efforts to help me!!! Highly appreciate it!

Resources