Wijmo Cypress tying issue

Posted by: felicity.lambe on 10 February 2020, 12:09 am EST

  • Posted 10 February 2020, 12:09 am EST

    Hi there,

    I am using cypress automation framework to run end to end tests. When entering data into wijmo tables using cypress, it does not enter the data into the fields. I am using below code to enter data, please can you let me know how can i enter data into wijmo table fields.

    async setGridDataBurningCost(element: string): Promise<void> {
    await cy.get(element).scrollIntoView()
    .click({ force: true })
    .invoke('show', '.wj-grid-editor.wj-form-control')
    .find('input').focus()
    .type(`100`, { force: true }).toPromise();

    cy.get(element).should('contain', '100');
    }

    and also i have tried with below code

    async setGridDataBurningCost(element: string): Promise<void> {
    await cy.get(element)
    .click({ force: true })
    .find('input').focus()
    .type(`100`, { force: true }).toPromise();
    cy.get(element).should('contain', '100');
    }

    I think mainly the issue is with invoking the input field for user to enter data.

    Please let me know if you need any further information in resolving the issue to enter data into wijmo fields in tables.

    Many thanks
  • Replied 10 February 2020, 10:43 pm EST

    Hi Felicity,

    The editing in the grid starts when you click the same cell that was previously clicked (not double-clicked cells). Therefore, in your test code, try calling the click method again after the first click. This will start editing the grid:
    async setGridDataBurningCost(element: string): Promise<void> {
    await cy.get(element).scrollIntoView()
    .click({ force: true })
    .click({force: true})
    .invoke('show', '.wj-grid-editor.wj-form-control')
    .find('input').focus()
    .type(`100`, { force: true }).toPromise();

    cy.get(element).should('contain', '100');
    }

    If this does not solves the issue, please try adding a timeout after the second click:
    await cy.get(element).scrollIntoView()
    .click({ force: true })
    .click({force: true})
    .wait(500)
    .invoke('show', '.wj-grid-editor.wj-form-control')

    Let us know if any of these suggestions works for you.

    Regards,
    Ashwin
  • Replied 11 February 2020, 12:13 am EST

    Hi Ashwin,

    Thanks for your reply.

    We have tried the above both the options which you mentioned and still we are struggling to enter the data into the wijmo fields. And also we have tried to put waits in different places which did not work either.

    The main issue which we are facing is to enable the input field to enter the data.

    Would you please provide any solution in order to resolve the issue.

    Many thanks
  • Replied 11 February 2020, 5:06 pm EST

    Hi Felicity,

    We have created a sample for you that shows how you can edit a cell using cypress.
    Let us know if this works for you.
    The spec file is placed in:
    project\cypress\integration\examples\app.component.spec.js

    ~regards

    flexgrid-cypres.zip
Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels