OPA5 Testing trigger custom action - integration-testing

Question

I've list of custom tiles container I want to match some specific text and then trigger remove action.
<custom:CustomTileWithCount id="overviewCard" press=".onPressOverviewCard" remove=".onRemoveCard" tooltip="{i18n>overviewCardTooltip}"
visible="{parts:[{path:'name'},{path:'/overviewSearchFilter'},{path:'addSupplierCardFlag'}], formatter:'.tileVisibility'}"
count="{numberOfNewNotifications}" isPlainCard="{addSupplierCardFlag}" busyIndicatorDelay="0" >
<custom:content>
..........contents............
</custom:content>
</custom:CustomTileWithCount>
I'm doing some thing else on press button. but for remove how i'll find the text and trigger the remove action
Element Html
<div class="sapMCustomTileContent"><section role="form" aria-labelledby="samhengiMainView--panelInOverviewTile-samhengiMainView--overviewTileContainer-0-header" id="samhengiMainView--panelInOverviewTile-samhengiMainView--overviewTileContainer-0" data-sap-ui="samhengiMainView--panelInOverviewTile-samhengiMainView--overviewTileContainer-0" data-sap-ui-fastnavgroup="true" class="overviewCardPanel sapMPanel" style="width:100%;height:100%"><div class="sapMPanelBGSolid sapMPanelContent" style="height: 240px;"><div id="samhengiMainView--__layout0-samhengiMainView--overviewTileContainer-0" data-sap-ui="samhengiMainView--__layout0-samhengiMainView--overviewTileContainer-0" style="width:100%" class="sapUiVlt sapuiVlt"><div class="sapUiVltCell sapuiVltCell"><span id="samhengiMainView--__text0-samhengiMainView--overviewTileContainer-0" data-sap-ui="samhengiMainView--__text0-samhengiMainView--overviewTileContainer-0" class="sapMText sapMTextBreakWord sapMTextMaxWidth sapUiSelectable" style="text-align:left">Oracle</span></div><div class="sapUiVltCell sapuiVltCell"><span id="sap-ui-invisible-samhengiMainView--__icon1-samhengiMainView--overviewTileContainer-0" class="sapUiHiddenPlaceholder" data-sap-ui="sap-ui-invisible-samhengiMainView--__icon1-samhengiMainView--overviewTileContainer-0" style="display: none;" aria-hidden="true"></span></div></div><span id="sap-ui-invisible-samhengiMainView--noDataTextOverviewTile-samhengiMainView--overviewTileContainer-0" class="sapUiHiddenPlaceholder" data-sap-ui="sap-ui-invisible-samhengiMainView--noDataTextOverviewTile-samhengiMainView--overviewTileContainer-0" style="display: none;" aria-hidden="true"></span><div id="samhengiMainView--supplierOverviewViz-samhengiMainView--overviewTileContainer-0" data-sap-ui="samhengiMainView--supplierOverviewViz-samhengiMainView--overviewTileContainer-0" data-sap-ui-fastnavgroup="true" class="overviewCardVizFrame sapVizFrame" style="width:100%;height:80%"><div class="ui5-viz-controls-app" data-sap-ui-preserve="true"><div class="ui5-viz-controls-viz-frame"><div style="width: 100%; height: 100%;"><div id="UIComp_0" class="v-info" style="height: 165px; width: 287px; position: relative; font-size: 10px; box-sizing: border-box; -webkit-user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);" tabindex="0"><svg class="v-m-root" style="left: 0px; top: 0px; height: 100%; width: 100%; display: block; cursor: default;" aria-labelledby="title desc" focusable="false" tabIndex="-1" width="100%" height="100%"><defs></defs><g class="v-m-desc-title"><title>An Interactive Combined Column Line Chart with 2 Y-Axes </title></g><g class="v-m-action-layer-group"></g><g class="v-m-decoration-layer-group"></g><g class="v-m-background"><rect class="v-background-body viz-plot-background v-morphable-background" x="0" y="0" width="287" height="165" style="fill:transparent"></rect></g><g class="v-m-title" transform="translate(39.3, 7)"><rect class="v-bound" width="171.36" height="18.171875" fill="transparent"></rect></g><g class="v-m-legendGroup" transform="translate(6, 159)"><g class="v-m-legend" transform="translate(0,0)"><rect class="v-bound" width="0" height="0" fill="transparent"></rect></g></g><g class="v-m-main" transform="translate(6, 7)"><g class="v-m-plot" transform="translate(33.3, 0)"><rect class="v-background-body viz-plot-background v-morphable-background" x="0" y="0" width="208.39999999999998" height="114.84" style="fill:transparent"></rect><clipPath id="plot_main_clipPath_f172776f-aeac-458c-bf76-3a09181a5dfd"><rect y="-1" width="209.39999999999998" height="115.84"></rect></clipPath><rect class="v-plot-bound v-bound v-zoom-plot" width="208.39999999999998" height="114.84" fill="transparent"></rect><g clip-path="url(#plot_main_clipPath_f172776f-aeac-458c-bf76-3a09181a5dfd)"><g class="v-plot-main" role="list" transform="translate(0, 0)"><g class="v-datapoint-group"><g><g data-id="0" data-datapoint-id="295" class="v-datapoint v-morphable-datapoint v-datapoint-default" combination-column="true" transform="translate(1.353246753246753, 114.84)"><rect width="27.06493506493506" height="0" fill="#27a3dd" stroke="#ffffff" stroke-width="1"></rect></g><g data-id="1" data-datapoint-id="296" class="v-datapoint v-morphable-datapoint v-datapoint-default" combination-column="true" transform="translate(31.12467532467532, 60.15428571428572)"><rect width="27.06493506493506" height="54.68571428571428" fill="#27a3dd" stroke="#ffffff" stroke-width="1"></rect></g><g data-id="2" data-datapoint-id="297" class="v-datapoint v-morphable-datapoint v-datapoint-default" combination-column="true" transform="translate(60.89610389610389, 65.12571428571428)"><rect width="27.06493506493506" height="49.714285714285715" fill="#27a3dd" stroke="#ffffff" stroke-width="1"></rect></g><g data-id="3" data-datapoint-id="298" class="v-datapoint v-morphable-datapoint v-datapoint-default" combination-column="true" transform="translate(90.66753246753245, 114.84)"><rect width="27.06493506493506" height="0" fill="#27a3dd" stroke="#ffffff" stroke-width="1"></rect></g><g data-id="4" data-datapoint-id="299" class="v-datapoint v-morphable-datapoint v-datapoint-default" combination-column="true" transform="translate(120.43896103896101, 114.84)"><rect width="27.06493506493505" height="0" fill="#27a3dd" stroke="#ffffff" stroke-width="1"></rect></g><g data-id="5" data-datapoint-id="300" class="v-datapoint v-morphable-datapoint v-datapoint-default" combination-column="true" transform="translate(150.21038961038957, 114.84)"><rect width="27.06493506493505" height="0" fill="#27a3dd" stroke="#ffffff" stroke-width="1"></rect></g><g data-id="6" data-datapoint-id="301" class="v-datapoint v-morphable-datapoint v-datapoint-default" combination-column="true" transform="translate(179.98181818181814, 114.84)"><rect width="27.06493506493507" height="0" fill="#27a3dd" stroke="#ffffff" stroke-width="1"></rect></g></g></g></g></g><g class="v-referenceline-group" clip-path="url(#plot_main_clipPath_f172776f-aeac-458c-bf76-3a09181a5dfd)"></g></g><g class="v-m-categoryAxis v-m-xAxis" transform="translate(33.3, 114.84)" role="listbox"><rect class="v-bound" width="208.39999999999998" height="37.16" fill="transparent"></rect><g class="v-axis"><g class="v-m-axisScrollbar" transform="translate(0,25.16)"><g><rect class="v-m-scrollbarTrack" visibility="hidden" fill="transparent" stroke-width="0" stroke="#f2f2f2" width="208.39999999999998" height="12"></rect><rect class="v-m-scrollbarThumb" visibility="hidden" fill="#ababab" width="208.39999999999998" height="8" transform="translate(2, 2)"></rect></g></g><g class="v-m-axisTitle" transform="translate(0,0)"></g><g class="v-m-axisBody" transform="translate(0,0)" clip-path="url(#clip-path-bc27e17b-0315-40e4-9a92-1f7fa17af6e8)"><clipPath class="v-clippath" id="clip-path-bc27e17b-0315-40e4-9a92-1f7fa17af6e8"><rect x="-1" y="-1" width="210.39999999999998" height="27.16"></rect></clipPath><g class="v-line-group"><line class="v-valueaxisline v-line" shape-rendering="crispEdges" stroke="#cccccc" stroke-width="1" x1="-0.5" y1="0" x2="208.89999999999998" y2="0" style="pointer-events: none;"></line></g><g class="v-label-group"><g class="v-label v-morphable-label viz-axis-label v-axis-item index_0" fill="#333333" font-size="11.8px" font-weight="normal" font-family=""72-Web",Arial,Helvetica,sans-serif" font-style="normal" categorylabel-id="0" transform="translate(0,0)"><rect class="viz-axis-label-rect" fill="transparent" x="1" y="1" width="27.77142857" height="23.16"></rect><g class="v-axis-label-wrapper"><text x="5.9923045550000005" y="17.44125" text-anchor="start">We</text></g></g><g class="v-label v-morphable-label viz-axis-label v-axis-item index_0" fill="#333333" font-size="11.8px" font-weight="normal" font-family=""72-Web",Arial,Helvetica,sans-serif" font-style="normal" categorylabel-id="1" transform="translate(29.77142857,0)"><rect class="viz-axis-label-rect" fill="transparent" x="1" y="1" width="27.77142857" height="23.16"></rect><g class="v-axis-label-wrapper"><text x="7.885714285000001" y="17.44125" text-anchor="start">Th</text></g></g><g class="v-label v-morphable-label viz-axis-label v-axis-item index_0" fill="#333333" font-size="11.8px" font-weight="normal" font-family=""72-Web",Arial,Helvetica,sans-serif" font-style="normal" categorylabel-id="2" transform="translate(59.54285714,0)"><rect class="viz-axis-label-rect" fill="transparent" x="1" y="1" width="27.77142857" height="23.16"></rect><g class="v-axis-label-wrapper"><text x="9.385714285" y="17.44125" text-anchor="start">Fr</text></g></g><g class="v-label v-morphable-label viz-axis-label v-axis-item index_0" fill="#333333" font-size="11.8px" font-weight="normal" font-family=""72-Web",Arial,Helvetica,sans-serif" font-style="normal" categorylabel-id="3" transform="translate(89.31428571,0)"><rect class="viz-axis-label-rect" fill="transparent" x="1" y="1" width="27.77142857" height="23.16"></rect><g class="v-axis-label-wrapper"><text x="7.385714285000001" y="17.44125" text-anchor="start">Sa</text></g></g><g class="v-label v-morphable-label viz-axis-label v-axis-item index_0" fill="#333333" font-size="11.8px" font-weight="normal" font-family=""72-Web",Arial,Helvetica,sans-serif" font-style="normal" categorylabel-id="4" transform="translate(119.08571429,0)"><rect class="viz-axis-label-rect" fill="transparent" x="1" y="1" width="27.77142857" height="23.16"></rect><g class="v-axis-label-wrapper"><text x="7.385714285000001" y="17.44125" text-anchor="start">Su</text></g></g><g class="v-label v-morphable-label viz-axis-label v-axis-item index_0" fill="#333333" font-size="11.8px" font-weight="normal" font-family=""72-Web",Arial,Helvetica,sans-serif" font-style="normal" categorylabel-id="5" transform="translate(148.85714286,0)"><rect class="viz-axis-label-rect" fill="transparent" x="1" y="1" width="27.77142857" height="23.16"></rect><g class="v-axis-label-wrapper"><text x="6.385714285000001" y="17.44125" text-anchor="start">Mo</text></g></g><g class="v-label v-morphable-label viz-axis-label v-axis-item index_0" fill="#333333" font-size="11.8px" font-weight="normal" font-family=""72-Web",Arial,Helvetica,sans-serif" font-style="normal" categorylabel-id="6" transform="translate(178.62857143,0)"><rect class="viz-axis-label-rect" fill="transparent" x="1" y="1" width="27.77142857" height="23.16"></rect><g class="v-axis-label-wrapper"><text x="8.104655020000001" y="17.44125" text-anchor="start">Tu</text></g></g></g></g></g></g><g class="v-m-valueAxis v-m-yAxis" transform="translate(0, 0)"><rect class="v-bound" width="33.3" height="114.84" fill="transparent"></rect><g class="v-axis"><g class="v-m-axisTitle" transform="translate(-3.552713678800501e-15,0)"><g class="v-title viz-axis-title" fill="#1b7eac" font-size="14px" font-weight="bold" font-family=""72-Web",Arial,Helvetica,sans-serif" font-style="normal"><text dominant-baseline="auto" text-anchor="start" x="-15.414847564697265" y="57.42" transform="rotate(-90,14.065625,57.42)"><tspan class="v-title viz-axis-title" dominant-baseline="auto"># Tweets</tspan></text></g></g><g class="v-m-axisBody" transform="translate(22.299999999999997,0)"><rect class="v-bound" width="11" height="114.84" fill="transparent"></rect></g></g></g><g class="v-m-valueAxis2 v-m-yAxis2" transform="translate(241.7, 0)"><rect class="v-bound" width="33.3" height="114.84" fill="transparent"></rect><g class="v-axis"><g class="v-m-axisScrollbar" transform="translate(0,0)"></g><g class="v-m-axisTitle" transform="translate(16.5,0)"><g class="v-title viz-axis-title" fill="#759422" font-size="14px" font-weight="bold" font-family=""72-Web",Arial,Helvetica,sans-serif" font-style="normal"><text dominant-baseline="auto" text-anchor="start" x="-24.116191101074218" y="57.42" transform="rotate(-90,14.065625,57.42)"><tspan class="v-title viz-axis-title" dominant-baseline="auto">Stock Price</tspan></text></g></g><g class="v-m-axisBody" transform="translate(0,0)"><rect class="v-bound" width="11" height="114.84" fill="transparent"></rect></g></g></g></g></svg><div class="v-m-tooltip-container" actualwidth="287" actualheight="165" style="left: 0px; top: 0px; height: 0px; width: 0px; position: absolute;"></div></div></div><div></div></div><div class="ui5-viz-controls-viz-description" style="display: none;"><div class="ui5-viz-controls-viz-description-title"></div><div class="ui5-viz-controls-viz-description-detail"></div></div></div></div></div></section></div>

Answer 1

So actually you have two problems: find an element and triger an action ?.
First you need to decide how to recognize the element you want to find. You could match by property:
var sTitle = "The Great App"
return new Opa5().waitFor({
controlType : "sap.m.ObjectHeader",
matchers : new sap.ui.test.matchers.PropertyStrictEquals({
name : "title",
value: sTitle
}),
errorMessage: "Could not find the tile with title: " + sTitle
...
Or you could select with code, have a look at the examples for matcher function here:
OPA5 cookbook.
Trigering an action boild down to sending a click to an element. So select the element and do:
return new Opa5().waitFor({
...
actions: new Press(),
errorMessage: "Could not click the tile"
});
Hope this helps