//div[text()='#{locator.strip}']/ancestor::table/../../..//a[#class='idit-grid-btn']/i[#class='fa fa-#{var}']
I have written the following watir code for the aforementioned xpath but it's not working.
element=#browser
.div(text: locator.strip)
.preceding_sibling(tag_name: 'table')
.parent
.parent
.parent
.link(class: 'idit-grid-btn')
.i(class: "fa fa-#{var}")
Where am I going wrong?
ancestor::table would be looking for a parent or ancestor element - ie up the HTML DOM. In contrast, #preceding_sibling is looking for a sibling element - ie at the same level in the DOM (with the same parent).
You need to use #parent instead:
element=#browser
.div(text: locator.strip)
.parent(tag_name: 'table')
.parent
.parent
.parent
.link(class: 'idit-grid-btn')
.i(class: "fa fa-#{var}")
Related
i'm trying to find a solution for the following. When I drag a link between elements the label text inside the elements get selected for some reason.
Lets say I have an element A with the property A.attr("body/magnet", "active"); set and A.attr("label/text", "some text"); When I create a link from that element by clicking and dragging the label text gets selected on elements the link goes through.
This seems a little bit random though as sometimes all the labels in the graph gets selected when dragging the link.
Is there a way to make the label text not to be selectable?
We solved it by adding the following label style to the shapes.
let element = new joint.shapes.standard.Rectangle();
element.attr(
"label/style",
"-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;"
);
From the answer above the links will still be selected, so you can put css on you #paper is or canvas like so
#paper {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
Working with Scala.js, I have created some SVG elements like Text, Line, Rect, and now I am trying to set the style attribute with code like this, where element is of type svg.Stylable:
element.style.fillOpacity = "0.0"
element.style.stroke = "yellow"
element.style.strokeWidth = "2"
I tried different variations of above code, but the desired style does not realize, and when I inspect the element in the Browser, the style attribute is an empty String (""). I am able to set other attributes with no problem (e.g. x, y, width, height).
How do I set the style? Thanks!
For SVG modications in Scala.js I normally use the d3 library (scala.js facade: https://github.com/spaced/scala-js-d3).
Then u can use:
d3.select("#mySvgElement").attr("style", "stroke:yellow; stroke-width:2") // etc.
*Edit: mySvgElement would be the ID of the element i want to change the style for. You can also other different kind of selectors.
I have a SelectOneMenu component with 2-column select items, like this example: http://primefaces-rocks.appspot.com/ui/selectOneMenu.jsf
How can I remove those borders between the first and the second column?
I'm getting this:
But I would like to get something like this:
I tried with CSS property border-style on column, but it doesn't work. Any suggestion?
Based on a tip from #Tiny, I managed to remove borders with the following CSS code:
.ui-selectonemenu-table td, .ui-selectonemenu-table tr{
border-style: hidden !important;
}
How to change attr width on object, I'm trying with this, but seems does not work...
jQuery('.big').click(function(){
jQuery('#flvPlayer').attr("width", "100");
});
Here is code where I need change height and width on click
<a class="big">100</a>
<textarea><object id="flvPlayer" height="665" width="425"></object></textarea>
Use .css instead of .attr.
jQuery('.big').click(function(){
jQuery('#flvPlayer').css("width", "100");
});
width is a CSS property.
Edit: In textarea you have text. Your <object> is not a HTML element. It is text in your text area.
So, just change the text in textarea.
$('.big').click(function(){
var text = "<object id=\"flvPlayer\" height=\"665\" width=\"100\"></object>"
$("textarea").val(text);
});
Also, I suggest you to use $ instead of jQuery. It's easier and faster to write.
I have a simple prob (i guess). Im trying to do a simple menu hover with jquery. On hover, the menu should show a div that contains submenus. If i hover the div, the div should stay visible to select the submenu. Otherwise the div should hide. The code that i have is:
$("#sub_menu_modelismo").hide();
$("#menu_modelismo").hover(
function () {
$("#sub_menu_modelismo").show('fast');
},
function () {
$("#sub_menu_modelismo").hide('fast');
}
);
The div "#sub_menu_modelismo" should stay visible when the mouse is in it.
Tnx for the help.
you haven't described exactly what the behavior is doing right now that's wrong!!
From the code you have displayed the first thing that happens is the 'modelismo' div gets hidden. To me it looks like it will never show!!