How could I disable the virtualization of Ag Grid during Cypress tests for a Vue.js application?

Since the Ag Grid does not draw everything at once I have to simulate scrolling to verify the data in grid, the grid behavior, etc. That makes my Cypress/Mocha tests cumbersome.

While if I would be able to set the suppressColumnVirtualisation and the suppressRowVirtualisation to true for all the Ag Grid instances before the tests are run I would have much simpler and leaner code in tests. I did some research online but found nothing about it and was hoping if maybe someone knows how to achieve that.

CodePudding user response：

It should be possible to switch virtualization off when Cypress is running the browser (i.e the window).

<template>
  <div style="height: 100%">
    <div style="height: 100%; box-sizing: border-box;">
      <ag-grid-vue
        style="width: 100%; height: 100%;"
        
        :columnDefs="columnDefs"
        @grid-ready="onGridReady"
        :defaultColDef="defaultColDef"
        :suppressColumnVirtualisation="suppressVirtualisation"
        :suppressRowVirtualisation="suppressVirtualisation"
        :rowData="rowData">
      </ag-grid-vue>
    </div>
  </div>
</template>

<script>
export default {
  name: 'App',
  components: {
    'ag-grid-vue': AgGridVue,
  },
  data: function () {
    return {
      columnDefs: [..],
      ...
      suppressVirtualisation: false   // want virtualization on in the real world
    };
  },
  created() {                      
    if (window.Cypress) {                  // check if Cypress has control
      this.suppressVirtualisation = true   // turn off virtualization
    }
  },
}
</script>