ui automation - How can we fetch multiple data stored in <div> table in karate?

Question

I am trying to fetch set of data from a web table, stored/made using the <div> tags, not like the traditional html data tables. For example:

    <div class="tabulator-cell" role="gridcell" tabulator-field="program_name" title="" style="width: 135px; text-align: left; height: 30px;">
        <span style="color: #007bff; font-weight: 500;">Consumer Banking</span>
        <div class="tabulator-col-resize-handle"></div>
        <div class="tabulator-col-resize-handle prev"></div>
    </div>
    <div class="tabulator-cell" role="gridcell" tabulator-field="business_value" title="" style="width: 111px; text-align: center; height: 30px;">
        11898
        <div class="tabulator-col-resize-handle"></div>
        <div class="tabulator-col-resize-handle prev"></div>
    </div>
    <div class="tabulator-cell" role="gridcell" tabulator-field="lead_time" title="" style="width: 95px; text-align: center; height: 30px;">
        28.26
        <div class="tabulator-col-resize-handle"></div>
        <div class="tabulator-col-resize-handle prev"></div>
    </div>
    <div class="tabulator-cell" role="gridcell" tabulator-field="avg_accomplishment_rate" title="" style="width: 83px; text-align: center; height: 30px;">
        59.15
        <div class="tabulator-col-resize-handle"></div>
        <div class="tabulator-col-resize-handle prev"></div>
    </div>
    <div class="tabulator-cell" role="gridcell" tabulator-field="backlog_health" title="" style="width: 123px; text-align: center; height: 30px;">
        2.08
        <div class="tabulator-col-resize-handle"></div>
        <div class="tabulator-col-resize-handle prev"></div>
    </div>
    <div class="tabulator-cell" role="gridcell" tabulator-field="agile_discipline" title="" style="width: 113px; text-align: center; height: 30px;">
        28.62
        <div class="tabulator-col-resize-handle"></div>
        <div class="tabulator-col-resize-handle prev"></div>
    </div>
    <div class="tabulator-responsive-collapse"></div>
</div>

So, I am using scriptAll() method for this and need data just for 'Consumer Banking' here but unable to do so.

    * def list = scriptAll('div div', '_.textContent', function(x){ return x.contains('Consumer Banking') })
    * delay(3000)
    * print list 

Any help on this would be appreciated. Thanks in advance.

question from:https://stackoverflow.com/questions/65844733/how-can-we-fetch-multiple-data-stored-in-div-table-in-karate

Answer 1

I'll just give you one hint. This is how you can get a reference to the parent div of the row:

* def temp = locate('{}Consumer Banking').parent.parent

Now it is up to you:

* def businessValue = temp.locate("[tabulator-field='business_value']")
* match businessValue.text.trim() == '11898'