« first day (2787 days earlier)      last day (2159 days later) » 

12:00 AM
or rebol experience
or regex
well, I do have some regex experience, but not as much as you
I don't find it fun, for one
 
 
3 hours later…
2:57 AM
morn
 
3:24 AM
How did I lose my streak? I was here yesterday.....
 
3:37 AM
0
Q: Uint8Array to image in javascript

Icche GuriI have Uint8Array named frameBytes. I have created RGBA values from this byte array by this code . for(var i = 0; i < frameBytes.length; i++) { imgData.data[4*i] = frameBytes[i];// red imgData.data[4*i + 1] = frameBytes[i]; // green imgData.data[4*i + 2] = frameBytes[...

@littlepootis , can you help me in this regards ?
 
3:55 AM
I don't know, but I'm too lazy.
 
4:17 AM
Does anyone have experience using a critical CSS webpack plugin?
Or even with any module bundler :P
I'm trying to figure out what would be best with a multii-page website where each page's critical CSS would differ. I can't take the inlined styles out of the CSS file since all paegs share the same CSS file
I'm wondering if it's worth it to keep all the CSS in the bundled CSS, or if I should find a way to find common-inlined CSS and remove just that
 
 
6 hours later…
10:07 AM
Should I use var name = null or var name = undefined
This room is dead then where I will ask Js question :(
 
nobody can tell you whether you should use null or undefined, it clearly depends on what you're trying to achieve
in fact you don't need to initialise a variable at all, it will be undefined by default
 
10:35 AM
oh thanks @jAndy I am creating list in js, if it is empty,
 
@littlepootis chat doesn't count for the streak
 
 
2 hours later…
12:55 PM
That is sad.
This chatroom has dieded.
 
@littlepootis the best part of that link to me is that it has an attempt to load onbeforeunload = "rebecca.blackfriday" which horribly fails in chrome
if you view the source
 
Why does it fail in chrome?
It works for me.
 
You can't load another page on the unload page I thought
i have an updated version of chrome so it must be different then yours
or maybe a setting I have disabled
 
What version of chrome are you on?
Works on 66.0.3359.181
 
mine says popup blocked
66.0.3359.181
 
12:58 PM
Should probably fail if you have ScriptSafe or something similar.
That's interesting.
 
I have no extensions enabled
except a user agent one
 
That's concerning
 
there is probably a pop up setting
 
Yeah, in content settings.
 
a fallback redirect would be a better idea after let's say 5 seconds
 
1:13 PM
No, that's not what that page is indented for. People who click on that link usually expect to find something interesting. When they find out they've been pranked and lost the game, they feel the disappointment in themselves growing. Most immediately close the page, only to encounter something more sinister: a Friday video. They fell twice, and in both instances, it was due to their own conscious decision. Now they're even more disappointed in themselves.
Fun fact: It's a prank two years in the making: github.com/erikroyall/erikroyall.github.com/commit/…
 
yeah but if it dosen't work in any of my web browesrs it isn't particularly good prank. I don't think I even changed these setings but I'm not sure]
 
It works on default settings
 
not on safari
 
People who use safari are already disappointed in themselves.
 
I'm on opera, and it doesn't work
I do have an adblocker and some more stuff on
 
1:17 PM
there aren't any other web browsers really on iOS
 
but other than the adblocker, I can't think of anything that might untrigger it
 
They all use the same rendering engine
 
@towc You already fell for it.
 
because opera is a disappointment?
if you're talking about my reply, I checked the source and imagined what would have happened
 
is opera just chrome now
 
1:20 PM
almost
 
1:54 PM
@Loktar nothing much, been away from webdev for a while, guess I lost a bit of motivation and my internet hasn't been helping at all.. Besides that things are fine! :)
What about you? Haven't been around in the chatroom for a while, anything going on lately?
 
2:38 PM
@IanC loktar got like 3 new kids since you were last here
 
 
1 hour later…
4:02 PM
@HatterisMad I may have already sent you this but if you want a battery case that makes your iPhone indestructible in my opinion get the snow Lizard case. They are out of stock right now but it is the single best investment I have made in the last couple months. I recall you said I believe your father kept breaking the iPhones.
My phone lasts like a day and a half now.
 
4:39 PM
Question about promises, someone here ?
 
@SpazaM 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.
 
hey guys, I need help. Has anyone worked with Typescript and React together?
 
hey somebody knows how to cofigure webpack with ecmascipt2018?
 
yes I can help you kt
 
for this get Syntax error:

            let obj = {
                a: 3
            }
            let obj1 = {
                b:5
            }
            let merged = {...obj, ...obj1};
es6 syntax work fine
@55
@55Cancri what should i change?
 
4:48 PM
do you have .babelrc file
 
YES
 
do you have this set: "presets": ["env", "stage-0", "react"]
 
here:
{
    "presets": [
        "env"
    ]
}
 
add stage-0
and download package
download on npm as ""babel-preset-stage-0": "^6.24.1","
""babel-preset-stage-0"
 
thank you i will try
 
4:51 PM
let me know if it works
 
it works :)
 
