1.3 KiB
Description
Lots of people edit text content in the browser. Lots of that content, like WYSIWYG content or code, is too rich or complex to represent well with a <textarea>. Sites typically rely on advanced editor libraries for this, and we should make sure browsers perform well at common patterns used by them.
Screenshot
What are we testing
- Basic DOM and editing
- Virtualization (DOM content changing during scroll)
- Basic flex layout with SVG icons
How are we testing
The test simulates a real-world user flow by loading a number of popular editor libraries. After the initial load is complete, the following steps are timed:
- Setting to a fairly large value
- "Formatting" the text - in code editors this means turning on syntax highlighting, and in WYSISWYG this means bolding all of the contents
- Scrolling to the bottom of the editor
Developer Documentation
The app was created with npm create vite@latest editors, and can be previewed with npm run dev. In order to update the files run in the harness you have to use npm run build which will recreate the dist/ directory.
The built test can be loaded within the harness using i.e. http://localhost:7000/?suite=Editor-CodeMirror&startAutomatically=true, or the static versions at http://localhost:7000/resources/editors/dist/.