« first day (3499 days earlier)      last day (1671 days later) » 
00:00 - 20:0020:00 - 00:00

00:43
Pretty new to Javascript. Hopefully this is a quick question (otherwise I can make a post about it): The following does what I expect: let o = { b: 'B'};let wrap = (i) => (() => { return [i];});o["b"] = wrap(o["b"]);console.log(o["b"]()). But I don't understand why the following has different behavior: let o = { b: 'B'};o["b"] = (() => {return [ o["b"] ];});console.log(o["b"]())
@MarkS. Welcome to the JavaScript chat! Please review the room rules. If you have a question, just post it, and if anyone's free and interested they'll help. If you want to report an abusive user or a problem in this room, visit our meta.
01:01
format code with ctrl-k
||formatting
Please don't post unformatted code - hit Ctrl+K before sending, use up-arrow to edit messages, and see the faq. You have 25 seconds to edit and format your message properly before it will be removed. Please separate code blocks from your actual question. Put your question in 1 message and then your code in a 2nd and format it.
it'll make it a lot easier to tell what you're asking
01:33
The sandbox link to in the room rules doesn't work, and I can't get the Ctrl+K to work properly somehow. I'll try again some other time. Thanks though!
let o = {
  b: 'B'
};
let wrap = (i) => (() => {
  return [i];
});
o["b"] = wrap(o["b"]);
console.log(o["b"]())
let o = {
  a: 'B'
};
o["a"] = (() => {
  return [o["a"]];
});
console.log(o["a"]())
@MarkS. ah, i see
You've discovered something pretty essential in js.
Lets look at the first example:
wrap(o["b"]);
What is that saying in plain English @MarkS.?
@forresthopkinsa yeah i've seen that. Pretty insane if you ask me.
Super neat
Howdy, any React veterans around at the moment? Just had a design problem I'd like to rubberduck.
@miqh Welcome to the JavaScript chat! Please review the room rules. If you have a question, just post it, and if anyone's free and interested they'll help. If you want to report an abusive user or a problem in this room, visit our meta.
01:49
ask away
02:00
I'm in a situation where the server is returning a huge pile of JSON, which I'm mapping to various objects, then trickling down to different layers of components. My problem is that some of the component layers offer editing capability (i.e. tracking draft values).
I'm trying to decide whether it's better to keep track of all possible draft values at the top-most component that acts as the client-server boundary, versus using another approach like the key prop to simply destroy and recreate all the component layers underneath.
(Obviously not using any state management frameworks like Redux.)
02:55
Does anyone know how to grouped and ungrouped observable data?
and when it clicked the grouped in the filter it should grouped the data based on the date.
0
Q: How to grouped and ungrouped the Observable data and display in list item with date header in angular

PandaHere's the code: https://stackblitz.com/edit/angular-6zvbjl-xmip9w?file=src/app/app.component.ts HTML <span>Filter:</span>&nbsp; <nz-dropdown class="filter-dropdown" [nzTrigger]="'click'" nzPlacement="bottomRight"> <a nz-dropdown nz-tooltip> {{ activeFilter.filterBy }} </a>

@miqh Can you change the server?
 
6 hours later…
09:09
Why didn't anybody tell me about npx? It seems REALLY USEFUL and I didn't know about its existence. It can run a module you have locally installed in your project, so instead of adding "gulp": "gulp" to the scripts section in package.json then using npm run-script gulp MyTask you can just do npx gulp MyTask.
Is it possible to call the React render function by variable rather than by string. So instead of:
....
nvm, I r dumb.
 
