Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
Jeroen Cornelissen
@jeroencornelissen
inside Item.List i have a function called destroyList that does that (as suggested by Justin)
Jeroen Cornelissen
@jeroencornelissen
I have cross-posted my question on the forums, so it wouldn’t get lost in this channel:
http://forums.donejs.com/t/bulk-actions-destroy-update-on-multiple-items/575
Justin Meyer
@justinbmeyer
deepasrikanth
@deepasrikanth
hi I have a question regarding components. I have a generic component that I would like to use from other components
This generic component will display a small ui with buttons where the click handler will be implemented in the component that is consuming the generic component.
though I am able to pass the callback function name as the click handler, it appears that the scope is not clear. When I execute the code its looking for the callback implementation in the generic component where as its available in the context its being called. How can I address this?
Kevin Phillips
@phillipskevin
you’ll want to pass the function in to the generic component
deepasrikanth
@deepasrikanth
I am passing function name. The function is in the viewModel of the calling component . Are you suggesting that I should pass the function code itself?
Kevin Phillips
@phillipskevin
so in the parent component, do something like <generic-component {handler}=“@clickHandler” />
and then in the generic-component, you’ll do ($click)=“handler()”
is that what you’re doing now?
deepasrikanth
@deepasrikanth
yes
Kevin Phillips
@phillipskevin

let me make my names more clear. In the parent component:

<generic-component {generic-click-handler}=“@parentClickHandler” />

and then in the generic-component template:

