webdriverio findelements and $$ options are returning a Typescript error getText is not a function - webdriver-io

I have the below html tag generated as part of highchart
<g class="highcharts-axis-labels highcharts-xaxis-labels " data-z-index="7">
<text x="332.3333333333367" style="color:#666666;cursor:default;font-size:13;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="246" opacity="1">60</text>
<text x="886.9999999999668" style="color:#666666;cursor:default;font-size:13;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="246" opacity="1">65</text>
<text x="1441.6666666666667" style="color:#666666;cursor:default;font-size:13;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="246" opacity="1">70</text>
</g>
I am trying to extract all the text values in it and used the below command
xAxis = $('.highcharts-xaxis-labels').$$('text').getText();
I tried the browser.findelements using the XPATH as well. But with both I am getting the error message
TypeError: $(...).$$(...).getText is not a function

The problem here is that $$ (an alias for getElements) returns an array of elements, not just one element. An element has a getText() method, but an array doesn't have that.
If you want to get a list of all the values, you need to map the list of elements to each element's value:
$('.highcharts-xaxis-labels').$$('text').map(textElement => textElement.getText());

Related

How to create a customized Select.Item from native-base?

I am using Select from native-base and I'm having problem with trying to customize the selectable options from Select.Item.
react-native: 0.70.5,
native-base": "^3.4.25
<Select>
<Select.Item value="one" label="one" />
</Select>
where it will only render the label, which expects a string. I am not able to render any other component from Select.Item
what I'm trying to achieve looks a lot like the picture below:
Desired Select.Item
Edit: not a solution as it breaks the component value. You have to use leftIcon and rightIcon properties instead
You can use the label attribute to customize the item content.
Something like:
<Select>
<Select.Item
value="one"
label={
<Row>
<Icon as={MaterialCommunityIcons} name="information" />
<Text>one</Text>
</Row>
}
/>
</Select>
In my opinion, the attribute name is misleading. You can also use leftIcon and rightIcon properties on Select.Item. If you can't achieve the customization level you want with these, I'm afraid you will have to create your own Select component based on ActionSheet elements.
Note that this will not be web compatible, so if you need web support it won't be an option. I'm also not sure to which extent other components are supported within this item element.

Didn't display any option in dropdown ( autocomplete component) using cypress

