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 :)
Related
Currently I'm working in a version of React and have an array of strings and JSX.Elements. For example, the array would look like this: [<span class="name">JCrew0</span>, "edited this document"]. I'm then trying to display the elements of the array next to each other to make a sentence. However, because each element is on its own, the wrapping applies to each element separately, causing the spans and the strings to wrap by themselves. This then causes all sorts of weird formatting. Is there any way to combine these array elements into one JSX.Element while still applying the styles from class="name" onto the names (wrapping them in an outer div does not work)?
Perhaps you need something like this (if I assume correctly this small array is just array in array and it will stand this way):
arr.unshift(<p>);
arr.append(</p>);
const elementString = arr.join('')
I am having a little problem with xpath in seleniumdriver.
I would like an xpath locator to narrow down its selection via two variables using exact matching at different points of the node hiearchy. This part is done.
You may imagine my case as addressing a two dimensional array in the xml with xPath, with each dimension being given as the two variables I have in it(they are standard text searches via js variables, not xpath variables).
What I'm struggling with is the resulting construction does not tell the difference between the elements of the first dimension, so as long as the given variable value is one of the dimensions, it will address every element in the second dimension fine. I can not assume they are unique or they are in any order. I am using it for testing so this is not acceptable.
How can I form an expression that will not doesn't do the same mistake?
I have tried the 'and' expression but both selenium and xpath tools say the value is '1' for 'found' but it doesn't give me a node locator to work with.
Example, my structure looks similar, so addressing it properly by x1/y1 for example looks fine.
//x1//y1
//x1//y2
//x2//y3
//x2//y4
//x3//y5
//x3//y6
Should work, works ok.
//x1x//y1
//x1x//y2
//x2x//y3
//x2x//y4
//x3x//y5
//x3x//y6
(Giving nonexistent input as 1st dimension.) My input is not fault tolerant, I look for exact value so the tests fail here as they should.
//x2//y1
//x2//y2
//x3//y3
//x3//y4
//x1//y5
//x1//y6
DING, the locator finds y values here when it should not(the y vales are on different leaves of the node tree). I need help with this.
Here is the locator in question:
return element(by.xpath(".//div[#name='typeList']//div[.//text()='" + moduleName + "']//div[./text()='" + typeName + "']")).getText();
TypeList is the name of the owner element, it does not make any differnece if I remove it, but please keep it in mind when giving me examples.
In the end, it was indeed a syntactical problem, before the text keywords.
I was trying this
//div[./text()='Zero']//div[./text()='Number']
Instead, I needed something like this.
//div[.//text()='Zero']/div[.//text()='Number']
Apparently the first one does looks for 'Number' regardless the value of the first constraint as long as every is defined in my file(does not have to be in its upward xnode path.)
As a final note, I advise against using the chrome xpath helper as its behavior is near random, it gives different results after deleting and replacing the same expression. Ugh. The only other one for chrome is adware... I figured my result out by trial and error with the firefox xpath checker tool.
1, I ended up needing to additionally add an node upwards for the element for angular select ui tool(we use selectize.js, a searchable select box), else it was confused what to return, but this is unrelated to the original question as I tried that before with the original expression.
2, I also had to add a node between the first and second text search, else it would look for the second expression in the first one too, eg. looking for Number in Zero, and treat it like a valid value if found. The problem still occurs the other way around, this can be fixed too by applying additional type/name constraints in the first one(not in final example to save space).
So this is what I ended up with:
.//div[#name='typeList']//div/div[.//text()='Zero']/div/div/div[.//text()='Number']
I'm trying to get the values of all selected checkboxes with the following code to insert them in a textarea.
$('input[name="user"]:checked').each(function(){
parent.setSelectedGroup($(this).val()+ "\n");
});
but i always get only one value.
How to write the code in a correct way to get the value of ALL selected checkboxes?
Thanks ahead!
EDIT
1) "parent" because the checkboxes are in a fancybox.iframe.
2) setSelectedGroup in the parent window is
function setSelectedGroup(groupText){
$('#users').val(groupText);
You are getting all the values, simply on each loop through the collection you're passing a new value to setSelectedGroup. I assume that method replaces content rather than appending so you are simply not seeing it happen because its too fast.
parent.setSelectedGroup(
//select elements as a jquery matching set
$('[name="user"]:checked')
//get the value of each one and return as an array wrapped in jquery
//the signature of `.map` is callback( (index in the matching set), item)
.map(function(idx, el){ return $(el).val() })
//We're done with jquery, we just want a simple array so remove the jquery wrapper
.toArray()
//so that we can join all the elements in the array around a new line
.join('\n')
);
should do it.
A few other notes:
There's no reason to specify an input selector and a name attribute, usually name attributes are only used with the input/select/textarea series of elements.
I would also avoid writing to the DOM inside of a loop. Besides it being better technique to modify state fewer times, it tends to be worse for performance as the browser will have to do layout calculations on each pass through the loop.
I strongly recommend almost always selecting the parent element for the parts of the page that you're concerned with. And passing it through as the context parameter for jquery selectors. This will help you scope your html changes and not accidentally modify things in other parts of the page.
I've been playing around with the isotope plugin and I think it's great!
However, it's only keyword based. What If I want to do some math filtering like adding a class: .age-35. Then, in my filter I want to select for example age > 30.
Is something like this possible or isn't this what isotope is designed for?
I've been trying to find some fiddles on the use of 'number filtering' but I can't find anything.
The sort methods just need to return a number for each supplied element. It is called once for each element that needs sorting (i.e. the visible ones). What number it returns is up to your imagination.
e.g. You can extract attribute values from any part of the element (class, data-???, etc) and parse them into a number then return the number.
I'm trying to write some javascript that will stack objects by setting z-index.
Test Case:
http://christophermeyers.name/stacker/
I've hacked that together, but I'd like to extrapolate that behavior to something a little more logical. That is:
Given x number of elements, when element C is moved to the top, all elements above that element must move down 1, while all elements below that element should remain in place.
A "linked list" makes for a good data structure when you're doing this kind of thing. Keep track of the order of your stackable elements via a series of simple nodes..
// ListNode
{
value: {}
next: {<ListNode>}
}
..and update the sequence as new nodes are added or selected.
I have posted a working example of a list being used for depth sorting at the following URL:
http://aethermedia.net/sandbox/depth-sorting.html
Sorry I don't have time to pull up a more appropriate tutorial =/