I can set client prop for Query element without problem.
<Query client={Apollo.localClient} query={...
but I can't get it working here, tried it in multiple locations:
export default graphql(SET_APP_STATE, {
props: ({mutate}) => ({
localSetAppState: appState => mutate(
{
variables: {appState},
client:Apollo.localClient
}),
})
,options:{client:Apollo.localClient}})(App as any);
Related
I have a component that uses the Apollo Angular client to fetch some data. I'm trying to write tests for it to check how it responds to different types of data.
However there does seem to be a way to change the response data after the first time (I'm assuming due to caching). Is there a way to clear the cache while testing or force it to not use the cache?
My code looks something like this
describe('TestComponent', () => {
let apollo: ApolloTestingController;
let component: UserDetailsComponent;
let fixture: ComponentFixture<UserDetailsComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [
ApolloTestingModule,
],
declarations: [TestComponent],
})
.compileComponents();
apollo = TestBed.get(ApolloTestingController);
fixture = TestBed.createComponent(TestComponent);
component = fixture.componentInstance;
}));
it('should work with data type 1', () => {
apollo.expectOne('TestQuery').flush({
data: {
something: 'test 1',
},
});
});
it('should work with data type 2', () => {
// Fails to match here
apollo.expectOne('TestQuery').flush({
data: {
something: 'test 2',
},
});
});
});
I found that you can do something like this
const apolloClient = TestBed.get(Apollo).getClient();
await apolloClient.clearStore();
I am trying to create array in cookies . so it can be updated on every click. I have created cookies but don't no how can i add multiple values in cookies.
my code is :
import cookie from 'cross-cookie';
handlePressProduct(id) {
cookie.set('cart', { product_id: 1234 ,qty: 1,customer_id: isuerID},{product_id: id ,qty: 2})
.then(() => console.log('cookie set!'));
cookie.get('cart')
.then(value => alert(value));
}
how can i use multiple values in cookies ?
I have tried this and its working fine for me .
var data = {};
data[id] = {product_id: id ,qty: 1,customer_id: isuerID};
cookie.set(data)
.then(() => console.log('cookies set!'));
});
cookie.getAll().then(function(cookies){
alert(JSON.stringify(cookies))
})
I am trying to set up a unit test as following :
import Vue from 'vue'
import ChangeTitleComponent from '#/components/ChangeTitleComponent'
import store from '#/vuex/store'
describe('ChangeTitleComponent.vue', () => {
describe('changeTitle', () => {
var component
beforeEach(() => {
var vm = new Vue({
template: '<div><h2>{{ title }}</h2> <change-title-component :title="title" :id="id"></change-title-component></div>',
components: {
ChangeTitleComponent
},
props: ['title', 'id'],
store
}).$mount()
component = vm.$refs.changetitlecomponent
})
component.title = 'Groceries'
component.id = '1'
it('should log the component', () => {
console.log('CHANGE TITLE COMPONENT: ', component)
})
})
})
but when I run it, I get an error ...
Uncaught TypeError: Cannot set property 'title' of undefined Uncaught TypeError: Cannot set property 'title' of undefined
Why my component is 'undefined ' ?
thanks for feedback
The main problem is that you forgot to add ref attribute to the component in template, so in fact property changetitlecomponent doesn't exist on vm.$refs.
This should fix problem.
<change-title-component ref="changetitlecomponent" :title="title" :id="id"></change-title-component>
Found by author: Setting the properties to the component object should
be moved into the it block of unit test.
I am using Ionic 2 rc4. I am following the advise here and am trying to do the following:
import { NavController } from 'ionic-angular';
...
this.nav.present(this.loading).then(() => {
However, to me it looks like the NavController does not have a present function, because I get:
[ts] Property 'present' does not exist on type 'NavController'.
any
Am I correct, or am I doing something wrong? How do they get to access this "phantom" function?
Any advise appreciated.
UPDATE
Here is my code that results in the following error (on this.loading.present().then(() => {):
"Cannot read property 'nativeElement' of null"
It presents loading the first time. but after the alert is presented if submit() is run again, it gets this error.
submit() {
this.loading.present().then(() => {
let alert = this.alertCtrl.create({
title: 'Verify Email',
subTitle: 'Please verify your email address before you log in.',
message: 'Check your Spam folder if you cannot find the email.',
buttons: [
{
text: 'Resend',
handler: data => {
firebaseUser.sendEmailVerification().then((data) => {
this.doAlert('Verify Email', 'Verification Email Sent.').then((data) => {
//navCtrl.setRoot(navCtrl.getActive());
});
});
}
},
{
text: 'Okay',
handler: data => {
//navCtrl.setRoot(navCtrl.getActive());
}
}
]
});
alert.present();
this.loading.dismiss();
});
}
Looking at this changelog for Beta 11
They have removed present function from Navcontroller.
You need to refactor your code and use some other function based on your requirement.
this.loading.present()
For the error, check the Loading controller docs.
Note that after the component is dismissed, it will not be usable
anymore and another one must be created. This can be avoided by
wrapping the creation and presentation of the component in a reusable
function
Just do :
this.loading = this.loadingCtrl.create({
//loading properties
});
inside submit() before this.loading.present()
In my application, I have to update a record (eventToUpdate) with the data from another object (updatedEvent). To do this, I use the following code:
editEvent (updatedEvent, eventToUpdate) {
eventToUpdate.set('name', updatedEvent.name);
eventToUpdate.set('matching', updatedEvent.matching);
eventToUpdate.set('dcfEvent', updatedEvent.dcfEvent);
eventToUpdate.save().then(() => {
toastr.success('Event updated');
}).catch((error) => {
toastr.error('There occured an error while trying to update the event');
console.log(error);
});
},
When I try to update the event, I get the following error:
Assertion Failed: You must use Ember.set() to set the `name` property (of [object Object]) to `DCF tests`."
I have also tried setting the values with Ember.set, like this:
Ember.set(eventToUpdate, 'name', updatedEvent.name);
But that gives the same result..
I use Ember.js 1.13
It seems that eventToUpdate is not an Ember Object and someone is watching this property. So use Ember.set to set values:
editEvent (updatedEvent, eventToUpdate) {
Ember.set(eventToUpdate, 'name', updatedEvent.name);
Ember.set(eventToUpdate, 'matching', updatedEvent.matching);
Ember.set(eventToUpdate, 'dcfEvent', updatedEvent.dcfEvent);
eventToUpdate.save().then(() => {
toastr.success('Event updated');
}).catch((error) => {
toastr.error('There occured an error while trying to update the event');
console.log(error);
});
},
The problem lied in the structure of my data. I was trying to edit sub events, which are part of a root event. The problem was solved by first loading the single subevent from the backend and then editing that single subevent. It looks somewhat like this:
var event = this.store.findRecord('event', subevent.id);
event.set('name', updatedEvent.name);
event.set('matching', updatedEvent.matching);
event.save().then(() => {
toastr.success('element successfully updated');
}).catch((error) => {
console.log(error);
});