AUTOMATIC DETECTION OF CSS CONFLICTS

• US 20150007023A1
• Filed: 06/23/2014
• Published: 01/01/2015
• Est. Priority Date: 06/28/2013
• Status: Active Grant

• Current Assignee: International Business Machines Corporation
• Original Assignee: International Business Machines Corporation
• Inventors: FEI, Jia, HU, Kuang, RUAN, Qi, WANG, Pei, ZHU, Xiao Wen
• Granted Patent: US 9,767,083 B2
• Time in Patent Office: Days
• US Class Current: 715/236
• CPC Class Codes: G06F 40/154 Tree transformation for tree-structured or markup documents, e.g. XSLT, XSL-FO or stylesheets
• CPC Class Codes: G06F 40/205 Parsing

Abstract

A method, system, and/or computer program product automatically detects CSS conflicts. The method comprises: receiving at least one UI constraint and at least one first CSS rule defined by a developer of a widget as well as at least one second CSS rule customized by a user of the widget, the UI constraints being used to restrict the UI of the widget; running a page containing the widget; performing automatic validation on each UI constraint based on the result of running the page; and in response to deriving a UI constraint being violated from the validation, finding one or more of the second CSS rules that lead to violation of the UI constraint in a first set made up of the second CSS rules that override the first CSS rules.

Claims

1. A method for automatic detection of Cascading Style Sheet (CSS) conflicts, the method comprising:

receiving, by one or more processors, at least one user interface (UI) constraint and at least one first CSS rule defined by a developer of a widget as well as at least one second CSS rule customized by a user of the widget, said UI constraints being used to restrict the UI of said widget;

running, by one or more processors, a page containing said widget;

performing, by one or more processors, automatic validation on each UI constraint based on a result of running the page; and

in response to deriving a UI constraint being violated from said validation, finding, by one or more processors, one or more of the second CSS rules that lead to violation of the UI constraint in a first set made up of the second CSS rules that override the first CSS rules.

2. The method according to claim 1, further comprising:

receiving, by one or more processors, a first CSS rule subset associated with each UI constraint, said first CSS rule subset associated with each UI constraint being a set of the first CSS rules that can impact the UI constraint among said at least one first CSS rule.

3. The method according to claim 1, wherein each of the first CSS rule and the second CSS rule is denoted as a pair of a property and a value.

4. The method according to claim 2, further comprising:

based on the received first CSS rule subset associated with each UI constraint, and in response to determining that the UI constraint is violated through said validation, shrinking, by one or more processors, said first set to a second set that only contains the second CSS rules whose properties are the same as those of the first CSS rules in the first CSS rule subset.

5. The method according to claim 4, further comprising:

finding, by one or more processors, one or more of the second CSS rules that lead to violation of the UI constraint in the second set.

6. The method according to claim 1, wherein said UI constraint is a code segment written in JavaScript, and wherein the method further comprises:

returning, by one or more processors, a Boolean value in response to the code segment being executed.

7. The method according to claim 1, wherein said UI constraint is a code segment written in a customized library, and wherein the method further comprises:

returning, by one or more processors, a Boolean value in response to the code segment being interpreted.

8. The method according to claim 1, further comprising:

automatically modifying, by one or more processors, the found second CSS rules that lead to violation of the UI constraint.

9. The method according to claim 1, further comprising:

automatically deleting, by one or more processors, the found second CSS rules that lead to violation of the UI constraint.

10. A system for automatic detection of Cascading Style Sheet (CSS) conflicts, the system comprising:

a reception hardware module configured to receive at least one user interface (UI) constraint and at least one first CSS rule defined by a developer of a widget as well as at least one second CSS rule customized by a user of the widget, said UI constraints being used to restrict the UI of said widget;

a running hardware module configured to run a page containing said widget;

a validation hardware module configured to perform automatic validation on each UI constraint based on a result of running the page; and

a conflict source detection hardware module configured to, in response to deriving a UI constraint being violated from said validation, find one or more of the second CSS rules that lead to violation of the UI constraint in a first set made up of the second CSS rules that override the first CSS rules.

11. The system according to claim 10, wherein the reception hardware module is further configured to receive a first CSS rule subset associated with each UI constraint, said first CSS rule subset associated with each UI constraint being a set of the first CSS rules that can impact the UI constraint among said at least one first CSS rule.

12. The system according to claim 10, wherein each of the first CSS rule and the second CSS rule is denoted as a pair of a property and a value.

13. The system according to claim 11, wherein the validation hardware module is further configured to, based on received first CSS rule subset associated with each UI constraint, shrink said first set to a second set that only contains the second CSS rules whose properties are the same as those of the first CSS rules in the first CSS rule subset, in response to determining that the UI constraint is violated through said validation.

14. The system according to claim 13, wherein the validation hardware module is further configured to find one or more of the second CSS rules that lead to violation of the UI constraint in the second set.

15. The system according to claim 10, wherein said UI constraint is a code segment written in JavaScript, and a Boolean value is returned in response to the code segment being interpreted.

16. The system according to claim 10, wherein said UI constraint is a code segment written in a customized library, and a Boolean value is returned in response to the code segment being executed.

17. The system according to claim 10, further comprising a conflict elimination hardware module configured to automatically delete the found second CSS rules that lead to violation of the UI constraint.

18. A computer program product for automatically detecting Cascading Style Sheet (CSS) conflicts, the computer program product comprising a computer readable storage medium having program code embodied therewith, the program code readable and executable by a processor to perform a method comprising:

receiving at least one user interface (UI) constraint and at least one first CSS rule defined by a developer of a widget as well as at least one second CSS rule customized by a user of the widget, said UI constraints being used to restrict the UI of said widget;

running a page containing said widget;

performing automatic validation on each UI constraint based on a result of running the page; and

in response to deriving a UI constraint being violated from said validation, finding one or more of the second CSS rules that lead to violation of the UI constraint in a first set made up of the second CSS rules that override the first CSS rules.

19. The computer program product of claim 18, wherein the method further comprises:

receiving a first CSS rule subset associated with each UI constraint, said first CSS rule subset associated with each UI constraint being a set of the first CSS rules that can impact the UI constraint among said at least one first CSS rule.

20. The computer program product of claim 19, wherein the method further comprises:

based on received first CSS rule subset associated with each UI constraint, and in response to determining that the UI constraint is violated through said validation, shrinking said first set to a second set that only contains the second CSS rules whose properties are the same as those of the first CSS rules in the first CSS rule subset.