($click)=“genericClickHandler()
deepasrikanth
@deepasrikanth
ok generic-click-handler is not a function in the generic component. I have that as a property. If I change that as a function that should fix it ?
Kevin Phillips
@phillipskevin
in the genericComponent viewModel it will just be a property that you can overwrite, like
GenericComponentViewModel = can.DefineMap.extend({
    genericClickHandler: 'any'
});
deepasrikanth
@deepasrikanth
trying that
that worked than you very much :)
*thank
Kevin Phillips
@phillipskevin
you’re welcome. glad it worked!
Rob Lao
@viewplatgh
Hi, what's the replacement of map.attr in can 3? i.e. how to set attribute of can map when attribute name is stored in a variable in can3?
Gira Minus
@gKreator
Map.set
Kevin Phillips
@phillipskevin
can-map still has attr in can 3: http://canjs.com/doc/can-map.prototype.attr.html
if you’re using DefineMap, then you want `set: http://canjs.com/doc/can-define/map/map.prototype.set.html
Kevin Phillips
@phillipskevin
CanJS 3.5.0 is out: https://github.com/canjs/canjs/releases/tag/v3.5.0. :shipit: :tada: :sparkles:
Gira Minus
@gKreator
any notable changes?
Kevin Phillips
@phillipskevin
a couple new features for can-connect
can-validate / can-validate-validatejs should really help with validation
can-connect-signalr is notable (if you’re using ASP.net / SignalR)
you can now use can-event/lifecycle as a mixin
all the can-* packages have been updated to use Steal 1.0
Gregg Roemhildt
@roemhildtg
I have a super map, but if I need to override the behavior of getListData...etc would I just create a behavior that does this? Can you add a behavior to supermap?
Nico R.
@nriesco
I posted a question in stackoverflow related to applying the MVVM pattern correctly using donejs, supermodels and components: http://stackoverflow.com/questions/42874841/correctly-modeling-a-mvvm-application-in-donejs
Frank Lemanschik
@frank-dspeed
@roemhildtg please look in the supermap repo on github you will find out itself is only a combination of behaviors so you can simply copy that and add your and then use map directly
Gregg Roemhildt
@roemhildtg
ok I see
Nico R.
@nriesco
quick question, here: https://github.com/donejs/bitballs/blob/master/public/components/tournament/details/details.stache#L23 the following is used: {{#../teams.getById(homeTeamId)}} how does that work? besides the fact that I only thought possible to use {{#keyword}} with a reduced number of words there is also a parametric way of choosing that keyword? what about closing that tag, isn’t that necessary? thanks
Szabolcs Schmidt
@sszabolcs

Hi!

I don't know if I'm missing something or there is a memory leak in CanJs 3.
Following these steps anyone can reproduce the problem (I'm using Google Chrome):

  1. Open a new tab.
  2. Press F12 to show developer tools.
  3. Open http://www.place-my-order.com/
  4. Switch to Profiles tab on developer tools and take a heap snapshot.
  5. Click on the Restaurants link on the place-my-order page, then click on the Home link.
  6. Take another heap snapshot.
  7. Repeat step 5. and 6.
  8. On the Profiles tab select Snapshot 3 and list 'Objects allocated between Snapshot 1 and Snapshot 2'.
  9. Select for example the HTMLAnchorElement and view the details.
    There are three detached HTMLAnchorElement DOM elements that are not garbage collected.
    screenshot
Gira Minus
@gKreator
I ran into something like this, i dont remember much but has to do with the dev tools themselves
Guido Smeets
@gsmeets

Does anyone know what alternative I have to the change event in canjs 3?

Say I have a list of foo's on my viewModel, and I want to listen to a change on any of the list "value" properties. I.e. how do I write this in canjs 3:

"{viewModel.foos} change" : function ( foos, event, prop ) {
    if ( prop.indexOf( "value" !== -1 )) { ... }
}
Gira Minus
@gKreator
Yes
Jeroen Cornelissen
@jeroencornelissen
@gsmeets try “{viewModel} foos” : function(…. or "{viewModel.foos} property” : function(...
Guido Smeets
@gsmeets
does that work? because it doesn't in 2.X
(Can't try it atm, still working in 2.X, just trying to write everything 3.X compatible, so that migration in a few months will be easier)
Jeroen Cornelissen
@jeroencornelissen
It works in 3.X
Szabolcs Schmidt
@sszabolcs

Hello!

I've further investigated the memory problem. It seems to me that can-util/dom/data/data causes the leak.
In data.js there is a variable 'data' that stores objects by id.
As I could understand the problem lies in not cleaning the 'data' variable.

To put everything in context: we have a quite large app (19 000 LOC) that is built with CanJS 2.x.
We are happy with it and started to migrate to 3.x.
We are at the final steps of migration and now we realized that with CanJS 3 we have a memory leaking problem.
I've created a small sample app that compares CanJS 2 and 3 regarding memory usage:
gist link

  1. Open index_canjs2.html and with dev tools Timeline record memory usage (start recording with a GC).
  2. Click on Insert/Remove for a few times.
  3. Before stopping Timeline recording call GC, then stop recording.
    For example if I click on Insert/Remove for three times I can see on Timeline that there are exactly the same number of listeners (3) and nodes (70) in the begining as in the end.

Repeating these steps with index_canjs3.html show that the number of listeners grow gradually (with 3 Insert/Remove cycle the number of listeners grows from 4->10)!
If you put a breakpoint at the 753. row of can.all.js and analyze the content of variable 'data' (in Closure) after you click on Insert, you can see, that after a few "click on Insert/click on Remove" cycle 'data' keeps growing.
Initially - at the first click on Insert - there are 3 items in it.
Clicking Insert for the second time the 'data' variable contains 8 item.
When I click on Insert for the sixth time 'data' contains 28 objects!
No object gets removed from it.

This causes a memory leak: there are detached HTMLAnchorElements which cannot be GC-d because 'data' keeps reference for objects (canAttributesObserver, MutationObserver) which reference these HTML objects.
Shouldn't 'data' contain only objects that are somehow related to objects live in the DOM?
Is there something I'm doing wrong regarding the component insertion and removal?
Thank you in advance!

Kevin Phillips
@phillipskevin
@sszabolcs can you open an issue in can-util? we will investigate

also, does this memory leak happen if you instead of

var frag = template(new TestVM());
document.body.appendChild(frag);

you do

var myCompFrag = myCompRenderer();
document.body.appendChild(myCompFrag);
?
Szabolcs Schmidt
@sszabolcs
@phillipskevin of course, I open an issue for this
Kevin Phillips
@phillipskevin
creating document fragments inside of a DefineMap like that is not the conventional way of doing it
I don’t know that there’s any issue doing it that way, just curious
Szabolcs Schmidt
@sszabolcs
Ok, I'll test it soon! Thx!
Szabolcs Schmidt
@sszabolcs
@phillipskevin if I use the code you suggested instead the one that renders "content-using-my-component" then I won't have Insert and Remove buttons, the "control" which drives the component insertion and removal. This way only the component is appended to the body.