Improving tests coverage for selection with CSS Regions in WebKit and Blink
It’s been almost a year since my previous post in this blog, I think this deserves an explanation. This year I’ve been working intensively in web internals as part of Igalia’s browsers team. Besides other stuff, I’ve been working in WebKitGTK+ port and its new WebKit2 API, contributing some patches into Epiphany (GNOME Web Browser) and lately working in the CSS Regions implementation in WebKit (where I’m already a committer :-D) and Blink as part of the collaboration between Adobe and Igalia. Inside this collaboration, our main goal is to fix the selection issues in documents using CSS Regions. You can read more information about it on Javi Fernández’s post. As explained there we have cooked some examples highlighting different issues with selection in CSS Regions.
Despite of having more than 35,000 tests in WebKit, there were almost no tests checking the selection in CSS Regions. Thus, we’ve been creating different layout tests that you can find under LayoutTests/fast/regions/selection/ folder in WebKit‘s and Blink‘s source trees.
Most of them are reftests, which means that we have two HTML files that should render the very same result. Specifically in this case we usually compare the result of the selection content and highlighted text in CSS Regions with the result of a crafted HTML page using absolute positions. Moreover, we try to do the tests in a way that you can check them manually directly opening the HTML file a browser. Besides, we’ve created tests for different writing modes like horizontal-bt, vertical-lr and vertical-rl.
At this point we have a good tests coverage that should be enough as base to prevent breakages in the selection with CSS Regions. Anyway, it’s clear that more tests will come in the future as soon as implementation advances and some issues get fixed. You can follow the work we’ve been doing on this meta-bug.
Just for the record, here you have the full list of WebKit bugs and Blink issues related to this task:
- WebKit:
- Bug 121501 – [CSS Regions] Layout Test for selection direction
- Bug 121841 – [CSS Regions] Layout Test for selecting text in 2 regions
- Bug 122099 – [CSS Regions] Selection layout tests moved to specific folder
- Bug 122128 – [CSS Regions] Helper functions for selection layout tests
- Bug 122327 – [CSS Regions] Layout Tests for selecting text in 2 regions for other writing modes
- Bug 122353 – [CSS Regions] Layout Test for selecting text ignoring region content
- Bug 123327 – [CSS Regions] Rename CSS classes and JS methods in vertical layout tests about selection
- Blink:
- Issue 25220002 – [CSS Regions] Layout Test for selection direction
- Issue 25761004 – [CSS Regions] Helper functions for selection layout tests
- Issue 25868002 – [CSS Regions] Selection layout tests moved to specific folder
- Issue 25890007 – [CSS Regions] Layout Test for selecting text in 2 regions
- Issue 34863002 – [CSS Regions] Layout Test for selecting text ignoring region content
Finally, I’d like to thank Igalia for giving me the chance to get involved in browsers development, working in the implementation of last specifications is a challenging but very heartwarming task. Let’s keep working hard to improve the web experience!