2 hours later…
11:22
I have a question for unit tests. I'm setting up Chai+Mocha (not sure if this really matters) however the current project doesn't use modules yet. I'd like to work on the modules later, but have unit tests first. Would that be a problem for unit testing some functionality? Can I import the file and work with the global thing it defines?
Also, I'm open to using non-Chai+Mocha setup if anybody has better recommendation.
11:38
Hmm what is the english word for "bond" - as in group that supervises a sports (like UCI for cycling or WTA for female tennis, or FIFA for football).
@paul23 organisation?
The A in WTA and FIFA stands for "association", if you want to use that.
Hmm association feels more specific :P
For in a form: "what association you belong to" and "association id".
Or woud you expect "organisation" there?
"organisation"/"association" seem too generic in that sentence. To me it would sound better if it's "What sport organisation you belong to?"
or "association" - I think the two would be interchangeable in this case
Point is it's a "sports X"
But also, I'm not totally sure if this makes sense whoever would read this.
How in the name of the gods do you make Mocha run tests from a different directory?
In scripts I have ` "test": "mocha js_test/**/*.js",` as I don't want to use the default directory called test.
However, when you run this all that happens is that the mocha.js file opens in Notepad++
What?! OK, so the problem is that I ad a mocha.js file in the current directory
Which I got from something I must have done earlier.
Maybe it was from running mocha init .
if you have the file it just...opens it? Weird.
GODDAMN IT!
it('smoke test', function(done) {
	expect(true).to.equal(true, "simple test");
});
This test was failing
Because I had the done parameter. If I remove it THEN it works.
Because Mocha seems to assume that if I have the parameter, it's going to be an async test or something.
So, it just timed out while waiting.
12:20
Also, Visual Studio is annoying the hell out of me. It randomly decides to indent something with spaces when it's set to use tabs. Then it underlines the indenting whitespace because it's inconsistent.
But because it now contains some spaces, pressing Tab adds spaces because...why not?
Deleting the entire whiespace at the beginning of the line doesn't help, either. VS just set the intentation to "mixed", so it just assumes that any further indentation is going to be spaces only.
12:54
Just use prettier and move on
I don't like prettier...I prefer eslint --fix. But I can't even find how you'd do an autofix on save in VS
you can use the eslint prettier plugin
@JBis wrap(o["b"]) says take the value of o["b"] and pass it into the wrap function. But since I haven't called a function in o["a"] = (() => { return [o["a"]];});, the behavior is different?
I also prefer VScode as you can enable ESLint autofix but Visual Studio is being obstinate.
just set up a cron job
:D
12:57
Would be awesome if I could set it on other people's machines...
The reason why I'm using VS instead of VScode is because I know other members of the team use it and I want to make sure the setup works there.
pre commit hook?
Doesn't that also work on the user's machine only?
Can you set a pre-commit hook on the server that will run when somebody pushes?
Wait...I just realised - you can't... at the time of a push you already have a commit
So, you'd have to autofix and make a new commit.
13:20
or you just throw and fail the push
and make them run the fix
13:30
Yeah...then the whole linting goes out. I found people are easier to accept good practices if you don't beat them over the head with a stick. Metaphorically speaking. They also don't like it when done literally.
My aim is to say "Change these settings in your IDE" and then it would handle everything.
Run yarn lint:fix is hardly beating over the head? It's not like what you had to do it manually :D
The linting I mean, not the beating
It still interrupts the flow of people. Creating friction is bad as it makes them prefer not using this tool at all.
I've had a lot of success with just being more sneaky.
Include linting, include tests then just show people "Hey, see - it just works".
Then I get buy-in immediately.
I'm starting to think VS is not a very good tool for writing JS... why the hell are null and undefined coloured differently?
Technically undefined isn't the same as null language-wise but anything else I've used will both colour them to match as you want the value to stand out.
And no, I'm not overwriting undefined there.
 
