Results 1 to 5 of 5

Thread: Select grid item based on text

  1. #1

    Default Answered: Select grid item based on text

    Hi there,

    I was wondering how can I select item in grid, based on particular text.
    On left grid I've grabbed it by executing:
    Code:
    stpo.Analizatoriekran.gridNazivAnalizatora().contentLike('Cxxxxxxx').click();
    grids.png

    and interesting is engine picked 5th element in list, even though all which starts with C have same string ("Cxxxxxxx").
    I tried same action with grid on right hand side, but couldn't manage to grab it, engine behaves like it hovers it and clicks on empty space (right beneath items, even though I gave it argument of string which should it locate, let's say:
    Code:
    stpo.PAGEOBJECT.SOMENAMEOFGRID().contentLike('Sencha').click();
    while "Sencha" is on the list.

    Later on when I tried with recorder, but realized that it only captures items by row index like:
    Code:
        ST.play([
            { type: "tap", target: "core-view-component-MultiselectGrid[fieldLabel=\"SOME_LABEL_OF_GRID\"] => [data-recordindex=\"2\"]", x: 106, y: 11 }
        ]);
    So my first question is, why it chooses 5th element even though there are many more elements containing same string before.
    Is there any better function to select element inside grid (multiselect grid) than .contentLike('SOMESTRING').click();
    Is there option to grab element in recorder based on text, rather on index:

    Code:
        ST.play([
            { type: "tap", target:  "core-view-component-MultiselectGrid[fieldLabel=\"SOME_LABEL_OF_GRID\"]  => [data-recordindex=\"2\"]", x: 106, y: 11 }
        ]);
    Thank you in advance

  2. Yes, Ext JS grids render each row as its own table, but don't worry so much about how the grid is rendered to the DOM, the Sencha Test Future APIs help you to interact with the Ext JS component layer without worrying about the DOM structure.

    "innerText" won't work here, as that's not the dataIndex of the grid column. You will need to find out the underlying "dataIndex" that's defined on the Ext JS Store / Model - the one that the single grid column is configured to use. I'm not sure the Inspect tool will help to figure that out. If you don't have access to the application code, you could try figuring it out from the browser's Developer Tools >> Console. Assuming your grid has a locator of "#mygrid", type the following in to the browser's console, and see what's returned:

    Code:
    Ext.ComponentQuery.query('#mygrid')[0].getColumns()[0].dataIndex
    That should hopefully return the dataIndex.

  3. #2
    Sencha - Sales Team daniel.gallo's Avatar
    Join Date
    Apr 2009
    Location
    London, England
    Posts
    375
    Answers
    66

    Default

    The rowWith API can be used for locating a grid row by text value.

    For example:

    Code:
    ST.grid('#mygrid')
        .rowWith('company', 'Sencha')
        .click();
    The rowWith API accepts the underlying column data index and text string, and returns the matching row.

    In the case of your page object, the code would look something like this:

    Code:
    stpo.Analizatoriekran.gridNazivAnalizatora()
        .rowWith('company', 'Sencha')
        .click();
    Thanks.
    Daniel Gallo
    Sales Engineer
    Sencha

  4. #3

    Default

    Quote Originally Posted by daniel.gallo View Post
    The rowWith API can be used for locating a grid row by text value.

    For example:

    Code:
    ST.grid('#mygrid')
        .rowWith('company', 'Sencha')
        .click();
    The rowWith API accepts the underlying column data index and text string, and returns the matching row.

    In the case of your page object, the code would look something like this:

    Code:
    stpo.Analizatoriekran.gridNazivAnalizatora()
        .rowWith('company', 'Sencha')
        .click();
    Thanks.
    Hi Daniel,

    assuming I have attribute "company" of value "Sencha"?
    I tried with
    Code:
        .rowWith('innerText', 'Sencha')
        .click();
    But it didn't work...
    this is how row is interpreted:
    senchatd.jpg
    Every row in grid is in it's own table.

  5. #4
    Sencha - Sales Team daniel.gallo's Avatar
    Join Date
    Apr 2009
    Location
    London, England
    Posts
    375
    Answers
    66

    Default

    Yes, Ext JS grids render each row as its own table, but don't worry so much about how the grid is rendered to the DOM, the Sencha Test Future APIs help you to interact with the Ext JS component layer without worrying about the DOM structure.

    "innerText" won't work here, as that's not the dataIndex of the grid column. You will need to find out the underlying "dataIndex" that's defined on the Ext JS Store / Model - the one that the single grid column is configured to use. I'm not sure the Inspect tool will help to figure that out. If you don't have access to the application code, you could try figuring it out from the browser's Developer Tools >> Console. Assuming your grid has a locator of "#mygrid", type the following in to the browser's console, and see what's returned:

    Code:
    Ext.ComponentQuery.query('#mygrid')[0].getColumns()[0].dataIndex
    That should hopefully return the dataIndex.
    Daniel Gallo
    Sales Engineer
    Sencha

  6. #5

    Default

    it werks!
    Awesome!

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •