table.spec.js 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. // table.spec.js created with Cypress
  2. //
  3. // Start writing your Cypress tests below!
  4. // If you're unfamiliar with how Cypress works,
  5. // check out the link below and learn how to write your first test:
  6. // https://on.cypress.io/writing-first-test
  7. describe('table', () => {
  8. it('row selection', () => {
  9. cy.visit('http://127.0.0.1:6006/iframe.html?id=table--selection-table&args=&viewMode=story');
  10. cy.get('.semi-table-row-head .semi-checkbox-inner-display').click();
  11. cy.get('.semi-checkbox-checked').should('have.length', 4);
  12. });
  13. /**
  14. * 测试 columns 为字面量时刷新 Table,页码应保持当前页
  15. * 即更新 columns 不影响 currentPage
  16. */
  17. it('columns change ', () => {
  18. cy.visit('http://localhost:6006/iframe.html?id=table--fixed-columns-change&viewMode=story');
  19. cy.get('.semi-page-item').contains('2').click();
  20. cy.get('.semi-table-tbody .semi-checkbox').eq(1).click()
  21. .then(() => {
  22. cy.get('.semi-page-item').contains('2').should('have.class', 'semi-page-item-active');
  23. });
  24. });
  25. it('defaultFilteredValue', () => {
  26. cy.visit('http://localhost:6006/iframe.html?id=table--default-filtered-value&args=&viewMode=story');
  27. // 筛选为默认值
  28. cy.contains('显示第 1 条-第 10 条,共 23 条');
  29. // 动态变更数据后,默认筛选生效
  30. cy.get('.semi-button').contains('toggle change dataSource (46/25)').click();
  31. cy.contains('显示第 1 条-第 10 条,共 12 条');
  32. // 筛选手动设置为空后,动态变更数据,筛选值为空
  33. cy.get('.semi-table-column-filter').click();
  34. cy.get('.semi-dropdown-menu .semi-dropdown-item:nth-child(2)').click();
  35. cy.get('.semi-button').contains('toggle change dataSource (46/25)').click();
  36. cy.contains('显示第 1 条-第 10 条,共 46 条');
  37. });
  38. it('jsx columns nested change', () => {
  39. cy.visit('http://localhost:6006/iframe.html?id=table--fixed-header-merge&args=&viewMode=story');
  40. cy.get('[data-cy=button]').click();
  41. cy.contains("Base Information");
  42. cy.contains("Company Information");
  43. });
  44. it('scroll', () => {
  45. cy.visit('http://localhost:6006/iframe.html?id=table--scroll-bar&args=&viewMode=story');
  46. cy.get('.semi-table-body').scrollTo('bottom');
  47. cy.get('.semi-table-body').scrollTo('top');
  48. cy.get('.semi-table-body').scrollTo('left');
  49. cy.get('.semi-table-body').scrollTo('right');
  50. });
  51. it('resizable header', () => {
  52. cy.visit('http://localhost:6006/iframe.html?id=table--resizable-columns&args=&viewMode=story');
  53. cy.get('.react-resizable-handle').eq(0)
  54. .trigger('mousedown', { which: 1, pageX: 0, pageY: 100 })
  55. .trigger('mousemove', { which: 1, pageX: 600, pageY: 100 })
  56. .trigger('mouseup');
  57. cy.get('.react-resizable-handle').eq(1)
  58. .trigger('mousedown', { which: 1, pageX: 300, pageY: 100 })
  59. .trigger('mousemove', { which: 1, pageX: -300, pageY: 100 })
  60. .trigger('mouseup');
  61. });
  62. it('scroll table header click', () => {
  63. cy.visit('http://localhost:6006/iframe.html?id=table--fixed-on-header-row&args=&viewMode=story');
  64. cy.contains('标题').click();
  65. cy.contains('header click').should('be.visible');
  66. });
  67. it('infinite scroll', () => {
  68. cy.visit('http://localhost:6006/iframe.html?id=table--infinite-scroll-demo&args=&viewMode=story');
  69. // fixed the viewport
  70. cy.viewport(1000, 660);
  71. // the virtualied table should not load all table item
  72. cy.get('div[role="row"]').should('have.length.below', 30);
  73. // test the scroll in virtualized table
  74. cy.get('.semi-table-body').scrollTo('bottom');
  75. // Wait for the scroll result to take effect
  76. cy.wait(500);
  77. cy.get('div[role="gridcell"]').contains('Edward King 14');
  78. cy.get('.semi-table-body').scrollTo('bottom');
  79. cy.wait(500);
  80. cy.get('div[role="row"]').contains('Edward King 34');
  81. cy.get('.semi-table-body').scrollTo('top');
  82. cy.wait(500);
  83. cy.get('div[role="row"]').contains('Edward King 0');
  84. });
  85. it.skip('scrollToFirstRowOnChange', () => {
  86. cy.visit('http://localhost:6006/iframe.html?id=table--virtualized&args=&viewMode=story');
  87. cy.get('.semi-table-body').scrollTo(0, 150);
  88. cy.get('div[role="button"]').click();
  89. cy.get('div[role="row"]').contains('Edward King 9983');
  90. });
  91. it('resize', () => {
  92. cy.visit('http://localhost:6006/iframe.html?id=table--dynamic-table&args=&viewMode=story');
  93. cy.viewport(1000, 660);
  94. cy.get('.semi-switch').eq(0).click();
  95. cy.get('.semi-table-body').should('have.css', "max-height", "300px");
  96. });
  97. });