MountainWest JavaScript 2014

Mejorando las trazas de error de JavaScript

Todd Gardner  · 


Extracto de la transcripción automática del vídeo realizada por YouTube.

all right oh honey he talks about afternoon everybody hopefully there's not too much overlap with jaemin's talk I'm gonna be talking about air handling on the client side so we've seen a lot of really cool JavaScript technology last two days

but this afternoon I'd like to talk a little about what do we do when it all falls on its face this talk is called traces of airs and it's about first actually getting stack traces in your client-side code and then getting better stack traces but why

is that important because whenever you're trying to show something awesome to your customers to your clients to your users or to a roomful of developers inevitably a large percentage of the time it will blow up right in front of you and will blow up in

very unexpected ways that may or may not tell you anything interesting about what happened or what went wrong you can fix this one I get this all the time so errors are inevitable they're usually costly often embarrassing but if we take a little bit of

time to instrument our client-side code and expect that errors will happen and get better information about them hopefully we can feel a little bit less like and maybe a little bit more like so let's talk a little bit about air handling in the client side

I'm Todd Gardner I'm from Minneapolis Minnesota so it's way warmer here than where I'm from I'm a co-founder of a company called Trek gist which is a client-side air handler if you're looking for one I tweet it tot H Gardner sometimes

angrily about JavaScript things that I don't like so feel free to heckle me there alright so here's what I want to talk about today first some basics about the JavaScript error object in the browser and how it was implemented over and over and over

again and then we'll talk about the paths that airs take through client-side code which are sometimes unexpected to people who don't primarily program in JavaScript and then we'll talk about some custom paths that we can force our heirs down to

get some better information about them so I'm good all right so let's start with mdn what does it have to say about the error object it's pretty straight forward we get it instances of errors by instantiating through the air function we can pass

a few things to it and get some interesting things out things we'd expect in any you know modern language you know the message where it came from a stack trace about what was executing at the time this is easy enough like why aren't why are we even

caring about this why did you guys invited me to talk because it's not that simple it is not that simple Ben Cisco says no this is what the error object in the client-side really looks like it's terrible this is these are all infuriating despairing

things that you'll encounter when trying to actually work with an error object across the browser's that real people use not just latest chrome it will make you despair and will make you feel like the whole Internet is broken and nobody cares so let's

take a look I got a little demo so I have several demos today umm they're all vanilla Jeff's not doing anything fancy here the only thing that I really bring in here is this little utility library that does something very boring and ugly so I'm

not going to bother showing you the code it takes an object and an element and print recursively prints every property on that object into it just so we can see what's going on in this case I'm just gonna create a new error object with a simple message

and I'm gonna print out what that error looks like into the Dom so we can take a look at it let's start with Firefox here's what the error object looks like we got it looks pretty close to what mdn told us it was going to be right we have our name

or message or file number a line number a column number that's that's a zero which seems kind of weird and a stack trace so that's cool well let's take a look at Chrome what's Chrome look like well that's not the same that's not

the same at all it looks like Chrome treats the air object particularly the stack trace is like a catch-all of like all the information you do going to be is in this formatted string and nowhere else there's the name of the air air and example error and

[ ... ]

Nota: se han omitido las otras 2.161 palabras de la transcripción completa para cumplir con las normas de «uso razonable» de YouTube.