FeaturesPluginsDocs & SupportCommunityPartners

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

Test suite 1: Syntax highlighting

Purpose: This test suite checks that syntax highlighting in CSS editor is correct.
Setup: No preparation is necessary for this test suite.

#Test caseDescription
1New CSS document
  1. Use File | New Project... to create new Web Application project located in your home directory.
  2. Invoke File | New File... from main menu.
  3. Select XML category and Cascading Style Sheet as file type. Push Next >.
  4. 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.
2Syntax highlighting
  1. Copy whole content of this document into clipboard.
  2. Press CTRL+A in the editor and then invoke Edit | Paste from main menu.
  3. 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.

Test suite 2: Handy actions

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 caseDescription
1Check CSS
  1. The style.css file contains 4 errors in total.
  2. Right click style.css file node and invoke Check CSS from the popup menu.
  3. Four errors show up in the output window. Click the encountered "uri(". ... [2] link which takes the cursor to line 2.
  4. Correct the error and repeat step 2.
  5. 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.
2XML reference
  1. Right click style.css file node and invoke Copy XML Style from the popup menu.
  2. Press CTRL+N, select XML category and XML Document. Press Next > twice and Finish buttons.
  3. In newXMLWizard.xml editor press Arrow Down to move cursor at position 2:1 and invoke Edit | Paste from main menu.
  4. Type <day>Hello world!</day> at line 14 between <root> elements. Save the XML file.
  5. 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.
3HTML reference
  1. Right click style.css file node and invoke Copy HTML Style from the popup menu.
  2. Press CTRL+N, select Other category and HTML File. Press Next > and Finish buttons.
  3. In newhtml.html editor press Arrow Down to move cursor at position 2:1 and invoke Edit | Paste from main menu.
  4. Type <day>Hello world!</day> at line 9 between <body> elements. Save the HTML file.
  5. 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
Companion
Projects:
MySQL Database Server   Open JDK: an Open SourceJDK   GlassFish Community: an Open Source Application Server    Mobile & Embedded Community    Open Solaris   java.net - The Source for Java Technology Collaboration   Virtual Box - full virtualizer  Open ESB - The Open Enterprise Service Bus Powered by