cool!
 
5:08 PM
hey guys, I need help. Has anyone worked with Typescript and React together?
 
5:29 PM
Hello, good evening from Athens!
I have a question: I make this for a pacman game.

https://jsfiddle.net/58bfuarL/

Now i want to fill with blue color.

How can i do that?
 
6:24 PM
@55Cancri Yes.
 
hello, you are familair with the php, right?
 
@ten5 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.
 
when you create an non-oop app, any; we do html/css first, then dir/file structure, then the database design and the php coding next; how to we do that; like the html to database and the other way around joining first, or how would this go?
 
@ten5 You're here too?
 
yes, trying to get some info as they will not tell me these things in the PHP room
you know how to code, in practice?
 
 
2 hours later…
8:16 PM
madara, hi!
@MadaraUchiha you there bud?
 
8:28 PM
you said you know typescript and react?
@MadaraUchiha have you ever used typescript with react router?
 
@55Cancri We use react-router 3 at work
But just ask your question :)
 
So its two questions
the first is using computed types
 
1 message moved to Trash can
@55Cancri Please don't post unformatted code - hit Ctrl+K before sending, use up-arrow to edit messages, and see the faq.
1 message moved to Trash can
 
  onFieldChange = ({ target }) => {
    let { name, value }: { name: keyof IState; value: string } = target
    this.setState({
      [name as any]: value
    })
  }
 
1 message moved to Trash can
@55Cancri Please don't post unformatted code - hit Ctrl+K before sending, use up-arrow to edit messages, and see the faq.
 
8:34 PM
there we go!
So that line is giving me the error: Argument of type '{ [x: number]: any; }' is not assignable to parameter of type 'ClassState | Pick<ClassState, "email" | "password" | "errors" | "username"> | ((prevState: Readon...'.
Type '{ [x: number]: any; }' is not assignable to type '(prevState: Readonly<ClassState>, props: ClassProps) => ClassState | Pick<ClassState, "email" | "...'.
Type '{ [x: number]: any; }' provides no match for the signature '(prevState: Readonly<ClassState>, props: ClassProps): ClassState | Pick<ClassState, "email" | "password" | "errors" | "username">'.
Here is the class' interface:
interface IState {
  email: string
  password: string
  errors: {
    email: string
    password: string
    global?: string
  }
}
 
Which line gives off the error?
The setState?
 
this.setState({ [name as any]: value })
 
