Skip to content

Instantly share code, notes, and snippets.

@jlami
Last active September 7, 2018 02:39
Show Gist options
  • Save jlami/8699e6c887c9eb2cb4344fb1d2551dbe to your computer and use it in GitHub Desktop.
Save jlami/8699e6c887c9eb2cb4344fb1d2551dbe to your computer and use it in GitHub Desktop.
Ember-data promise proxy bug
import DS from 'ember-data';
import { Promise as EmberPromise } from 'rsvp';
export default DS.Adapter.extend({
deleteRecord() {
console.log('deleting', arguments);
return EmberPromise.resolve();
},
});
import Ember from 'ember';
export default Ember.Component.extend({
didUpdateAttrs() {
this._super(...arguments);
this.incrementProperty('counter');
},
counter: 0,
});
import Ember from 'ember';
import {inject as service} from '@ember/service';
import EmberObject, {computed} from '@ember/object';
export default Ember.Controller.extend({
appName: 'Ember Twiddle',
store: service(),
posts: computed(function() {
return this.store.peekAll('post');
}),
init() {
this._super(...arguments);
this.set('ref', EmberObject.create({something: 0}));
},
ref: null,
actions: {
updateProp() {
this.incrementProperty('test');
},
updateRef() {
let ref = this.ref;
ref.incrementProperty('something');
//ref.something = (ref.something || 0) + 1;
this.notifyPropertyChange('ref');
},
},
});
import Model from 'ember-data/model';
import attr from 'ember-data/attr';
import { belongsTo, hasMany } from 'ember-data/relationships';
export default Model.extend({
name: attr('string'),
tags: hasMany('tag'),
});
import Model from 'ember-data/model';
import attr from 'ember-data/attr';
import { belongsTo, hasMany } from 'ember-data/relationships';
export default Model.extend({
name: attr('string'),
post: belongsTo('post'),
});
import Ember from 'ember';
export default Ember.Route.extend({
model() {
this.store.push({
data: [
{
id: '1',
type: 'tag',
attributes: {
name: 'tag 1',
},
relationships: {
post: {
data: {
type: 'post',
id: '1',
}
}
},
},
{
id: '2',
type: 'tag',
attributes: {
name: 'tag 2',
},
},
{
id: '1',
type: 'post',
attributes: {
name: 'post 1',
},
relationships: {
tags: {
data: [
{
id: '1',
type: 'tag'
},
]
}
}
},
{
id: '2',
type: 'post',
attributes: {
name: 'post 2',
},
},
]
});
return this.store.peekAll('tag');
},
actions: {
test() {
this.currentModel.get('firstObject')
.belongsTo('post').value().destroyRecord();
},
test2() {
console.log(this.store.peekAll('post').length);
},
},
});
<h1>Promise proxy not changed</h1>
The second power-select does not work the first time
<br>
<br>
{{#each model as |tag|}}
{{tag.name}}
{{#power-select renderInPlace=true selected=tag.post options=posts onchange=(action (mut tag.post)) as |p|}}
{{p.name}}
{{/power-select}}
{{power-select-blockless renderInPlace=true selected=tag.post options=posts onchange=(action (mut tag.post)) labelPath="name"}}
<br/><br/>
{{comp-1 data=tag.post}}
<br/><br/>
{{/each}}
{{outlet}}
Non-ED: <button {{action 'updateProp'}}>Update prop</button>
{{comp-1 data=test}}<br/>
Constant reference: <button {{action 'updateRef'}}>Update ref</button>
{{comp-1 data=ref}}
{{#comp-1 data=ref as |foo|}}
, Internal value: {{foo.something}}
{{/comp-1}}
<br/>
One component deep with reference:
{{comp-2 data=ref}}
<br>
<br>
{{#if (has-block)}}
{{#comp-2 data=data as |foo|}}
{{yield foo}}
{{/comp-2}}
{{else}}
{{comp-2 data=data}}
{{/if}}
AttrChangedCount: {{counter}}
{{yield data}}
{
"version": "0.15.0",
"EmberENV": {
"FEATURES": {}
},
"options": {
"use_pods": false,
"enable-testing": false
},
"dependencies": {
"jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js",
"ember": "3.2.2",
"ember-template-compiler": "3.2.2",
"ember-testing": "3.2.2"
},
"addons": {
"ember-data": "3.2.0",
"ember-power-select": "2.0.4",
"ember-power-select-blockless": "0.5.0"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment