|
Really simple Vanilla JS question: I've got a list of things like this:code:
code:
|
# ? Oct 16, 2019 16:41 |
|
|
# ? Jun 10, 2024 10:33 |
|
Arrays are indexed, and the callback to forEach takes the index as the second argument, so just select the next index?
|
# ? Oct 16, 2019 17:22 |
|
LifeLynx posted:Really simple Vanilla JS question: I've got a list of things like this: You just want to do event.target.nextElementSibling.classList.add('faq-show'); since the event will tell you which element was clicked and you just want the next one in document order. Re-querying the whole document will 'start from the top' every time, not from the event target, since document is, well, the whole document. Example: https://jsfiddle.net/zn5qctLj/
|
# ? Oct 16, 2019 17:27 |
|
also consider looking into the summary and details elements if the compat matrix looks okay for you https://caniuse.com/#feat=details https://developer.mozilla.org/en-US/docs/Web/HTML/Element/summary https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details
|
# ? Oct 16, 2019 18:19 |
|
How do I easily section of code into seperate blocks? I'm just writting <code>// Section name ----------------------</code> manually. I'm 99% sure there is a short cut or something to save me from manually writing all those dashes and then modififying them when I change them. With JSDOC I just write /** enter and it autocomples most stuff. What's the equivilent for making section headers, or should each roughly group functions in be seperate files?
|
# ? Oct 21, 2019 00:44 |
|
Maybe some more context? It sounds like you might want region folding which is editor specific. I use vscode and do this: code:
|
# ? Oct 21, 2019 00:49 |
|
The Fool posted:Maybe some more context? It sounds like you might want region folding which is editor specific. I want to be able to add somekind of comment that the outline view would then see eveyrthing between them as a group. With JSDoc its quite simple, surefly there is an extension or someting simple for section titles or whatever. I kind of want tags that are visiual and break up the source code but also folding might be useful. So you can clearly hae the anxilliary functions in the same place. Here is an example, you may not be want to see what the code does. I mainly trying to figuire out the best way use section headers, could I minimise all the code I'm, not working at. code:
FSMC fucked around with this message at 01:34 on Oct 21, 2019 |
# ? Oct 21, 2019 01:25 |
|
FSMC posted:I kind of want tags that are visiual and break up the source code but also folding might be useful. So you can clearly hae the anxilliary functions in the same place. Here is an example, you may be want to see what the code does. I mainly trying to figuire out the best way use section headers, could I minimise all the code I'm, not working at. I can barely parse the grammar/spelling of this post and I gave up.
|
# ? Oct 21, 2019 01:32 |
|
Thermopyle posted:I can barely parse the grammar/spelling of this post and I gave up. ME to and gave it a quick rewrite
|
# ? Oct 21, 2019 01:35 |
|
FSMC posted:How do I easily section of code into seperate blocks? I'm just writting <code>// Section name ----------------------</code> manually. I'm 99% sure there is a short cut or something to save me from manually writing all those dashes and then modififying them when I change them. With JSDOC I just write /** enter and it autocomples most stuff. What's the equivilent for making section headers, or should each roughly group functions in be seperate files? Having files with so much functionality stuffed into them that you need to demarcate the different sections is usually a code smell, and I think you're on the right track with splitting them into separate files. How big are the files you're typically splitting up into sections? How do you normally decide when to split things out into their own section?
|
# ? Oct 21, 2019 02:33 |
|
FSMC posted:ME to and gave it a quick rewrite
|
# ? Oct 22, 2019 00:28 |
|
FSMC posted:I want to be able to add somekind of comment that the outline view would then see eveyrthing between them as a group. Still sounds like #region's
|
# ? Oct 22, 2019 00:40 |
|
I'm doing my first project using Firebase, just a simple little web frontend for a database so my family can make suggestions for my next project. I'm pretty sure I'm doing something wrong, because I've gotten it working on my local machine, but when I push my changes up to Github, CI keeps timing out in the test step. I've managed to nail it down to the part where I actually read data from the database, so I think it's because I don't close the connection, but I'm not sure how to do that. I'm also not sure about the addNewIdea method; there's got to be some better way to convert docRef back into a document to add to the state. code:
code:
|
# ? Nov 10, 2019 23:05 |
|
Have you ever successfully run simple tests through Github's CI? Are the tests attempting to connect to a real Firebase server? It's entirely possible that the test runner is in a system configured by Github to prevent most outbound connections. You might prefer not to set up a replacement for the real Firebase to use for testing in Github’s CI environment but you may or may not be able to access the real Firebase when running tests in that environment.
|
# ? Nov 10, 2019 23:26 |
|
prisoner of waffles posted:Have you ever successfully run simple tests through Github's CI? Are the tests attempting to connect to a real Firebase server? It's entirely possible that the test runner is in a system configured by Github to prevent most outbound connections.
|
# ? Nov 11, 2019 00:09 |
|
Can soneome help me figure out why my files are corrupted after being uploaded to an S3 bucket? After missing a bunch of files due to a crashed process, I've decided to take the plunge and write my first Lambda function that pulls data from a web address every hour and dumps it into an S3 bucket for eventual processing. I've managed to cobble together the following script in node.js and it manages to pull the file and shove it into S3, but it arrives un-extractable and corrupted: code:
|
# ? Nov 18, 2019 07:20 |
|
Just clarifying, the files youre pulling from that url are already compressed right? With bz2?
|
# ? Nov 19, 2019 03:16 |
|
You may need to use a Buffer instead of a String to hold onto the body so you can pipe it as binary instead of whatever JS is doing under the hood when concatenating to a string. Depending on the size of the file you're downloading you may also want to look into streaming the download into the S3 upload so you don't have to save it all in memory before writing to S3.
|
# ? Nov 19, 2019 04:46 |
|
I haven't been seriously into Javascript since, like, 2014. What's the best reading material (online or printed) to get me caught up on how all this poo poo works now? For context, I'm writing a web UI using Svelte. I find myself developing my own idioms for dealing with promises and such with no idea what the standard idioms are, if they even exist.
|
# ? Nov 19, 2019 19:26 |
|
Ha, my magical code destroys the profiler, fixed something else and now it actually works. Awesome. MrMoo fucked around with this message at 20:32 on Nov 19, 2019 |
# ? Nov 19, 2019 19:56 |
|
rt4 posted:I haven't been seriously into Javascript since, like, 2014. What's the best reading material (online or printed) to get me caught up on how all this poo poo works now? I’m partial to MDN, myself.
|
# ? Nov 20, 2019 00:03 |
|
I was in a similar position a year ago. The landscape since 2014 has changed so much, and now it feels essential to use tools like Babel and Webpack. But there's so many tools that it's overwhelming. I found it useful to install a framework where it was all setup for me. I think create_react_app does that; even though it's suited towards teaching React, it also sorts out installing node modules, and has a starter config for Webpack, Babel, and JSX, so you can get to experimenting with new JS features quickly. As for the newer JS features, there's a million articles that summarize them if you google "Ecmascript 2018 new features". And seconding MDN as a great resource, albeit I only use it as reference docs.
|
# ? Nov 20, 2019 00:14 |
|
If you're just getting back into things (or even if you're a veteran!) I highly, highly recommend Parcel Bundler. https://parceljs.org/ It aims to be as "zero-configuration" as possible. You can immediately start using just about any modern web technology, syntax, or framework and it will just work. Want to use React? Import React into that bitch. Like SASS? Rename your CSS files to SCSS. Want to give TypeScript a try? Rename .js/jsx to .ts/tsx. Parcel will automatically detect and install any dependencies you use and add them to package.json, and supports Babel out of the box. https://github.com/jereddanielson/parcel-boilerplate
|
# ? Nov 20, 2019 06:28 |
|
I’ve been using gatsby to scaffold new projects even if I’m doing a more traditional spa and not using any its other features.
|
# ? Nov 20, 2019 06:35 |
|
http://kangax.github.io/compat-table/es5/ and the links to the other versions in the top left are good as both lists of new language features and tell you whether you'll be able to actually use them
|
# ? Nov 20, 2019 15:02 |
|
caniuse.com for browser support of web platform features
|
# ? Nov 20, 2019 15:09 |
|
If you're looking for something in print, I thought this was helpful: Understanding ECMAScript 6: The Definitive Guide for JavaScript Developers Also I took an online Udemy course on NodeJS and all the newer language stuff was covered. And I thought learning NodeJS was helpful for getting familiar with npm and the command line environment because I was previously using a framework that had its own tooling. I have also found the free online courses on The Net Ninja playlist to be very helpful when I want an intro or to brush up on something. Sometimes paid online courses can get a lot longer than they need to be and that might be because they are trying to sell them and "35 hours of video!" is a selling point. Net Ninja courses are usually like 10-20 videos of 5-10 minutes each. Also I like his accent. I haven't done this one, but here's one on CS6 that may work for you: JavaScript ES6 Tutorials
|
# ? Nov 20, 2019 17:29 |
|
Wikipedia has a nice summary of changes, https://en.m.wikipedia.org/wiki/ECMAScript Like ECMAScript 10 provides Object.fromEntries that you can use to convert a Map to an Object. Had to use that the other day. Versions 7 through 8 have important Promise and async await features.
|
# ? Nov 20, 2019 18:26 |
|
Anony Mouse posted:If you're just getting back into things (or even if you're a veteran!) I highly, highly recommend Parcel Bundler. https://parceljs.org/ don't worry, configuration is coming to Parcel v2
|
# ? Nov 20, 2019 19:29 |
|
I love using Babel so that I can use many new JS features without having to wait for browser support.MrMoo posted:Wikipedia has a nice summary of changes, That 10 year gap between 3 and 5 always makes me laugh.
|
# ? Nov 20, 2019 21:57 |
|
Thermopyle posted:That 10 year gap between 3 and 5 always makes me laugh. The Internet Explorer Dark Age
|
# ? Nov 21, 2019 16:48 |
|
I'm tackling as my next ticket a refactor of an angular component. It's pretty big, over 1,000 lines, 60 variables are being stored, and a number of functions that I think I could refactor or remove. I'm considering strategies for how to go about this- I've never done a refactor like this before. Is there any reading that anyone would recommend or tips n' tricks for handling this? Edit: I should add that the goal is not to refactor for refactoring's sake, but rather that this is one of the oldest views in the app and a lot of new functionality that is going to be added in the future is going to include it. I want to make it so that adding that new functionality is a lot easier than it currently is. Cheen fucked around with this message at 17:16 on Nov 26, 2019 |
# ? Nov 26, 2019 16:55 |
Cheen posted:I'm tackling as my next ticket a refactor of an angular component. It's pretty big, over 1,000 lines, 60 variables are being stored, and a number of functions that I think I could refactor or remove. I'm considering strategies for how to go about this- I've never done a refactor like this before. Is there any reading that anyone would recommend or tips n' tricks for handling this? Move everything that's not directly acting on gui elements into services that you unit test, and then go you can hog wild with refactoring without worrying about breaking poo poo.
|
|
# ? Nov 26, 2019 17:29 |
|
I have a way of writing js in a pattern I've found is useful and readable lately and I don't know if it's a thing or if it's not good but it's a way I think works.code:
Basically all constructors fire an init which sets the class in motion once the Constructor is done, then methods are used to handle major areas of class functionality and sub functionality inside those classes are handled with expressions. I find this very readable and nice to work with.
|
# ? Nov 28, 2019 23:08 |
|
Ape Fist posted:I have a way of writing js in a pattern I've found is useful and readable lately and I don't know if it's a thing or if it's not good but it's a way I think works. It might feel less weird with a more substantial example. I'm not really sure i get it other than using methods to name individual pieces of functionality which is cool and good.
|
# ? Nov 28, 2019 23:14 |
|
model.vehicle.get('device.type') returns a promise. model.vehicle.get('device.type.id') returns the value of the id field directly. Ember! Never having any idea what type or shape the data is that I'm going to get without trial and error for the epic win!
|
# ? Dec 4, 2019 11:58 |
|
Given this type:code:
code:
|
# ? Dec 8, 2019 19:50 |
|
Is there a way to use some kind of a background worker script (similar to a service worker or a web worker) in TamperMonkey? I have a script that does some heavy processing when I press a button and currently it blocks the UI long enough that Firefox starts complaining about a script slowing the page down. It's not a huge deal since this script is for my own use, but I'd like to get rid of it if possible anyway.
|
# ? Dec 9, 2019 12:49 |
|
I'm trying to figure out a way to modify a dom element that is in an iframe that loads 1-2 seconds after the rest of the page. The code below works if I paste it into the console after the page has loaded, but I haven't figured out a reliable way to load it automitically. document.onload complains about the element not existing. I've been experimenting with MutationObserver, but haven't been able to get it to work yet. code:
The Fool fucked around with this message at 06:38 on Dec 11, 2019 |
# ? Dec 11, 2019 01:44 |
|
|
# ? Jun 10, 2024 10:33 |
|
The Fool posted:I'm trying to figure out a way to modify a dom element that is in an iframe that loads 1-2 seconds after the rest of the page. The code below works if I paste it into the console after the page has loaded, but I haven't figured out a reliable way to load it automitically. I'm tired and too lazy to see if the first approach is valid, but I would either: 1. Plop an event handler on the iFrame to see when it is done loading 2. Check for `segment` existing, if it does not, sleep a bit and check again in a loop until it's there (failing completely after X seconds.)
|
# ? Dec 11, 2019 03:51 |