CSS Editor Test Specification
Author: Jiri Kovalsky
Version: 1.8.24
Last update: 10.5.2006
Introduction:
This document contains procedures for testing CSS editor. The xml module provides syntax highlighting, bracket matching and few handy actions on CSS nodes.
Comment:
Table of Contents
|
Purpose: This test suite checks that syntax highlighting in CSS editor is correct.
Setup: No preparation is necessary for this test suite.
| # | Test case | Description |
| 1 | New CSS document |
-
Use File | New Project... to create new Web Application project located in your home directory.
- Invoke File | New File... from main menu.
-
Select XML category and Cascading Style Sheet as file type. Push Next >.
-
Type style into File Name, change Folder field to src\java\css and press Finish.
|
|
| RESULT: |
| New style.css file is opened in editor containing only definition of root selector. The file is created under Source Packages | css node. |  |
|
|
| 2 | Syntax highlighting |
- Copy whole content of this document into clipboard.
-
Press CTRL+A in the editor and then invoke Edit | Paste from main menu.
-
Editor should replace its content with text from clipboard. Compare the syntax highlighting with this picture.
|
|
| RESULT: |
Proper colors should be used for keywords (bold blue), selectors (bold dark green), properties (blue), comments (dark green) and plain text (black). Current problems with syntax highlighting are described in issue #30053.
|
|
|
|
Purpose:
This test suite checks that validation and both reference actions work correctly.
Setup:
No preparation is necessary for this test suite except having web project open with style.css file.
| # | Test case | Description |
| 1 | Check CSS |
- The style.css file contains 4 errors in total.
-
Right click style.css file node and invoke Check CSS from the popup menu.
-
Four errors show up in the output window. Click the encountered "uri(". ... [2] link which takes the cursor to line 2.
- Correct the error and repeat step 2.
-
Go after each error and fix it according to hints mentioned in the comment above the error line.
|
|
| RESULT: | In the end CSS checking finished must show up in the status bar of IDE. |
|
| 2 | XML reference |
-
Right click style.css file node and invoke Copy XML Style from the popup menu.
-
Press CTRL+N, select XML category and XML Document. Press Next > twice and Finish buttons.
-
In newXMLWizard.xml editor press Arrow Down to move cursor at position 2:1 and invoke Edit | Paste from main menu.
-
Type <day>Hello world!</day> at line 14 between <root> elements. Save the XML file.
-
Right click newXMLWizard.xml file node and invoke View from the popup menu.
|
|
| RESULT: |
Web browser opens with pink Hello world! text as the result of successful reference to CSS stylesheet.
|
|
| 3 | HTML reference |
-
Right click style.css file node and invoke Copy HTML Style from the popup menu.
-
Press CTRL+N, select Other category and HTML File. Press Next > and Finish buttons.
-
In newhtml.html editor press Arrow Down to move cursor at position 2:1 and invoke Edit | Paste from main menu.
-
Type <day>Hello world!</day> at line 9 between <body> elements. Save the HTML file.
-
Right click newhtml.html file node and invoke View from the popup menu.
|
|
| RESULT: |
Web browser opens with pink Hello world! text as the result of successful reference to CSS stylesheet.
|
|
|
Generated: 2006 05 10 04:36