Develop Reference

XPATH, Select an specific valid value from a Flex container

As the title implies I'm currently facing some issues trying to sort this out, the thing is I have an horizontal flex container which shows the Qtrs/Years in order to assign a valid one to a Package Rotation as you'll see on the bottom snippet there are 3 types of "status/classes" that I have to consider, given that certain quarters/years can be set as "Not valid" meaning I shouldn't consider them for the selection itself, leaving me to actually have to first search for the valid quarters (class="quarter valid and class="quarter valid selected, the latter one being the one I currently have selected duh')
Then after actually getting only the valid ones I need to be able to create an XPATH that allows me to travel through those options and be able to select them with an Index or preferably by text (eg: quarterNumber = '3Q' and year = "2021")
Basically the html/dom for that part is this:
<div class="quartersContainer"</div>
<div class="quarter">
<div class="quarterNumber">1Q</div>
<div class="year">2021</div>
<div class="releasedIndicator"></div>
<div class="quarterbar-editing-mode"></div>
</div>
<div class="quarter">
<div class="quarterNumber">2Q</div>
<div class="year">2021</div>
<div class="releasedIndicator"></div>
<div class="quarterbar-editing-mode"></div>
</div>
<div class="quarter valid selected">
<div class="quarterNumber">3Q</div>
<div class="year">2021</div>
<div class="releasedIndicator"></div>
<div class="quarterbar-editing-mode"></div>
</div>
<div class="quarter valid">
<div class="quarterNumber">4Q</div>
<div class="year">2021</div>
<div class="releasedIndicator"></div>
<div class="quarterbar-editing-mode"></div>
</div>
<div class="quarter">
<div class="quarterNumber">1Q</div>
<div class="year">2022</div>
<div class="releasedIndicator"></div>
<div class="quarterbar-editing-mode"></div>
</div>
What I have so far is just this.... (I'm really new to this :( )
//div[contains(#class,'quarter valid') and .//#class='quarterNumber' and .//#class='year']
The whole point of this is to actually generate an XPATH that can be manipulated in a future or through a Behave Feature file for example so testers just have to actually change the text from something like 2Q - 2021 to 3Q - 2023 and it will be able to look for it.
Any advice or guidance would be greatly appreciated :')

Like #DMart is suggesting, do something like this
def build_xpath(year ,quarterNumber):
return "//div[contains(#class,'quarter valid') and .//#class='" + year = "' and .//#class='" + quarterNumber + "']"
And then it's up to you how and with with what values you call build_xpath()

how to check in selenium that the click happens?

this is my original screenshot.
And this is the screenshot after I have click the on-off area on it.
This is the original html for the on-off area:
<div region="child-0" class="togglebar-item inline-block region region-child-0">
<div data-view-name="anonymous-view-11401" data-render-count="2">
<div class="ftnt-on-off-switch-ct">
<div class="ftnt-on-off-switch inline-block">
<input type="checkbox" id="ftnt-on-off-input--toggle-0" class="" action="action" data-mkey="1325" data-id="toggle-0">
<label for="ftnt-on-off-input--toggle-0"></label>
<div class="slider"></div>
</div>
</div>
</div>
</div>
And this is the html after the on-off area has been clicked.
<div region="child-0" class="togglebar-item inline-block region region-child-0">
<div data-view-name="anonymous-view-11492" data-render-count="2">
<div class="ftnt-on-off-switch-ct">
<div class="ftnt-on-off-switch inline-block">
<input type="checkbox" id="ftnt-on-off-input--toggle-0" class="" action="action" checked="" data-mkey="1325" data-id="toggle-0">
<label for="ftnt-on-off-input--toggle-0"></label>
<div class="slider"></div>
</div>
</div>
</div>
</div>
My question is:
In selenium python, after I click the on/off area, how may I detect the on/off happens ???
I need to add a test case for this, as sometimes even People have click the on-off, it never happens.

Alternately you may use something like this as well . I have tried this approach in java and you can definitely use it in python as well.
String color = element.getCssValue("color");
You can get the color from the style tab in the inspector and check if the color has changed

# if its checked checkboxes
wait.until(EC.presence_of_element_located((By.cssSelector, "input:checked[type='checkbox']")))
# if its not checked checkboxes
wait.until(EC.presence_of_element_located((By.cssSelector, "input:not(:checked)[type='checkbox']")))

Find the elements only after a specific text in html using selenium python

Lets say I have following HTML Code
<div class="12">
<div class="something"></div>
</div>
<div class="12">
<div class="34">
<span>TODAY</span>
</div>
</div>
<div class="12">
<div class="something"></div>
</div>
<div class="12">
<div class="something"></div>
</div>
Now If I use driver.find_elements_by_class_name("something") then I get all the classes present in the HTML code. But I want to get classes only after a specific word ("Today") in HTML. How to exclude classes that appear before the specific word. Next divs and classes could be at any level.

You can use search by XPath as below:
driver.find_elements_by_xpath('//*/text()[.="some specific word"]/following-sibling::div[#class="something"]')
Note that you might need some modifications in case your real HTML differs from provided simplified HTML
Update
replace following-sibling with following if required div nodes are not siblings:
driver.find_elements_by_xpath('//*/text()[.="some specific word"]/following::div[#class="something"]')

How to uniquely identify xpath for multiple tags and multiple values

I have following html:
<div class=‘content active’>
<div>
<div class=‘var’>
<div class=‘field var-field’>
<label>Interface Name</label>
<div class=‘ui input’>
<input type=‘input’ placeholder=‘.*’ value> ==$0
</div>
</div>
</div>
</div>
<div>
<div class=‘var’>
<div class=‘field var-field’>
<label>Neighbor Id</label>
<div class=‘ui input’>
<input type=‘input’ placeholder=‘.*’ value> ==$0
</div>
</div>
</div>
</div>
</div>
I need to send text to the text box with label: Interface Name.
Is there a way to uniquely write the xpath to send the text to the textbox.
Note that the only way to identify uniquely is wrt the label. The other fields in the tag is same for both.
I tried using AND operator. No luck.
Please help me out here.

Try this :
//label[text()='Interface Name']/following-sibling::div/child::input

To send text to the <input> element with respect to the <label> tag you can create a function as follows :
def test_me(myText):
driver.find_element_by_xpath("//label[.='" + myText + "']//following::div[1]/input").send_keys("hello")
Now, you can call this function from anywhere within your script as follows :
test_me("Interface Name")
# or
test_me("Neighbor Id")

You can use this XPATH :- //*[text()='Interface Name']/following-sibling::div/input"

Allow raw HTML in Deform form description fields

How would you stop Deform from escaping HTML in field titles or descriptions when rendering? My current best solution is to search/replace the returned rendered HTML string with what I need.
Deform by default will escape all HTML characters to HTML entities, I want to add an tag in one of the field descriptions.

Copy the default widget template and modify it to allow unescaped entries.
Descriptions are placed by mapping.pt. It cannot be overridden per widget basis - the mapping template is the same for all the items in the form. You can override mapping by passing item_template to your widget container (Form, Form section). Non-tested example:
# No .pt extension for the template!
schema = CSRFSchema(widget=deform.widget.FormWidget(item_template="raw_description_mapping"))
You can use TAL structure expression to unescape HTML.
E.g. example raw_description_mapping.pt for Deform 2:
<tal:def tal:define="title title|field.title;
description description|field.description;
errormsg errormsg|field.errormsg;
item_template item_template|field.widget.item_template"
i18n:domain="deform">
<div class="panel panel-default" title="${description}">
<div class="panel-heading">${title}</div>
<div class="panel-body">
<div tal:condition="errormsg"
class="clearfix alert alert-message error">
<p i18n:translate="">
There was a problem with this section
</p>
<p>${errormsg}</p>
</div>
<div tal:condition="description">
${structure: description}
</div>
${field.start_mapping()}
<div tal:repeat="child field.children"
tal:replace="structure child.render_template(item_template)" >
</div>
${field.end_mapping()}
</div>
</div>
</tal:def>
You also need to modify your Pyramid application to load overridden Deform templates when constructing WSGI application with Pyramid's Configurator:
from pyramid_deform import configure_zpt_renderer
configure_zpt_renderer(["mypackage:templates/deform", "mypackage2.submodule:form/templates/deform"])