« first day (2873 days earlier)      last day (2297 days later) » 

07:04
I never know how I feel about this
a part of me wants anything and everything which could possibly have problems to throw an exception, and if anything, adapt it afterwards
and then another part of me thinks that's way inefficient and errors should only be thrown sparingly
@KarelG ok 500 errors are basically html right... so error method gets called
07:36
@MadaraUchiha Morning
TS : I'm trying to create an "Extension method " alike in typescript
So that I will be able to do something like :
var g= [{a:1,b:2}]
g.find(d => d.a == 1).toFunc((a) => { if (a.a == 1) alert(1); else alert(2) })
(in short : toFunc , should take the object from the find and I can do whatever operation on that item
@RoyiNamir What's wrong with
Why not just give it a callback?
I've tried this : bit.ly/2MRvJEd
const a = g.find(({ a }) => a === 1);
if (a.a === 1) {
  alert(1);
} else {
  alert(2);
}
Why do you need the .toFunc?
What's the point?
OK. the real story is this :
I'm creating a model , which needs to have a name. but name can be english or local language
Shure I can create a property outside
But let's say I dont want to.
07:41
A property to indicate whether the name is found in the english properties or in the local properties?
so here if I had find(...).tofunc((a)=>if (store.lang=="en") return a.englishFirstName else return a.localFirstName)
no. a property to show to a user in an English device or Hebrew device
DB returns 2 records. english and heb
Can't you just use map for that?
Hmm, I see your case, you want to "map" the one object within the same expression.
RIGHt!
So I won't have to "double" : (find)....
@BenFortune After the .find() it's no longer an array.
You can wrap and unwrap the array for this purpose, but that's just hacky.
07:44
I mean before the find
@BenFortune Then you needlessly iterate the whole resultset
He could use .filter() to get an array of one element and .map() that, but that's a bit hacky too
In C# I could do this :
(I know that C# is not TS , but it's just for simplification)
Is it possible to refactor the following code shorter and better
```
if(store.tag){
return (store.name.toLocaleLowerCase().indexOf(val.toLocaleLowerCase()) > -1) || (this.getLocality(store.locality).locality.name.toLocaleLowerCase().indexOf(val.toLocaleLowerCase())> -1) ||
(store.tag.toLocaleLowerCase().indexOf(val.toLocaleLowerCase())> -1)
}
else{
return (store.name.toLocaleLowerCase().indexOf(val.toLocaleLowerCase()) > -1) || (this.getLocality(store.locality).locality.name.toLocaleLowerCase().indexOf(val.toLocaleLowerCase())> -1)
@ZenOut there is a .includes to check if a string has a given value: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
it is case sensitive though. What you can do is to go through the object keys and put all values to lower case before doing that if-else branch
@RoyiNamir You can technically do that with prototypes
But it isn't recommended.
Object.prototype.toFunc = function(cb) {
  cb.call(this, this); // both the first parameter, and the callback's this will be the object
}
07:59
@RoyiNamir please don't do that lol
:-) - you mean the C# code ?
it can save you a few lines of code and not to create additional -out-of-scope variable / functions
@KarelG If store.tag message exists I am searching an additional value apart from what it is done in the if block, can I make all in one shot. I am repeating this part
(store.name.toLocaleLowerCase().indexOf(val.toLocaleLowerCase()) > -1) || (this.getLocality(store.locality).locality.name.toLocaleLowerCase().indexOf(val.toLocaleLowerCase())> -1)

twice in code, can I make it single time by not declaring additional variable
08:14
no. But what is wrong with declaring a variable for a moment?
if value is not a constant, you can do val = val.toLowerCase()
08:36
@RoyiNamir yes that is a really problematic idea lol
08:50
@RoyiNamir find(...)[a ? b : c]?
or getLocalName(find(...))
As you see , I can't access b and c ( in your example) - btw find returns an object. not an array
find(...)[this.isEng ? 'englishFirstName' : 'hebrewFirstName']
yeah but you lose type safe
why don't you write a function that just do the job ?
so use a function
do you get charged per line of code?
08:54
@Mosho I did find a workaround-alike using IIFE : i.imgur.com/r7ejxm4.jpg
lol but why
@RoyiNamir This is really needlessly complicated.
becuase a function is to be reused. no-code ever besides this name population - would ever use this function
How are you getting the data? Can't this be done beforehand?
08:55
so?
what is wrong with re-usability ?
same goes for ()=> , you can say that we don't need this
// Just
const customer = blablablabla.find(/* ...... */);
return {
  // use customer here like a normal human being
}
it happens that I add some hacks in my code but that is really not required in your case imo
@RoyiNamir a) it has different semantics and b) it sometimes makes code easier to read
in your case it doesn't
at all
as a rule of thumb, readability trumps all
08:58
well we can debate on this for hours. personally I think that ()=> , besides this context issue , is much less readable than function ,
@RoyiNamir Depends where and in which context
Sure. like everything in life
foo.map(x => x + 1);
// vs
foo.map(function(x) { return x + 1; });
You really think the latter is more readable than the former?
no . but there are situation where one might think it is
lambda vs function is not the topic
what you wrote is less readable than defining the function beforehand or using a variable
09:00
it's just like in p.then(item=>....).then(item2=>....)
same principle.
(leaving the promise stuff aside for now)
I can chain previous values and do whatever i want
yeah, you can do whatever you want always :)
p.then(item=>this.isEng ? item.prop1 : item.prop2) - What's the difference ?
but the majority of people here would tell you the same
Can you tell me what's the diff ^ ?
that what you are asking for doesn't exist
09:03
Great. it didn't bother you in promise . so we're good on that. All I wanted is to build a helper method which WILL allow me to do like this promise ^
you mean extend Object.prototype like what Madara wrote?
that's a whole other can of worms
you can, of course, make a helper method that looks like helperMethod(yourChainedExpression, aFunction)
but it's probably not what you want
btw , talking about patching prototype , I'm not in love with it , but hey , RXJS did this until ver 5. ( not anymore)
whatever benefit it would have is offset by having whoever else reading the code not understanding it
it's a no-brainer for me
@RoyiNamir no they didn't, they patched their own prototype
There is no problem with prototypes, there's a problem with extending builtins.
^ yes. you're right
09:10
@RoyiNamir just to not leave you hanging esdiscuss.org/topic/scoped-binding-of-a-method-to-an-object
Also note this is 5 years old, so there's that and neither pipeline nor bind are moving very fast
Thanks - Which makes me asking : does extending builtins using Symbol , also considered as bad practice ?
if so , why ?
for me it's not so much about conflicts as it is about, again, readability
@RoyiNamir it is
why ?
it's not that someone can gets confused , unless he used the same symbol
@RoyiNamir for the same reason you wouldn't expect #DEFINE true false in C, because it violates the principle of least surprise and it's global and conflict prone
You can extend built ins easily by composition and inheritance - no need to mutate existing builtins
Except pollyfilling
09:16
(Btw I've tried long time ago to think when will I ever want to use Symbol , and didn't find a real(!) scenario)
@RoyiNamir well, I've found symbols to mostly matter for describing how an object works in a certain scenario. It's a way to provide hooks that doesn't imply you should use it as a method call.
it's like saying : I don't care what props are in it , just create another one under a Symbol ambrella.
It's like an opt in for inversion of control where you pass things in and they're expected to call the symbols
@RoyiNamir right, and I'm saying extending builtins is very dangerous. What if there is code in a library you're using that relies on the builtins' behaviour?
@BenjaminGruenbaum Interesting, can you plz supply a psuedo example ? ( just so that i'll catch up what you mean?)
( I want to have an answer , when someone ELSE asks me : scenario for symbol :-)
@RoyiNamir first 5 that pop into my mind are Symbol.iterator, Symbol.species, Symbol.asyncIterator, Symbol.replace, Symbol.toStringTag
09:21
yeah but how that fits with IOC ? ( which I'm after to understand how symbol can help here)
@RoyiNamir helps in how? there is nothing you can do with symbols you can't do without them
That's also true for classes, it's just a convention and a useful mental model
You said : it's like an opt in for inversion of control where you pass things in and they're expected to call the symbols , which made me think about an example regarding IOC and symbols - That's all
All of those are examples
IoC just means that you pass something and they call you when they want and not vice versa
Like a for... of calls Symbol.iterator as part of the protocol and return on the iterator when you break
Symbols aren't like IoC
They're like interfaces
They're nothing like IoC, they're commonly used for it though in the language in practice
09:28
Ohhai me loves
In Java you'd have implements Iterable then it can be iterated with for (Foo foo : bar) {}
In JS you have [Symbol.iterator]() method on the object
Interfaces enable IoC but they're a lot more generic in Java since they're well.. interfaces
In JavaScript Symbols are specifically used (so far) to indicate a hooking point where code you are passed into is expected to call you.
And you are not supposed to call this code normally usually.
I think a good analogy is __magic__ properties in python
Yeah, they also play the same role
to which symbols are far superior
I think
09:31
I think it's just a neat way to add stuff to an object in an accidental conflict free way which is future proof.
If you want to create a conflict then you can still get one it's just harder :D
you can say the same about well-known symbols
or even (almost) any symbol with Symbol.for
@Mosho Not particularly, you can't accidentally create a conflict with existing code with symbols with sane code.
As for usage, syymbols have grown to be most popular for any kind of metadata storage
Of course, if I'm a moron and create Symbol.whatever = Symbol() and then tomorrow JS introduces that well known symbol, I get a conflict
@KamilSolecki Sure, but not well-known symbols
09:36
export class Storage {
  static meta = Symbol();

  doStuff(something) {
    if (Storage.meta in something) {
      something[Storage.meta] = 'metadata!';
    }
  }
}
This is fine, there's no danger of collision ever.
I raise you Object.getOwnPropertySymbols
One thing to be careful with, though, is creating shared-realm symbols
@MadaraUchiha No collusion!
@Mosho So? Then what?
then I can create a collision
09:39
You don't even need Object.getOwnPropertySymbols()
How @Mosho
You can just use Storage.meta for something else, it's publicly available
is it?
@Mosho Of course, that's the point
it's not necessarily the point
and I don't see anything in that snippet that exposes Storage globally
09:40
import { Storage } from './storage';

class StorageConsumee {
  set [Storage.meta](value) {
    this.doMagic(value);
  }

  // ...
}
you might want to define metadata for your own use only (in a library like seamless-immutable, for example)
hi mosho
well you didn't export the class in the original snippet
@Mosho Are you sure?
09:41
the original snippet
I don't know what you're talking about.
I have a screenshot
Fake news.
wait
okay, nevermind
09:43
😇
@KarelG hi
@MadaraUchiha for those cases extending it form the outside (keeping a Map) probably makes more sense
@BenjaminGruenbaum A WeakMap, sure
idk, having the objects "carry" the metadata can be useful
@MadaraUchiha well, a WeakMap if you don't want to retain the key for the metadata which is sometimes the case.
09:44
wouldn't the key be the object
@BenjaminGruenbaum I thought you meant a map from the instance upon which we're storing metadata, to the metadata itself.
@Mosho only if everything is a global variable.
@Mosho it would
@MadaraUchiha I was
@BenjaminGruenbaum hmm, not following
A WeakMap is appropriate if we don't want to interfere with GC
So it would almost certainly be the case that we want to not cause a memory leak by storing metadata on dead objects...
09:45
Sometimes we don't want our object to be GCd without us knowing and losing the metadata
i just commented with
> I have used ES2015 (aka ES6) features.
it annoys me sometimes when one uses the former, another uses the latter
@MadaraUchiha let's make this more concrete? What is the metadata in this case?
There are cases where a Map is appropriate and cases a WeakMap is appropriate
well, if metadata is only concerned with the object and that object is gone...
Let's say it's a URL against which I'm syncing the object with the Storage.
@KarelG what really annoys me is that es x doesn't correspond to es201x
09:47
@MadaraUchiha then a WeakMap makes sense, though I'd probably derive that from the object if I can.
Although it's not possible
@KamilSolecki should have just waited another year lol
@KamilSolecki wait when eg a release happens on 2025. Then you would use ES5 again? Or ES25? :P
then one would complain why ES6 is used for ES2015
@BenjaminGruenbaum introducing es5v2
some logic fallacy there
09:49
@KarelG There's no logic fallacy whatsoever, the correct way is, by definition, to count by years.
Or we can just abolish all pre-decade versions and start anew
why is the correct way to count by years
it's software, not a car model
then you have to come up with a new syntax
ESx is already taken. Re-using it would confuse people
Also I believe they can't do ES X or 🍎 will be mad
@Mosho Because that's how the specs define it
09:50
with a space? lol.
@MadaraUchiha chicken and egg?
that depends of the egg Mosho
No, it's defined that way in the specs, therefore that is its name
The thing is ES6 and ES2015 are both correct, 6 is the version number of the spec and ES2015 is its name
@Mosho to ensure shit gets shipped every year an shame the TC to release stuff every year.
@KarelG last time I bet in chicken races I was outsmarted like that. My chicken clearly won, but one sicko put a bet on "the egg"
09:52
@BenjaminGruenbaum sad but true
@KamilSolecki do they have to cross the street as fast as possible?
@KarelG they hold that right after cock fights so sadly they use the same arena
10:30
@MadaraUchiha fyi
help?
0
Q: Show first form in multi step modal

Dwight SchruteI copied this code from the internet..from here(https://www.jqueryscript.net/form/Creating-A-Modern-Multi-Step-Form-with-jQuery-CSS3.html) It is used to show multiple forms in a single modal by sliding off the old fieldset and sliding in the new fieldset. <div class="modal-content"> ...

 
2 hours later…
12:40
3 years ago Neil
Besides, reposts are a time-honored tradition on reddit anyways
yeah
I just ignore
man, that guy sucks at super mario
who just stands there and lets the fireball hit them
hey guys i have a function blabla_test ()
the problem is the blabla is valeu of a hidden input

how can i use a jqeury in function name ?
umm, can you explain your issue more? because that doesn't quite make sense
i have differend forms on differend pages
they have all a same hidden input with differend valeu
like
<input type="hidden" name="formname" id="formname" value="worker"/>
so the function must be function worker_test() for example
and on other page where the input have value people it must be people_test()
why?
just give it a generic name
13:05
its hard to explain is it possible
is what possible? a dynamic function name? mostly, yea. but it's probably a bad idea for your needs.
or just define a map of your functions
let funs = {worker:{test:()=>"strike", ...
sounds like fun
... runs to the coffee machine
13:27
... runs to the java machine
How would I type a React component that has at least this and that properties, but no limitations on the rest?
sounds like an interface to me
React.ComponentType<{whatever: Whatever, whatevez: Whatevez, [others: string]: any}> seems to do the trick
13:51
what is the best way to open an electron window from main.js using the user's previous window size
?
if they exist
@BenjaminGruenbaum If you're interested, I ended up doing it in the React tree anyway
The API is just nicer this way
<Experiment
  id={ActiveExperiment.Whatever}
  variants={{
    default: (step, win) => <DefaultVariant step={step} win={win} />,
    someVariant: (step, win) => <SomeVariant step={step} win={win} />,
  }}
/>
And a special convenience case for when you only need to alter one prop:
<ExperimentOnProp
  id={ActiveExpriment.ShowMoreRatingsSignup}
  propName="onClick"
  variants={{
    default: () => console.log('default'),
    someVariant: () => console.log('variant!'),
  }}
  Element={({ win, onClick }) => <div onClick={() => (onClick(), win())}>Click me!</div>}
/>
@Linkgoron wdyt?
14:16
I have problems understanding the bind method. In the mdn docs I read:
1 message moved to Trash can
@Strict Please don't post unformatted code - hit Ctrl+K before sending, use up-arrow to edit messages, and see the faq. For posting large code blocks, use a paste site like gist.github.com, hastebin.com, pastie.org or a demo site like jsbin.com
I'm in mobile
on*
Gonna repost when i'm on my computer then.
@MadaraUchiha It just sounds a little orthogonal to the problem but sure
Kind of reminds me of how React Router uses components for routing
Because it's the react tree way or smth :P
can anyone help me with this
0
Q: webpack external not loading module

Alex BollbachI'm making a library wherein I need to specify React as a peer dependency. So I specify it as I've seen documented: externals: { react: "react" }, I add it as a peer dependency so that its installed in my depending app. But I wind up with: Uncaught ReferenceError: react is not defi...

i spent all night on it can't fix it
@AlexBollbach I'm almost sure it's react: "React" and not react: "react"
Instead of spending all night on it, maybe you should catch some sleep, eh? 😉
14:32
nah
right, i should have mentioned. i was able to figure that part out.
though i don't really understand why. so i can't translate that success to my other problem which is the same issue but w/ styled components
@AlexBollbach Read all of my answer.
e.g. from reading the webpack docs (such as they are) i don't understanding how externals really work
@AlexBollbach The way externals work is that they essentially replace the import with a stub
For example
right. so i understand the basic idea
so i have "Styled": "styled-components" as well
externals: {
  foo: 'howdyDo'
}

// snip

const foo = require('foo'); // gets compiled to const foo = howdyDo
@AlexBollbach Other way around, I believe.
14:35
but i don't really get how this mechanism works in the light of the full complexity of module systems
@AlexBollbach It's actually the simplest part.
It literally string replaces the imports with whatever you put there.
e.g. what if i use ESModules like import Styled { injectGlobal } from 'styled-components'
@AlexBollbach That's not valid syntax
@AlexBollbach Doesn't matter, same difference
uh.. ok yeah right comma after Style
but what would that import be as an external, it isn't obvious to me
@AlexBollbach Imagine it replacing the module styled-components with
export default Styled;
And in the case of React:
export default React;
And in the case of my foo
export default howdyDo;
And everything else stays as it is.
14:38
and injectGlobal? does it just take that from "Styled"?
injectGlobal replaces a global and not a module record
injectGlobal is a function in Styled
It adds global css no?
no but it shouldn't matter what its semantics are/what it does
@AlexBollbach Yes.
14:39
i just mean in the context of webpack externals and module importing
import foo, { bar } from 'whatever';

// is equivalent to

import foo from 'whatever';
import { bar } from 'whatever';
@MadaraUchiha import {bad} from 'mood.js'; bad()
@KarelG Who hurt you?
me, myself
made a mistake. Fixing it atm
so whats important is that 'whatever' is handled by externals
14:41
ֿRight
but i find it odd that you need to define the module w/ some specific string e.g. "Styled". because normally i can import default exports with any naming. so it seems like in this case of webpack externals, you loose that normal behavior?
You do, you explicitly tell it "when you see X as what's being import, replace it with that global variable"
@KarelG I managed to blow up our repository trying to under a merge
You'll be ok
to what under a merge?
14:45
so when i add this external "styled-components": "Styled"
it doesn't work
now if i have this: Styled: "styled-components"
i get a different problem
It looks like there are several instances of 'styled-components' initialized in this application. This may cause dynamic styles not rendering properly, errors happening during rehydration process and makes your application bigger without a good reason.
Do you have Styled exposed on the global scope?
which is the reason i'm doing this to begin with
exposed on global scope? i mean i just import in normally
@AlexBollbach Where do you figure it'll get it from?
If I say, in code, const { injectGlobal } = Styled;
No imports and no nothing
Where would Styled come from?
global var
i haven't done that anywhere i know of
@AlexBollbach There's your problem.
14:49
how?
@AlexBollbach Like I told you, externals is literally string replacement in your source code
It implicitly relies on the fact that wherever you write as the external value will work
It can't enforce that.
For example
but what is my problem? i'm doing what you've told me
@AlexBollbach If Styled is not globally available, your code will fail at runtime
externals: {
  foo: "{x: 42}",
}

// snip

import { x } from 'foo';
console.log(x); // 42
so it externals "is just string replacement" than how do i make it global available
there isn't anything in the externals docs that says "you need to then go to X to make Y globally available"
@AlexBollbach Normally, you add it onto your HTML template directly from a CDN
14:52
its more like, "you need to make sure your target environment has the package" . which i know it does
webpack.js.org/configuration/externals literally the first example here.
i'm not using script tags
Then you can't use externals.
what? it only works with script tags? thats crazy
most people using webpack are using npm and node_modules
I don't understand you @AlexBollbach
You can just not use an external and bring styled-components from npm
+ you are most definitely using at least 1 script tag for your bundle
14:54
"The bundle with external dependencies can be used in various module contexts, such as CommonJS, AMD, global and ES2015 modules."
You are specifically asking about bringing an external which is what you use with a script tag
i mean i have a script tag to include my apps bundle
Right, do you also have one for styled-components or are you installing that from npm?
If the latter - then you don't need any configuration or externals
@AlexBollbach Yes, but then they aren't externals
Externals imply that they come from outside the project.
Which is exactly their point.
right its not immediately obvious that "outside the project" is synonymous with an html <script> tag
14:55
It's not
@AlexBollbach What did you think it means?
You can include one bundle in another bundle
For example - and one bundle defines a global and the other uses it as an external
@BenjaminGruenbaum Let's not go down that rabbit hole though
that its not my libraries responsibility to bundle Styled-Components in the bundle file that the depending app's import
That's not what he's after here.
14:56
There are other cases - but "external" means "external to the module tree"
honestly i think its wrong to say it requires a script tag
@AlexBollbach you are writing a library another app is using?
@AlexBollbach So assuming that that's exactly how it works
And it just doesn't bundle styled-components in your bundle
Where would it get styled-components from?
my depending app creates a bundle. in that bundle Styled-Components exists. my app imports my library. that library is the one declaring SC as an external
@AlexBollbach Sure, but then it's locked inside of that bundle's scope
14:57
i'd get styled-components from the context of my depending apps bundle which does install it
@AlexBollbach oh, in that case you need to include styled components with a script tag or load it and export it as a global variable on window from your app because the bundle is looking for it there - and it's that library's fault.
so maybe i need to declare SC as a separate chunk or something. not that the docs make that clear
Are you the library or the app requiring the library?
i'm making the lib. it "imports" SC. i'm also making the host app. it imports my lib. and it also imports SC
externals says, don't bundle up SC here, assume the target environment (depending app that imports lib) will "have it".
it didn't suggest "have it" can only mean imports it via a script tag
it says that many module formats are support.
global being only one
should i just use rollup? because this doesn't seem to be working out honestly

« first day (2873 days earlier)      last day (2297 days later) »