[Cypress] Test React’s Controlled Input with Cypress Selector Playground
React with input test Selector Cypress
2023-09-14 08:59:17 时间
React based applications often use controlled inputs, meaning the input event leads to the application code setting the value of the very input we’re typing into. Since this moves the input setting behavior into the application code, we should have a test to guard against future changes that might break this behavior. In this lesson, we’ll use the Selector Playground feature in Cypress and create a test that enters text into an input and asserts that the value is the same as the entered text.
The get the selected element, we can use the cypress interface:
it.only('should type new todo into the input field', function () { const typedText = 'New todo'; cy.visit('/'); cy.get('.new-todo') .type(typedText) .should('have.value', typedText); });
相关文章
- React报错之Property 'X' does not exist on type 'HTMLElement'
- [译] 为何 React 18 中 useEffect 会运行两次?
- 所有alpha都想标记我_react native 游戏
- 优雅地乱玩 Redux-2-Usage with React
- React Error: Failed at the xxx@0.1.0 start script 'react-scripts start'.
- react源码分析:深度理解React.Context
- react源码分析:babel如何解析jsx
- 浅谈 React 生命周期
- React 18 最新进展:发布 Beta 版本,公开测试新特性
- react的jsx和React.createElement是什么关系?面试常问_2023-02-27
- react源码分析:深度理解React.Context_2023-02-28
- 从源码角度看React-Hydrate原理_2023-03-01
- React之forwardRef的使用
- 前端一面必会react面试题(附答案)
- react源码分析:深度理解React.Context
- react的jsx和React.createElement是什么关系?面试常问5
- react源码中的协调与调度_2023-02-21
- 为什么我们放弃了Vue?Vue和React深度比较
- 探索React框架中MySQL数据库的应用(react mssql)