I'm doing a test of an autocomplete component.
The problem is when I want to select an option from the dropdown, it shows me any option. When I did the test manually there are options but with cypress no. It worked and after no. I couldn't see the problem.
Does anyone know how to do it please?
(In cypress it didn't show any error)
Here the code of the autocomplete in js file
<Autocomplete
id={"name-label-" + label.customId}
options={options}
getOptionLabel={option => (option && option.name) ? option.name:''}
noOptionsText="No options"
renderInput={params => (
<TextField {...params} label="Select the name" fullWidth />
)}
data-cy="fichaSelectname"
onChange={(event, value) => handleOptionChange(event, value)}
value={option}
classes={classesAutocomplete}
/>
And here's the cypress code I used
cy.get('[data-cy=fichaSelectname]').click().type('{downarrow}').type('{enter}');
Did you try by selecting one element instead of just using the arrow buttons?
cy.get('[data-cy=fichaSelectname]').type('value{downarrow}{enter}');
Cypress did now show any stacktrace/error/info at all?
Well, first of all your code is wrong:
cy.get should be used like that: cy.get('[data-cy="fichaSelectname"]')
Try this.

Titanium return last three inserted collections

i just want to know hot to display only last three collections inserted in titanium ?
<View dataCollection="competence" dataFilter="filterFunction" height="Ti.UI.SIZE" layout="vertical" backgroundColor="gray" >
<Label backgroundColor='red' height="Ti.UI.SIZE" text="{date_debut}"/>
<Label backgroundColor='white' height="Ti.UI.SIZE" text="{date_fin}"/>
</View>
This display collections by 'ASC' from id order, my aim is only to show Three last elements.
I tried with dataFilter :
function filterFunction(collection){
// Underscore last method not working
return _.last(collection, 3);
}
Could you help me please ? thank you.
Try this
function filterFunction(collection){
return _.last(collection.models, 3);
}

RML Test of Page Number

Moin Moin,
I'm working on Openerp 7 and there pdf's get created with rml.
Problem is: I need Page Numbers, but just starting of the second Page.
I tried some rml if clause statements, but Page 1 gets printed all the time and the things that get printet are pretty wierd.
<header>
<pageTemplate id="second">
<frame id="second" x1="2.2cm" y1="2.5cm" width="16.9cm" height="22.3cm"/>
<pageGraphics>
<image file="images/isatech_water_header_medium.jpg" x="0.0cm" y="24.4cm" width="19.0cm" height="6.0cm"/>
<image file="images/isatech_water_footer.jpg" x="0.0cm" y="-0.5cm" width="16.9cm" height="2.6cm"/>
</pageGraphics>
</pageTemplate>
<pageTemplate id="first">
<frame id="first" x1="2.2cm" y1="2.5cm" width="16.9cm" height="22.3cm"/>
<pageGraphics>
<image file="images/isatech_water_header.jpg" x="0.0cm" y="24.4cm" width="19.0cm" height="6.0cm"/>
<image file="images/isatech_water_footer.jpg" x="0.0cm" y="-0.5cm" width="16.9cm" height="2.6cm"/>
[[ <pageNumber/> != '1' and <drawCentredString x="10cm" y="0.3cm"><pageNumber/></drawCentredString> ]]
</pageGraphics>
</pageTemplate>
</header>
What gets printed on the pdf is:
]] 1(2,3,...)
The pageTemplate second is for printing different header after page 1. I hope to get that straigt after the page numbers.
I really have no idea why the code behaves like he does. Different solutions are also welcome.
mfg Chris
I found a different way to do it.
It is not a good Idea to check the pageNumber in RML.
If I got it right, then the pageNumber is processed as one of the last steps. (Same goes for PageCount where it makes sense as you can't know the pageCount until the end of building your document)
Even if you call a python function with a pageNumber it gets handled as a String. I can just imagine it is the same reason.
I helped myself with a <setNextTemplate name="pageTemplate id"/>
Uncheck Add RML header in Settings > Actions > Reports > "Your Report"
Change your RML File and define the different pageTemplates
<template title="Sales Order" author="OpenERP S.A.(sales#openerp.com)" allowSplitting="20" showBoundary="0">
<pageTemplate id="first">
<frame id="first" x1="2.2cm" y1="2.5cm" width="16.9cm" height="22.3cm"/>
<pageGraphics>
<image file="images/header_page_1.jpg" x="0.8cm" y="24.7cm" width="16,9cm" height="4cm"/>
<image file="images/footer_page_1.jpg" x="0.4cm" y="-0.4cm" width="16.9cm" height="2.3cm"/>
</pageGraphics>
</pageTemplate>
<pageTemplate id="second">
<frame id="first" x1="2.2cm" y1="2.5cm" width="16.9cm" height="22.3cm"/>
<pageGraphics>
<image file="images/header_page_2.jpg" x="0.8cm" y="24.7cm" width="16,9cm" height="4cm"/>
<image file="images/header_page_2.jpg" x="0.4cm" y="-0.4cm" width="16.9cm" height="2.3cm"/>
</pageGraphics>
</pageTemplate>
Somewhere on page x add <setNextTemplate name="pageTemplate id"/>
or <setNextTemplate name="pageTemplate id"/>
<nextFrame/> to change the pageTemplate of page x+1
<setNextTemplate name="pageTemplate id"/> simply defines the pageTemplate of the next page and
<nextFrame/> additionaly end the current page.
Edit(Multi-Company-Header): I kind of forgot that we have multi Company Headers. Still I use this method. I just copy the .rml for every Company and hardcode the different company logos. Then in the reports setting page for every company(database) I specific the right .rml file.
I's very redundant, but I didn't found a better solution.
VG Chris

how to click by attribute in selenium?

HTML structure:
<g class="bars">
<rect class="bar selected" x="81" y="79" width="66" height="126">
<rect class="bar selected" x="169" y="79" width="66" height="126">
<rect class="bar selected" x="257" y="60" width="66" height="145">
</g>
I need to click in bar selected with attribute x=81.
How to do this?
Thank you
Find the element by xpath. Example (using python bindings):
element = driver.find_element_by_xpath('//g[#class="bars"]/rect[#x="81"]')
element.click()
There are certainly multiple ways to find that element. For instance, you can get the first rect out of the g tag:
//g[#class="bars"]/rect[1]
Or, you can additionally check the class attribute:
//g[#class="bars"]/rect[#class="bar selected"][1]
Or, you can combine the options I've mentioned and make your own xpath. It really depends on the uniqueness of the element and it's attributes across the page. Difficult to say without seeing the complete HTML source of the page.