1 hour later…
15:16
hey
ok I'm oficially so deep in the mobx mess i have no idea how to dig myself out
Did I understand correct that glob.sync doesn't handle errors?
even kicking this library out seems like it would take hours upon hours
@MarkS. Yes. In the first example, you are getting the value, and passing that to the wrap function. Once the "get the value" occurs, it will use that value for ever. The difference in the second one, is that you are getting the value live, you are getting the value when the function is called not before.
does that make sense?
@BartekBanachewicz I love mobx!
well i have a problem and i have no idea how to express it with mobx
it's rather tiring because it breaks down completely unexpectedly
things just don't propagate for weird reasons and tracking down why that is is super hard
15:54
I guess i would like to keep using that because it's magic and fun
but when it stops working it becomes completely undebuggable
@BartekBanachewicz whats the isuse?
@JBis i wrote a simple class to represent timestamps
tried to put it in my observable
the observable itself is edited via mobx-utils' viewmodel
to put it simply, it doesn't work at all
export class Time {
    @observable h
    @observable m

    constructor(h, m) {
        this.h = h;
        this.m = m;
    }

    get hours() {
        return this.h;
    }
    get minutes() {
        return this.m;
    }

    addMinutes(deltaInMinutes) {
        // ...
    }

    toString() {
        // ../
    }
}
ok that looks fine
the original object is another class with just two fields: pk and "fields" which is a json k-v object
16:04
so whats the issue
    constructor(r) {
        this.pk = r.pk;
        this.fields = r.fields;

        const dateStr = this.fields.date + "T" + this.fields.time;
        const date = new Date(dateStr);
        this.fields.time = observable(new Time(date.getHours(), date.getMinutes()));
    }
