Supervisors: Sjoerd Visscher and Vadim Zaytsev
Host organisation: Q42, http://q42.com
Abstract
Cascading Style Sheets (CSS) is a widely used language in today’s web applications for defining the presentation semantics of web documents. Despite the relatively simple syntax of CSS, the language has a number of complex features, like inheritance, cascading, and specificity, which make CSS code challenging to understand and maintain. One of the consequences is that it is not uncommon for CSS code to contain code smells. A code smell is a pattern of code that indicates a weakness in the design. Such a weakness may cause issues in code understanding and maintenance in the long term.
In this thesis we define a number of code smells for CSS. Furthermore we focus on one code smell, namely undoing style. Our definition of undoing style is: a property that is first set to a value A, next the property is possibly overridden and set to a different value B, possibly multiple times, and subsequently overridden again and set back to the original value A. We refer to this pattern as the A-B*-A pattern.
We propose a technique that detects undoing style in CSS code and recommends refactoring opportunities to eliminate a subset of these instances of undoing style, while preserving the semantics of the web application.
We evaluate our technique on 41 real-world web applications, and outline a proof of correctness for our refactoring. Our findings show that undoing style is quite prominent in CSS code. Additionally, there are many refactorings that can be applied while hardly introducing any errors.