We Keep Coding

Asserting multiple values in a single element in nightwatch.js

Ok, so what I would like to do is get all the values (in this case; colours) in the element(s) listed below;
I was wondering if I can get all these values/colours from the element in a single function or command?
To complicate things though, the class listed within the element (seo-crawl-paths__group__link) is 'dynamic', so the number of classes within the element, and thus the number of values, will change on a daily basis (i.e. tomorrow, only some of the colours will be listed in the element).
Therefore, I can't simply get the value of each individual class within the element, as the number of classes will change.
A command similar to .getValue() but for multiple values?
Many thanks :)

D3 V4 Tree Search and Highlight

So, I really love this example from Jake Zieve shown here: https://bl.ocks.org/jjzieve/a743242f46321491a950
Basically, on search for a term, the path to that node is highlighted. I would like to accomplish something similar but with the following caveats:
I would like to stay in D3 v4.
I'm concerned about cases where the path doesn't clear out on next node pick OR what happens when there are two nodes of the same
name (I would ideally like to highlight all paths)
I would like to AVOID using JQuery
Given a set search term (assume you're already getting the string from somewhere) I know I need to make use of the following lines specifically (you can see my stream of consciousness in the comments) but I'm just not quite sure where to start.
// Returns array of link objects between nodes.
var links1 = root.descendants().slice(1); //slice to get rid of company.
console.log(links1); //okay, this one is nice because it gives a depth number, this describes the actual link info, including the value, which I am setting link width on.
var links2 = root.links(); // to get objects with source and target properties. From here, I can pull in the parent name from a selected target, then iterate again back up until I get to source. Problem: what if I have TWO of the same named nodes???
console.log(links2);
Thoughts on this? I'll keep trying on my own, but I keep hitting roadblocks. My code can be found here: https://jsfiddle.net/KateJean/7o3suadx/
[UPDATE]
I was able to add a filter to the links2 to call back a specific entry. See
For example:
var searchTerm = "UX Designer"
var match = links2.filter(el => el.target.data.name === searchTerm); //full entry
console.log(match);
This single entry gives me all associated info, including the full list of all points back up to "COMPANY"
So, I can GET the data. I think the best way to accomplish what I want is to somehow add a class to each of these elements and then style on that "active" class.
Thank you!

Javascript sorting array into a tree

So let's say that I have an array, and it contains 10 elements. I want to set the first element as the root, and then if the next number is smaller, put it to the left, if larger to the right. How would I do this?

Actually, I have figured it out now. I can just set another type called tree and it has itself, leftbranch and rightbranch, and leftbranch and rightbranch are also trees.

Performance of an ordered list in Firebase

If I want to maintain an ordered list in Firebase, it seems like the best way to do it is to manually assign a priority to each item in my list. That means if I insert or remove an item from the list, I have to update the priorities of all the items following it. For an item at the beginning of the list, this means updating every item in the list. Is there a better performing data structure or algorithm to use in this case?

You can create an ordered list by setting the priority of elements appropriately. Items in a list are ordered lexigraphically by priority, or if the priority can be parsed to a number, by numeric value.
If you want to insert items into the middle of an existing list, modifying the priorities of the existing items would work, but would be horribly inefficient. A better approach is just to pick a priority between the two items where you want to insert the value and set that priority for the new item.
For example, if you had element 1 with priority "a", and element 2 with priority "b", you could insert element 3 between the two with priority "aa" (or "aq", "az", etc).
In our experience, most times when you create an ordered list, you don't necessarily know the position in the list you want to insert the item beforehand. For example, if you're creating a Leader Board for a game, you don't know in advance that you want to place a new score 3rd in the list, rather you know you want to insert it at whatever position score 10000 gets you (which might happen to be third). In this case, simply setting the priority to the score will accomplish this. See our Leader Board example here:
https://www.firebase.com/tutorial/#example-leaderboard

The Ruby gem ranked_model has an interesting approach to this problem. It uses a position integer like many other "acts as list" implementations, but it doesn't rely on re-writing all the integers on each position move. Instead, it spaces the integers widely apart, and so each update may only affect one or two rows. Might be worth looking through the readme and code to see if this approach could fit here.

What exactly does extra select() on enter() selection do?

What exactly does extra select() on enter() selection do and why does it not have selectAll()?
Now here I am probably supposed to post more text to "meet your quality standards", but I am quite sure the question is precise enough and hopefully not too stupid. I spent few days reading through various d3 tutorials and docs, and this part still escaped from me.

Calling select on the enter selection is rare; it is much more common to use append or insert instead. Yet the end result of all three of these methods is the same: it specifies how to instantiate elements in the enter selection.
When you perform a data-join, three new selections are returned:
the update selection: selected elements that correspond to the data
the exit selection: any leftover elements (no corresponding data)
the enter selection: any leftover data (no corresponding elements)
Since the enter selection is leftover data, there are by definition no corresponding elements. The enter selection thus initially contains placeholder nodes which you must instantiate into proper elements. You almost never see these nodes because you immediately tell D3 how to create the missing elements, typically by calling append or insert. These methods create new elements and insert them into the DOM. (The parent node is determined by the previous select, as described in the nested selections tutorial.)
In rare cases, you might want to do something beyond the standard append or insert for instantiating entering nodes. For example, the standard append method always creates elements of the same name (such as "div" or "rect"). If you wanted to specify the name dynamically, you could use select instead and pass in a function to create the new elements (as discussed in this thread in the d3-js mailing list):
enterSelection.select(function(d) {
return this.appendChild(document.createElement(d.name));
});
In fact, if you look at how append is implemented, you'll see that it's just a wrapper on top of select. A slightly simplified implementation is:
d3.selection.prototype.append = function(name) {
return this.select(function() {
return this.appendChild(document.createElement(name));
});
};
These example implementations are simplified because they don't deal with namespaced SVG elements. For this reason it's easier to use the built-in methods, and these examples are solely to explain how D3 works internally.

Calling .select() on an .enter() selection does the same thing it does for other selections -- you can use it to narrow down what you select further. Having .selectAll() wouldn't really make sense as the .enter() selection refers to things that are not actually there yet. Therefore you would only be able to select the entire selection again (as there're no distinguishing characteristics).