I have another function that submits the values:
if (this.state.email.length === 0) {
  this.setState(prevState => ({
    errors: {
      email: 'email field cannot be blank',
      password: prevState.errors.password
    }
  }))
} else if (this.state.email.length > 0) {
  this.setState(prevState => ({
    errors: {
      email: '',
      password: prevState.errors.password
    }
  }))
 
What happens if you cast value to any as well?
 
8:37 PM
the error references prevState, which I use in the if / if else statement
 
Just for test's sake?
 
same error
 
What if you change it to this.setState({email: 'test'})?
 
If I do that though, wont I lose access to the previous state?
 
You don't have access to the previous state in your first example
 
8:40 PM
prevState returns the previous state, which I then use in the password field
as: password: prevState.errors.password
 
6 mins ago, by 55 Cancri
  onFieldChange = ({ target }) => {
    let { name, value }: { name: keyof IState; value: string } = target
    this.setState({
      [name as any]: value
    })
  }
Not in this one ^
 
right right, in the if statement
oh!!
wait, are you saying I should add prevState to onFieldChange too?
 
No, that's not what I said.
I'm trying to isolate the problem. What happens when you completely ignore name and value, and just use a random test value in there?
Like this.setState({password: 'test'})
Does that make the error go away?
 
you want me to do that onFieldChange or onSubmit (which has the prevState)?
 
what is the best library for routing reactjs
 
8:43 PM
@55Cancri Which one has the error?
 
onFieldChange
 
There, then.
 
preferred library for routing in reactjs?
 
yes! It does remove the error!
'password': 'hi' works
 
8:45 PM
but [name as any]: value does not
 
My guess is that since value is not string (in the case name is 'errors'), you get the error.
 
however, I need the [name]: value so it can accommodate any field change
 
can yall help me
tf
 
hmmm that is interesting...
 
Humor me, remove the cast on any, and define name to be of type 'password' only
... {name: 'password', ....
onFieldChange = ({ target }) => {
  let { name, value }: { name: 'password'; value: string } = target
  this.setState({
    [name]: value
  })
}
Does that one work?
 
8:48 PM
Again, problem solved!!
dude, that is so awesome!
but I just don't understand..
so should name be cast to any too, instead of "keyof IState"?
no, doesnt solve it
 
The problem is, despite the confusing error, that name (under keyof IState) could be 'errors'
 
how can I accomodate errors, an object, while the rest are strings? That is essentially the problem right>
 
And then value cannot be a string
 
so why doesnt value cast as any work?
 
@55Cancri Because setState has its own type
Which is stricter than your any
If you were to cast the whole object to any it would have worked
setState({[name]: value} as any)
But the correct way is, If you can say for certain that name can most definitely not be 'errors' (because there's no such field, for example)
To use Exclude
What version of TypeScript are you using?
 
8:51 PM
2.9.1
 
Great
If you say that name is of type Exclude<keyof IState, 'errors'>, it should work
And still maintain type information
(No further casts needed)
This basically reads as "Exclude 'errors' from the keys of IState"
So equivalent to 'email' | 'password' in your case
(as opposed to 'email' | 'password' | 'errors' of just keyof IState)
 
like this?
  onFieldChange = ({ target }) => {
    let {
      name,
      value
    }: { name: Exclude<keyof IState, 'errors'>; value: string } = target
    this.setState({
      [name as any]: value
    })
  }
 
@55Cancri No, without the as any
 
it still gives me errors unfortunately!
 
Did you see the "without the as any" part?
 
8:56 PM
yes I removed it
 
Same error?
 
its now [name]: value
honestly, I think its still reading the errors key
here is message:
Argument of type '{ [x: number]: string; }' is not assignable to parameter of type 'IState | Pick<IState, "email" | "password" | "errors"> | ((prevState: Readonly<IState>, props: IP...'.
  Type '{ [x: number]: string; }' is not assignable to type '(prevState: Readonly<IState>, props: IProps) => IState | Pick<IState, "email" | "password" | "err...'.
    Type '{ [x: number]: string; }' provides no match for the signature '(prevState: Readonly<IState>, props: IProps): IState | Pick<IState, "email" | "password" | "errors">'.
 
I don't understand why it would think that the type of the object is { [x: number]: string }
Can you move the object to a variable and call setState on that?
const x = {[name]: value};
this.setState(x);
Then put your cursor over the x and tell me what the editor thinks its type is?
 
setState + computed properties <3
 
8:59 PM
a string in that case
 
@55Cancri What? x can't be a string
 
[x: string]: string
 
Okay
And still an error, right?
 
yep
  onFieldChange = ({ target }) => {
    let {
      name,
      value
    }: { name: Exclude<keyof IState, 'errors'>; value: string } = target
    const x = { [name]: value }
    this.setState(x)
  }
 
Now try to cast x to { [key in Exclude<keyof IState, 'errors'>]: string }
Does that resolve the error?
 
9:01 PM
ew, destructuring in typescript is ugly, like ternaries
 
so within setState(), I would write: x: [key in Exclude<keyof IState, 'errors'>]: string
?
sorry, I actually don't have much experience with typescript. I am actually trying to start using a previous react project as a template
 
the microsoft github thing is not a joke btw
 
Bah
This is getting needlessly complicated.
About at this point I'd probably cast to any and be done with it.
this.setState({[name]: value} as any);
That should definitely squelch the error.
There's no real need to save type information here, the function returns a void regardless.
We have a loose company policy to comment on every any though, so I advise you to cast to any and add a comment saying why the any is there (because fighting with the type-system was getting complicated, and it's not as important here)
Interesting problem though
You could probably solve it correctly with a generic
But hell, that's overkill IMHO
 
damn dude, you really know your stuff. It definitely worked. Thank you so much for that! I honestly hate to burden you with one final problem, but you be willing to help me with it?
 
9:08 PM
so this last problem involves react router. Typescript is giving me 6 errors, but it is really a single error that would fix all of them, I know it.
they are custom components I made that use the regular route, but add authentication to it.
Root route file:
import React, { Component } from 'react'
import { Router, Route, Switch, RouteComponentProps } from 'react-router-dom'
import { connect } from 'react-redux'
import createHistory from 'history/createBrowserHistory'

import PrivateRoute from './PrivateRoute'
import PublicRoute from './PublicRoute'

import SplashPage from '../components/SplashPage'
import LoginPage from '../components/LoginPage'
import SignupPage from '../components/SignupPage'
import SettingsPage from '../components/SettingsPage'
thats the root router file and the error is occurring on all five routes of both public route and private route (but not the regular route)
this is the error:
Type '{ exact: true; path: string; component: () => Element; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<Pick<Props, "startLogout"> & OwnProps, C...'.
  Type '{ exact: true; path: string; component: () => Element; }' is not assignable to type 'Readonly<Pick<Props, "startLogout"> & OwnProps>'.
    Property 'history' is missing in type '{ exact: true; path: string; component: () => Element; }'.
same error for each line
 
Well, how are the PublicRoute and PrivateRoute implemented?
At least from a types point-of-view?
 
and this is the private route component, which I am sure is the culprit, because ""startLogout" is a prop from redux
I'll just post privateroute:
import React, { Component } from 'react'
import { Route, Redirect, RouteComponentProps } from 'react-router-dom'
import { connect } from 'react-redux'
import Header from '../components/Header'

interface OwnProps extends RouteComponentProps<any> {
  component: any
}

interface StateProps {
  isAuthenticated: Boolean
}

interface DispatchProps {
  startLogout: () => void
}

type Props = StateProps & DispatchProps & OwnProps

class PrivateRoute extends Component<Props> {
  render() {
    const { isAuthenticated, component: Component, ...rest } = this.props
 
Well, for starters
You made isAuthenticated and startLogout mandatory
But you aren't passing them
 
Well I add the elvis operator isAuthenticated?: Boolean
but i still get the errors
 
I'm almost sure the culprit is startLogout
 
9:17 PM
you are referring to the two interfaces right?
 
Try adding a ? on that
(BTW: Boolean is a mistake, use boolean)
 
I think the error is shorter than the others now
it says:
Type '{ exact: true; path: string; component: () => Element; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<Pick<Props, "startLogout"> & OwnProps, C...'.
  Type '{ exact: true; path: string; component: () => Element; }' is not assignable to type 'Readonly<Pick<Props, "startLogout"> & OwnProps>'.
    Property 'history' is missing in type '{ exact: true; path: string; component: () => Element; }'.
with everything that you told me to change
 
I'm unsure of why it expects history
The best I can guess is that maybe RouteComponentProps is the wrong interface to extend from?
 
i will look up other types related to react router
 
@55Cancri I believe you want RouteProps
export interface RouteProps {
  location?: H.Location;
  component?: React.ComponentType<RouteComponentProps<any>> | React.ComponentType<any>;
  render?: ((props: RouteComponentProps<any>) => React.ReactNode);
  children?: ((props: RouteComponentProps<any>) => React.ReactNode) | React.ReactNode;
  path?: string;
  exact?: boolean;
  strict?: boolean;
}
export class Route<T extends RouteProps = RouteProps> extends React.Component<T, any> { }
According to the react-router's types ^
RouteComponentProps is the type of the props of the component that the route would render
So for example if component={HomePage}, HomePage will be expected to have history etc etc in its props.
 
9:27 PM
I see what you are saying
trying to implement now
hey man @MadaraUchiha
 
Did it work? 😉
 
dude, flawlessly. Do you have a paypal or something? I would like to send you $10. I get paid at the end of this week and I can send you the money by then.
 
@55Cancri Heh, no need for that, if you have the money to spare, donate it to a charity of your choice for me ;)
 
Are you sure man, because I've been stuck on these errors for the last day and a half, racking my brains and scowering the internet for every article I could find on the errors, and honestly without your help, I probably would have been screwed for my presentation in a week.
 
@55Cancri I'm sure, I really appreciate the offer though :)
 
9:37 PM
Well, you have no idea the depth of my gratitude. I am truly indebted to you. If you need anything, ANYTHING, please reach out to me and I will definitely try to help you in anyway I can! I mean it too! I am not just saying that. If you need anything, just let me know. ;D
anyway, take care Madara. And thanks again.
 
 
1 hour later…
11:06 PM
@towc :(
change of rules likely then
i host my sites there for free now
 
@ketimaBU 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.
 

« first day (2787 days earlier)      last day (2159 days later) »