@BartekBanachewicz Please don't post unformatted code - hit Ctrl+K before sending, use up-arrow to edit messages, and see the faq. You have 25 seconds to edit and format your message properly before it will be removed. Please separate code blocks from your actual question. Put your question in 1 message and then your code in a 2nd and format it.
that's how I initialize my outer class
originally "time" is received as a string
this is just a silly way to parse it, i know, but anyhow
the class has @observable fields btw
I'm not a big fan of using extra members to hold different representations of the same data
this.fields.time = observable(new Time(date.getHours(), date.getMinutes()));
i don't think thats right
16:06
not unless it's genuinely updated
it's not extra, it replaces the previous value @Neil
that was the idea - to turn the string representation into something easier to work with
ah so it is
well that's fine :)
why not just
this.fields.time = new Time(date.getHours(), date.getMinutes());
@JBis I kinda lost it trying different things, but doing it this way doesn't change it
it should. I think you are implementing it wrong.
16:08
when wrapping the entire Ride class (that's what has fields inside) with createViewModel, the viewmodel seems to break on the time field
any component that uses this.fields.time should be an observer
yeah, all of my React components are observers
and other fields work fine
also with the viewmodel functionality
just not the time
can you show how ride is used in createViewModel?
    @action selectRide(r) {
        // Prevent accidental dropping of changes
        if (this.props.store.selectedRide && this.props.store.selectedRide.isDirty)
            return;

        if (r === null) {
            this.props.store.selectedRide = r;
        } else {
            this.props.store.selectedRide = createViewModel(r);
        }
    }
selectedRide is what the editor uses
all editor controls are bound to the selectedRide state
tbf I am kinda introducing two things at once here
because I was doing manual field change tracking before that
because the viewmodel doesn't reflect the changes in the original model, which is what i want
can you show createViewModel(r);? I don't see an issue yet
16:12
this is straight from mobx-utils
ah
it's not quite what I want, because again I want a copy for change revert, but immediate preview
and viewmodel makes a copy but only moves to model once you submit
but i can fix that by temporarily removing the original object from the collection and rendering the selected one separately
so that's okay
what's not okay is that my Time seems to completely break with the viewmodel - it actually propagates through to the model immediately and doesn't register as a change
i suspect the issue is that i'm using my own function addMinutes
aha
class Todo {
  @observable title = "Test"
}

const model = new Todo()
const viewModel = createViewModel(model);

autorun(() => console.log(viewModel.model.title, ",", viewModel.title))
// prints "Test, Test"
model.title = "Get coffee"
// prints "Get coffee, Get coffee", viewModel just proxies to model
viewModel.title = "Get tea"
// prints "Get coffee, Get tea", viewModel's title is now dirty, and the local value will be printed
and the viewmodel doesn't realize it's actually a change
but I want to have a function, that's half the reason i wrote the time class
I don't want direct assign, i want a method on an encapsulated object
hmm
16:15
im not dead set on using the viewmodel/utils thing
but then i'd need some other way of change tracking anyway
class Todo {
  @observable title = "Test"
}

const model = new Todo()
const viewModel = createViewModel(model);
it doesn't wrap model or createViewModel in an observable
@BartekBanachewicz wdym? just modify the instance directly
If i'm not making any sense, I know someone who's really good at Mobx (he used to be a moderator here but left). I can give you his discord if you want.
Madara
@JBis i need undo capabilities, and i also only send updated fields to my backend
maybe i'll just ask on main
BTW I just realized
if I try to modify the properties of time directly, it still breaks the viewmodel bubble
Just confirm, all the this.props.store.selectedRide is what is being manipulated right? you aren't ever changing the ride directly
16:22
yep
aaand it seems that viewmodel works properly if i go through the setters i made
but if i touch the selectedRide.fields directly it also modifies the model
Hmm. Unfortunately, I haven't used the mobx-utils so I'm not really sure.
yeaaah
i'm kinda suspecting that it might not be quite up to the challenge
i might just go to my manual change tracking, but implement it better
but it's kinda weird that like, noone else hits this problem?
> You may use observable arrays, maps and objects with createViewModel but keep in mind to assign fresh instances of those to the viewmodel's properties, otherwise you would end up modifying the properties of the original model.
Could you create a gist with all relevant code?
hey but that bit
I've just realized
i'm not assigning a fresh instance when i make my viewmodel, so maybe that's the issue
yeah
huh so I'd need a custom deep copy now or what
i think you are modifying the wrong thing somewhere
like maybe you are modifying this.fields.time directly somewhere
16:30
i think i need a break
but it seems i'm closer to the actual problem (and much deeper into how mobx works than I wanted)
I'm gonna go get some air and try attacking it again then :)
that often helps
17:08
I was about to say, ask Madara, but I see you already mentioned him lol
fn = input => someCondition(input) ? transform(input) : input
Does this construct make sense? It's like a conditional identity function but it might optionally transform the input. Essentially, the idea is that at the end you'll normalise to the same type.
looks fine to me
unless your normalization function could take already normalized output (which it should be able to)
It just looks unusual to me but then again, I might be wrong.
And I wrote it, so...
Well, this is the normalisation.
So, if you get something and you don't need to transform it, then just return it.
i would put that in the normalization function
function transform(input){
    if(someCondition(input)){
      return input
    }
}
17:24
It's related to this thing you looked at more than a week ago. It's the .of() method.
On very slightly related note - any good URL shorteners? I've been using bit.ly mostly because it shows up first in the search results. Tried shorturl.to but it seems my link from it is gone. I guess they don't retain if for long
i'm not a fan of url shortners
Me neither but the damn TS playground encodes the entire input in the URL.
So, I can't often paste it as a comment on SO.
I guess I could just make a stackblitz
Don't know why I didn't think of it earlier.
17:53
ColdFusion?
Kevin is that you
Is ColdFusion still used on a somewhat regular basis, or is it going extinct nowadays?
It'll always be a thing in legacy codebases
Long after we're dead
So does COBOL but I don't think any new projects would use it.
Yes that's about where it stands lol
We still use CF, sadly I don't think that'll be changing anytime soon
18:17
if i have a class in javascript.. i am looking for a way to do destructuring with the this keyword
example:
`let {model, make} = car;`

i want to have:
`this.model = car.model;`
`this.make = car.make;`
18:36
okay, not horrible
@JoeSaad I'd prefer your current solution, honestly, as it makes it vastly easier to read and maintain. The fact that it's two lines instead of one is negligible - you'd be reading it a lot more times than you'd be writing it. Here is the syntax to do it with destructuring if you want but it really doesn't make it that much shorter, either.
18:54
i dont recommend that syntax, it's hard to read. Using explicit assignments is perfectly fine
who has published once a google app in the play store?
Do I have to have a checkmark in each of the sections in the play console?
19:15
@JBis I've just realized
"You may use observable arrays, maps and objects"
my fields field was an array
that whole viewmodel thing is really quite useless
I'm gonna go back to a handwritten impl
ok I had to click => Publish.. since 2 days I am waiting -.- and did not know that I need to click next step -.- whack!
15
Q: Google store says Ready to Publish

SampathI'm trying to publish my ionic2 app on Google play.But still, I cannot do that.It doesn't show any errors.Can you tell me how to do this? When I press the "Ready to Publish" button then it shows below screen.

19:29
mmm the fact that in 2020 there's still no easy way to copy an object in js is somewhat disappointing
@AaronJohn Sabu Welcome to the JavaScript chat! Please review the room rules. If you have a question, just post it, and if anyone's free and interested they'll help. If you want to report an abusive user or a problem in this room, visit our meta.
I'm badly in need of a way to run a function in the background while the main code is running
@BartekBanachewicz stingify -> parse is the easiest but it's also very much not ideal. I know what you mean.
@VLAZ apparently you can import lodash/deepclone as a separate library
19:32
@AaronJohnSabu sounds like a job for threads
@AaronJohnSabu you cannot normally, unless you use workers.
@BartekBanachewicz I'd not count that as "easily" as it's not a core part of the language. But yes, you can do it.
But none of them worked
19:33
@VLAZ sounds better than implementing it myself
Well, I tried workers but that wasn't successful. Probably due to my laziness but I don't really think so
@BartekBanachewicz oh, yes, definitely. I think it also doesn't handle circular structures but that's pretty much most cloning mechanisms, really.
@AaronJohnSabu I mean this with all due respect, but that's a terrible excuse
reference semantics are meh :(
However that being said, please explain what you tried? It's hard to help you without knowing what you did, where it went wrong, etc
19:35
@SterlingArcher yeah I know. But I don't really think it was laziness in all. I tried a couple of combos using workers but none worked
3 mins ago, by Sterling Archer
Go on
So, I actually want to use a worker on an internal function itself. I guess I used W3Schools as a guide and wrote the code but there was no hope
@SterlingArcher about?
Gotta more specific, need to see code
Errors, input, output, benchmarks.. any debugging.
The question is too vague to answer without deets
I'd definitely start with analysing whether you actually need the function to run in the background. Generator functions and setInterval might be a good solution, too.
Bascially I wanted to know if there is any other way by which I can at least feel multi-threading.
setInterval does not actually serve the purpose when I checked it out both on code and on online video guides
But what are generator functions?
19:39
haha it didn't like the star
add the * into the url
sigh no the deep clone still isn't a satisfactory solution here
The other way is calling something external and waiting for a response. In a browser that is probably going to be an AJAX call to a backend, while in a server you can call another process and wait to be notified upon completion. Neither is really "multi-threading", though. I'm not aware of any other easy choices - there might be more specialised ones.
@BartekBanachewicz :/
If you think more threads is the solution you're probably looking down the wrong avenue especially in JS
|| MDN function*
19:41
Thanks!
@SterlingArcher Cool. I'll try it out. Thanks for the suggestion!
I was wondering whether it'd like it :D
Not my suggestion, thank VLAZ :P
@VLAZ thanks to you too!!
@BartekBanachewicz agreed. JSON.stringify for simple stuff
19:42
@VLAZ tbh I'm not sure where I'm more surprised. MDN using asterisks in URI, or SO Chat not parsing it
Why not both?
okay different question then
I've never been a both guy
to add methods to a class in runtime
Blame is 100%
19:43
i need to treat it as a prototype right
just put my functions into the "class" object
@JamesBot I don't really think generators can help. But thanks anyway
@BartekBanachewicz stackoverflow.com/questions/32496825/… looks to be the case
@BartekBanachewicz depends. You can also just attach directly obj.newMethod = function() { /* do stuff */}
@SterlingArcher nice
that will work until the class is extended
19:45
huh? why?
not you, vlaz
lol
yeah i definitely want to modify the prototype @VLAZ
if you add stuff to the prototype, anything inheriting from that prototype, will get those functions.
using the prototype ensures extension. the other method will work, but the moment you extend it you lose it elsewhere
yah we're on the same page
yeah i was just needing the Classname.prototype[method] = f bit really
19:46
Yep, that will work.
i can generate my accessors that way
or wait
that will work for methods, but what about properties?
Just in case f needs to be a normal function, not an arrow function, if you want to use this inside it.
Properties added to the prototype also propagate down the chain.
i've just realized i have no idea how properties are implemented
object properties?
19:47
@VLAZ yes, but i can't use that syntax sugar when adding them to the prototype post-factum
@SterlingArcher get/set
You can use Object.defineProperty
you don't call that properties?
|| MDN Object.defineProperty
Haven't worked with those tbh
19:48
> expression
Starting with ECMAScript 2015, you can also use expressions for a computed property name to bind to the given function.
That allows you to specify get and set as well as configure the properties like visibility and stuff.
Computed property names are in square brackets.
@JamesBot ah great
that looks perfect
That reminds me about how weird I think object.freeze works
19:49
||> const foo = "hello"; const obj = {[foo]: "world"}
@VLAZ undefined Logged: `` Took: 0ms
||> const foo = "hello"; const obj = {[foo]: "world"}; console.log(obj)
@VLAZ undefined Logged: {"hello":"world"} Took: 0ms
^ computer property name
is console.log not assumed in the bot?
could have sworn it was
19:51
last statement was just a variable declaration. That doesn't produce a value.
||> const foo = "hello"; {[foo]: "world"};
@SterlingArcher "SyntaxError: Unexpected token ':'" Logged: `` Took: 0ms
You need round brackets there.
@VLAZ yeah, that's cute, but until I can do const obj = { ["x", "y"].map(p => [p]:"xyz") }... :)
19:51
||> const foo = "hello"; ({[foo]: "world"});
you and your expressions
JamesBot doesn't like them, either, I guess.
||> const foo = "hello"; ({[foo]: "world"})
@VLAZ {"hello":"world"} Logged: `` Took: 1ms
dunno why this worked...
I removed the final ;
||> obj = ["x", "y"].reduce((acc, prop) => ({...acc, [p]:"xyz") }), {})
@VLAZ "SyntaxError: Unexpected token ')'" Logged: `` Took: 0ms
19:54
yeah, thought I'd make a mistake
||> obj = ["x", "y"].reduce((acc, prop) => ({...acc, [prop]:"xyz") }), {})
@VLAZ "SyntaxError: Unexpected token ')'" Logged: `` Took: 0ms
also just wanted to say
It's good to see me?
I know
that using properties instead of functions without static typing is a recipe for disaster
because when you remove a getter then it just fails silently
||> ["x", "y"].reduce((acc, prop) => ({...acc, [prop]:"xyz" }), {})
19:56
@VLAZ {"x":"xyz","y":"xyz"} Logged: `` Took: 0ms
where you'd at least get "calling a null" or something
@VLAZ lmao
good one
It's not an amazing approach but you can do it.
I was just messing up with brackets
i appreciate the effort :D but i think defineProperty is much saner here
Which, you know - pretty easy to do with so many of them.
Oh, definitely
As for types, TypeScript helps
yeah, i've been putting it off for a while
19:58
You can also use Flow or other stuff. I've used Tern.js in the past.
definitely on the table for... sometime
i have webpack (and babel) already so adding ts wouldn't be hard
Yea, cross fingers
i need to get this feature done first though
Last time I spent four hours just getting the tests to run in TS.
Not focused 4 hours, I was also watching videos on the other monitor but still.
Way more time than it should have taken.
00:00 - 20:0020:00 - 00:00

« first day (3499 days earlier)      last day (1671 days later) »