====== Test Format ====== This page describes the test format. The requirements are explained below; to make things easier we've also provided a template that you can copy. Additional guidelines on designing the content of the test can be found in the [[http://www.w3.org/Style/CSS/Test/guidelines.html|CSS2.1 Test Case Authoring Guidelines]]. ===== Template for New Tests ===== The baseline format for CSS2.1 tests is XHTML 1.1 in UTF-8. Images must be in PNG format. A set of scripts generate the various formats from this source version. Tests must be //valid// XHTML 1.1, so please [[http://validator.w3.org/|validate your tests]] before submission. A template for new tests follows. Copy and paste the code below into a new file or save {{test:css2.1:test-topic-000.xht|this template file}} and replace the capitalized parts as described below. CSS Test: DESCRIPTION OF TEST CONTENT OF TEST ===== Template Details ===== ==== Title element ==== CSS Test: DESCRIPTION OF TEST The title appears in the generated index, so make sure it is //unique// and //descriptive//. There is no need to provide the chapter or section in the title. Bad example: CSS Test: Border Conflict Resolution We have 100+ tests on "Border Conflict Resolution". Good example: CSS Test: Border Conflict Resolution (width) - hidden/double ==== Credits ==== Credits provide a way to identify the person or organization that submitted the test. This is useful for reviewing purposes and for asking questions about the individual test. A test can have multiple author credits if necessary. Example 1: Example 2: Example 3: ==== Specification Links ==== The specification link elements provide a way to align test with information in the CSS 2.1 specification. * Links should link to relevant sections within the CSS 2.1 Specification * Use the anchors from the CSS 2.1 Specification [[http://www.w3.org/TR/CSS21/#toc|Table of Contents]] * A test can have multiple specification links * Always list the primary section that is being tested as the first item in the list of specification links * Order the list from the most used/specific to least used/specific * There is no need to list common incidental features like the color green if it is being used to validate the test unless the case is specifically testing the color green Example 1: Example 2: ==== Requirement Flags ==== Flags document the test’s prerequisites, for example, the Ahem font, or a paged presentation. Multiple tokens are space separated. All flags documented elsewhere are deprecated except the following: ^ Token ^ Description ^ | ahem | Requires the [[http://www.hixie.ch/resources/fonts/|Ahem font]] | | dom | Requires support for JavaScript and the Document Object Model (DOM) | | font | Requires a specific font to be installed. (Details must be provided and/or the font linked to in the test description) | | history | User agent session history is required. Testing '':visited'' is a good example where this may be used. | | HTMLonly | Test case is only valid for HTML | | image | Requires support for bitmap graphics and the graphic to load | | interact | Requires human interaction (such as for testing scrolling behavior) | | invalid | Tests handling of invalid CSS. Note: This case contains CSS properties and syntax that may not validate. | | namespace | Requires support for XML Namespaces | | nonHTML | Test case is only valid for formats besides HTML (e.g. XHTML or arbitrary XML) | | may | Behavior tested is //preferred// but OPTIONAL. %%[%%[[http://www.ietf.org/rfc/rfc2119.txt|RFC2119]]] (These tests must be reviewed by a test suite owner or peer.) | | paged | Only valid for paged media | | should | Behavior tested is RECOMMENDED, but not REQUIRED. %%[%%[[http://www.ietf.org/rfc/rfc2119.txt|RFC2119]]] | | scroll | Only valid for continuous (scrolling) media | | svg | Requires support for vector graphics (SVG) | | 96dpi | Assumes 96dpi display | Example 1 (one token applies): Example 2 (multiple tokens apply): Example 3 (no tokens apply): ==== Test Assertions ==== This element should contain a complete detailed statement expressing what specifically the test is attempting to prove. The assertion should //not// be: * A copy of the title text * A copy of the self-verification text * A line or reference from the CSS specification unless that line is a complete assertion when taken out of context. The test assertion is **optional**. It helps the reviewer understand the goal of the test so that he or she can make sure it is being tested correctly. Also, in case a problem is found with the test later, the testing method (e.g. using 'color' to determine pass/fail) can be changed (e.g. to using 'background-color') while preserving the intent of the test (e.g. testing support for ID selectors). ==== Style Element (embedded styles) ==== When creating styles primarily use ID or Class selectors. Inline styles should not be used unless the case is specifically testing this scenario. ==== ''body'' Content ==== CONTENT OF TEST * When creating content use : ''
'', '''', ''

'', '''' * Beware! ''

'' has margins by default! * Use other elements only to test the interaction with those elements' features (or other namespaces' features) * Test ''table'' features with both HTML table elements and ''

'' + ''display: table-*'' * Do not use the ''style'' attribute (inline styles) unless specifically testing that attribute * Avoid making assumptions that are not in the [[http://www.w3.org/Style/CSS/Test/CSS2.1/current/|"most of the test suite makes the following assumptions"]] list and document any that you do. * Indent nicely! ===== Filename format ===== The new filename format is ''test-topic-###.ext'' where ''test-topic'' somewhat describes the test and ''###'' is a zero-filled number used to keep the filenames unique. The filename is no longer restricted to 31 characters, but please try to keep them short. **test-topic**\\ A short identifier that describes the test. The ''test-topic'' should avoid conjunctions, articles, and prepositions. It is a filename, not an English phrase: it should be as concise as possible. Examples:\\ ''margin-collapsing-###.ext\\ border-solid-###.ext\\ float-clear-###.ext'' **###**\\ This is a zero-filled number used to keep the filenames unique when files have the same test-topic name. In the case of margin-collapsing there are multiple cases so each case could have the same test-topic but different numbers. Note: the number format is limited to 999 cases if you go over this number it is recommended that you reevaluate your test-topic name. **ext**\\ The file extension or format of the file. ===== Support files ===== A number of standard images are provided in the [[http://www.w3.org/Style/CSS/Test/CSS2.1/current/xhtml1/support/|support directory]]. These include * 1x1 color swatches * 15x15 color swatches * 15x15 bordered color swatches * assorted rulers and red/green grids * a cat * a 4-part picture Additional generic files can be added as necessary, and should have a descriptive filename. Test-specific files should be named after the test (or test-topic if they are shared across several tests within a series). If possible tests should not rely on transparency in images, as they are converted to JPEG (which does not support transparency) for the xhtml1print version.