Re: Tests on CSS tables

Gabriele Romanato wrote:
> http://www.css-zibaldone.com/test/tables/

table-acid-test.xht

   This test is very hard to understand. Please
     - indent properly
     - add comments explaining what you're trying to prove

table-alignment-000.xht

   This test relies on support for HTML align/valign attributes
   and also on some complex selectors. It's a good idea to make
   a test like this, but I think the test would be more effective
   if
     - you used simple class or ID selectors
     - you used "X" in Ahem as the text of the table cells
     - you either
         - used background images to put red where the X should be
           so the end result would be a green box
         - used Ahem and margins to make a reference rendering so
           you're not relying on HTML attributes

   Somewhere there should be a test for the HTML attributes, but
   I don't believe the CSS2.1 test suite is the right place for
   that.

table-alignment-001.xht

   There are two problems with this test:
     - it's too big
     - the image doesn't have visible boundaries, so it's not
       possible to see its alignment
   Also I can't tell what this test is testing that is different
   from the previous test.

table-background-000.xht

   It's a good test, but there are a few things I'd change about
   this test:
     - Use CSS for the borders
     - Increase the border-spacing
     - Use   for the cell content so it doesn't distract from
       the image
     - Use a different background image: it's cute, but we can't
       license this one. Using a drawing or photo you created yourself
       would be best.

table-background-001.xht

   Also a very good test. But again, you should
     - Use CSS for the borders
     - Increase the border-spacing
     - Use   for the cell contents.

table-float-000.xht

   I think with a little work you'd have a good test here, but it's
   right now not very clear what you are trying to prove. I suggest
   simplifying it and writing an assertion.

table-reflow-000.xht

   CSS2.1 doesn't define what happens here, so we can't include it
   in the test suite.

table-reflow-001.xht
table-reflow-002.xht

   These are a good tests of fixed table layout, but need to be
   simplified a lot. Most of the HTML is irrelevant to what you're
   testing here.

table-reflow-003.xht
table-reflow-004.xht
table-reflow-005.xht
table-reflow-006.xht
table-reflow-007.xht

   These tests are more demonstration than conformance test. I'm sure
   they're inspiring for web authors, but there's no clear pass condition.

table-reflow-008.xht

   It's not very clear what this test is testing. Perhaps it's testing
   "display: block" in the context of auto table cell sizing. In that
   case the test could be simplified by removing the second two columns,
   the second row, and replacing the text with a series of   (which
   would ensure that the top cell's content is longer than the bottom
   cell's content as well as taking unnecessary text out of the test).

table-reflow-009.xht
table-reflow-010.xht
table-reflow-012.xht
table-reflow-013.xht
table-reflow-014.xht


   The rendering of this is actually undefined in CSS2.1 (percentages
   inside shrink-wrap are not defined), so while they would be good
   tests to consider when writing CSS3 Tables, I can't add them to the
   CSS2.1 test suite.

table-reflow-011.xht

   As with table-reflow-008.xht, it's not very clear what this test
   is testing. There are several things going on in this test, I can't
   tell what exactly you're trying to prove.

table-reflow-015.xht

   This an interesting test. It could be a test for the 'border' attribute
   and CSS borders, but because tables size from the border edge instead
   of the content edge, it's not. Instead it's testing whether that
   pixel-thin inner border changes the table width (which it shouldn't).
   But one pixel is too small to be noticeable, so it's not a very good
   test for table width sizing, either. Also it tests the 'border'
   attribute, which is outside the scope of CSS2.1.

   Maybe we need a test suite for presentational HTML -> CSS mapping,
   and a test based on this (and your align/valign one) could go in there.

table-reflow-016.html

   Likewise for this. HTML attribute mapping is out of scope for CSS 2.1.
   (Also this test needs some hefty simplification.)

table-reflow-017.xht

   This /looks/ interesting, but what is it trying to prove?

table-reflow-018.xht

   This one has a few problems
     - Pass/fail is hard to determine because the heights are so small
     - It's not possible to determine pass/fail without reading the source
     - I can't figure out what this test is trying to prove.

table-reflow-019.xht

   This test seems more like a test of the colspan attribute than anything.
   And there's no clear pass condition.

table-reflow-020.xht
table-reflow-021.xht

   These are good tests, but the behavior is not defined in CSS2.1. (Auto
   table layout is not defined in CSS2.1.) So unfortunately we can't accept it
   for the CSS2.1 test suite. (Another test for CSS3 Tables...)

   Also, you should remove the borders and text from the table (or make the
   text  ) and make each table a blue box for the purpose of this test:
   you're not testing the contents of the tables, just their widths.

   I think I should create a directory for css3-tables so we can start
   collecting some of these tests.

table-reflow-022.xht

   Whether this test is valid depends on the window size. At a window size
   smaller than the narrow table's intrinsic width, the test will always
   fail.

   Also shrink-wrap widths aren't defined by CSS2.1... so I can't add this
   to the 2.1 test suite.

table-reflow-023.xht

   So, this test depends on
     - <object>'s 'width' attribute being supported
     - table cells having no padding
     - table cells having no border, or the border being included in the
       cell's width.
   And, again, auto table layout isn't specified in CSS2.1...

table-reflow-024.xht

   This would make a good test if you simplified it down to just the
   cell, put a red background on the cell, and removed all the
   unnecessary text. (It also needs a better title, something that
   reflects what's being tested.)

table-reflow-025.xht

   This is a really technique, and if I were writing tests for layered
   table backgrounds I would totally use it. :) But I can't figure out
   what you're testing here.

In all cases, please indent your code.

~fantasai

Received on Thursday, 2 October 2008 00:01:31 UTC