These are chat archives for canjs/canjs

12th
Jun 2018
zhan ishzhanov
@janat08
Jun 12 2018 11:03
is this right syntax import dropin from 'braintree-web-drop-in#?!platform.isNode'?
Julian
@pYr0x
Jun 12 2018 16:59
no
Chasen Le Hara
@chasenlehara
Jun 12 2018 17:17
@janat08 Here are the steal-conditional docs: https://stealjs.com/docs/steal-conditional.html
I think #{steal-platform.isNode} might work, but I’m not sure
If it doesn’t, then I’d create a module in your project that exports what you need.
Oh, wait, sorry, you want a boolean conditional, not the substitution syntax
In that case I think you’ll need to create a module in your project that exports the boolean… that is explained here: https://stealjs.com/docs/steal-conditional.html#boolean-conditionals
zhan ishzhanov
@janat08
Jun 12 2018 18:37
that makes no sense
Aliaksei Yanachkin
@ScorpAL
Jun 12 2018 19:03
Hi guys. I have a problem with adding styles for components:
document.querySelector('my-component').style.left = '10px'
warning on console:
style="left: 10px;" is deprecated. Use style:from="'left: 10px;'" instead.
zhan ishzhanov
@janat08
Jun 12 2018 19:23
@pYr0x what is wrong though?
Kevin Phillips
@phillipskevin
Jun 12 2018 19:30
@ScorpAL what version of CanJS are you using? I think this behavior has been fixed in 4.0.
Julian
@pYr0x
Jun 12 2018 19:35
#?~platform.isNode
for negation
zhan ishzhanov
@janat08
Jun 12 2018 19:53
Where do u even learn that
Aliaksei Yanachkin
@ScorpAL
Jun 12 2018 20:38
@phillipskevin I am using CanJS 3.
RyanMilligan
@RyanMilligan
Jun 12 2018 21:53
We're having two separate issues with infinite observable change loops in our CanJS 3 application. One I managed to fix (or at least, work around), and I believe it's a bug in CanJS related to observing changes to properties that are the target of a to: binding, which I will try to reproduce in a gist. The other I'm still investigating and am having trouble pinning it down. Is there any advice for tracking it down? I got a bit lucky with the last one by just breaking the debugger and managing to find the code that was triggering the spurious changes. Is there a good place to put a breakpoint so I can see what's causing these notifications to keep looping?
Chasen Le Hara
@chasenlehara
Jun 12 2018 22:02
One thing you could try is adding a setter for the property and put a debugger in there.
For can-define/map/map, that might look something like:
prop: {
    // ... whatever other definitions
    set: function(newValue) {
        debugger;
        return newValue;
    }
}
RyanMilligan
@RyanMilligan
Jun 12 2018 22:03
I have no idea what properties are involved here, the repro for this one is "go to one of our pages and search", which triggers a network request and then displays a pretty big, complex component with a lot of stuff in it.
And then it just spins with memory steadily ticking up until the browser crashes.
Chasen Le Hara
@chasenlehara
Jun 12 2018 22:08
Oh boy, gotcha
So one thing you could try to do is take out parts of the template; kind of narrow down which lines in the template, or which components when used, cause the issue
RyanMilligan
@RyanMilligan
Jun 12 2018 22:10
Yeah. The other issue at least involved a much more specific action, so I was able to just start removing code until it stopped happening, then figure out what was wrong with the problem section.
Chasen Le Hara
@chasenlehara
Jun 12 2018 22:10
Yeah, exactly
Are you using can-define?
RyanMilligan
@RyanMilligan
Jun 12 2018 22:10
Part of the issue is also that the components in the are also in the search widget that I have to configure to reproduce the problem, so that adds a bit of a wrinkle too.
Yes.
Chasen Le Hara
@chasenlehara
Jun 12 2018 22:15
Ok, so putting a debugger here might be helpful for logging updates: https://github.com/canjs/can-define/blob/5b38a1f212facbfc1c0e4d80f7da45ecce279f60/can-define.js#L60
You can dig around in can-define/map/map.js for other places things are being set, e.g. https://github.com/canjs/can-define/blob/5b38a1f212facbfc1c0e4d80f7da45ecce279f60/map/map.js#L48
Or just go right for the gold; if you’re on a later version of CanJS 3, can-reflect is used a ton for updating things: https://github.com/canjs/can-reflect/blob/221c5f4d2bf974fda1b9fe6082cd5740fdda578d/reflections/get-set/get-set.js#L174
I wish I had a better answer than “remove stuff from your template” and “put some debugger statements in a few places”… in CanJS 4, we did improve a lot of this stuff so you can understand why something’s being called and understand the relationship between observables: https://canjs.com/doc/guides/debugging.html#Debugwhatcausedaobservableeventorupdatetohappen_
RyanMilligan
@RyanMilligan
Jun 12 2018 22:25
Interesting, trapSets.setValue() isn't getting called at all once it's in the loop.
RyanMilligan
@RyanMilligan
Jun 12 2018 23:18
Phew! Found the problem, and it's actually a matter of some new logic in a shared component clashing with the design on a different page where it's also used. Not actually a render loop like the first issue, it just happened to present the exact same way.
Thanks for your help! I'll try to spend some time tomorrow getting an isolated repro for the other issue, which I believe is a CanJS bug.
Chasen Le Hara
@chasenlehara
Jun 12 2018 23:44
Great, thanks so much @RyanMilligan!
Out of curiosity, what was your breakthrough in debugging that issue? Anything you’d try first in the future?