input.spec.js 3.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. // input.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('input', () => {
  8. it('trigger password button', () => {
  9. cy.visit('http://localhost:6006/iframe.html?id=input--input-a-11-y&args=&viewMode=story');
  10. cy.get('[data-cy=password]').click();
  11. cy.get('[data-cy=password]').realPress('Tab');
  12. cy.get('.semi-input-modebtn').eq(0).should('be.focused');
  13. cy.get('.semi-input-modebtn').eq(0).type('{ }');
  14. cy.get('[data-cy=password]').should('have.value', 'Semi Design');
  15. cy.get('[data-cy=password]').realPress('Tab');
  16. cy.get('.semi-input-modebtn').eq(0).should('be.focused');
  17. cy.get('.semi-input-modebtn').eq(0).type('{enter}');
  18. cy.get('[data-cy=password]').should('have.value', 'Semi Design');
  19. });
  20. it('input--forward-ref-focus', () => {
  21. cy.visit('http://localhost:6006/iframe.html?id=input--forward-ref-focus&args=&viewMode=story');
  22. // 无 ref, 点击 prefix, suffix 是否聚集
  23. cy.get('.semi-input-wrapper').eq(0).children('.semi-input-prefix').click();
  24. cy.get('.semi-input-wrapper').eq(0).children('input').should('be.focused');
  25. cy.get('body').click();
  26. cy.get('.semi-input-wrapper').eq(0).children('input').should('not.be.focused');
  27. cy.get('.semi-input-wrapper').eq(0).children('.semi-input-suffix').click();
  28. cy.get('.semi-input-wrapper').eq(0).children('input').should('be.focused');
  29. cy.get('body').click();
  30. cy.get('.semi-input-wrapper').eq(0).children('input').should('not.be.focused');
  31. // 对象式 ref,点击 prefix, suffix 是否聚集, 通过 ref 调用是否聚焦
  32. cy.get('.semi-input-wrapper').eq(1).children('.semi-input-prefix').click();
  33. cy.get('.semi-input-wrapper').eq(1).children('input').should('be.focused');
  34. cy.get('body').click();
  35. cy.get('.semi-input-wrapper').eq(1).children('input').should('not.be.focused');
  36. cy.get('.semi-input-wrapper').eq(1).children('.semi-input-suffix').click();
  37. cy.get('.semi-input-wrapper').eq(1).children('input').should('be.focused');
  38. cy.get('body').click();
  39. cy.get('.semi-input-wrapper').eq(1).children('input').should('not.be.focused');
  40. cy.get('.semi-button').eq(0).click();
  41. cy.get('.semi-input-wrapper').eq(1).children('input').should('be.focused');
  42. cy.get('body').click();
  43. cy.get('.semi-input-wrapper').eq(1).children('input').should('not.be.focused');
  44. // 函数式 ref,点击 prefix, suffix 是否聚集, 通过 ref 调用是否聚焦
  45. cy.get('.semi-input-wrapper').eq(2).children('.semi-input-prefix').click();
  46. cy.get('.semi-input-wrapper').eq(2).children('input').should('be.focused');
  47. cy.get('body').click();
  48. cy.get('.semi-input-wrapper').eq(2).children('input').should('not.be.focused');
  49. cy.get('.semi-input-wrapper').eq(2).children('.semi-input-suffix').click();
  50. cy.get('.semi-input-wrapper').eq(2).children('input').should('be.focused');
  51. cy.get('body').click();
  52. cy.get('.semi-input-wrapper').eq(2).children('input').should('not.be.focused');
  53. cy.get('.semi-button').eq(1).click();
  54. cy.get('.semi-input-wrapper').eq(2).children('input').should('be.focused');
  55. cy.get('body').click();
  56. cy.get('.semi-input-wrapper').eq(2).children('input').should('not.be.focused');
  57. });
  58. });