node-cssjanus icon indicating copy to clipboard operation
node-cssjanus copied to clipboard

Supporting testing border-radius with three values

Open ocean90 opened this issue 10 years ago • 2 comments

For #20 I would like to have some test with only three values. Example:

[
    "border-radius: 5px 9px 7px",
    "border-radius: 9px 5px 9px 7px"
],
[
    "border-radius: 5px 9px 7px / 3px 4px",
    "border-radius: 9px 5px 9px 7px / 4px 3px"
]

But since cf8f1e0c434c132f2dd5cd3eb804a9fdf656e406 tests are perfoming round-trip assertions too, which dosn't work for the cases above. Can we add a per-case option to disable these type of tests?

ocean90 avatar Jan 13 '15 19:01 ocean90

@Krinkle Any idea how to fix this?

ocean90 avatar Feb 12 '15 22:02 ocean90

@ocean90 Yeah, I noticed it in an earlier version of the pull request. They were dropped in the rebase. I'll add support to the test format for a one-way trip.

A few formats I can think of:

// array: two-way
// object: one-way (key > value)
{
    "cases": [
        [
            ".foo { border-radius: 1px; }"
        ],
        [
            ".foo { border-radius: 1px 2px; }",
            ".foo { border-radius: 2px 1px; }"
        ],
        {
            ".foo { border-radius: 5px 9px 7px; }": ".foo { border-radius: 9px 5px 9px 7px; }"
        }
    ]
}
// array: two-way
// object: one-way (from > to)
{
    "cases": [
        [
            ".foo { border-radius: 1px; }"
        ],
        [
            ".foo { border-radius: 1px 2px; }",
            ".foo { border-radius: 2px 1px; }"
        ],
        {
            "from": ".foo { border-radius: 5px 9px 7px; }",
            "to": ".foo { border-radius: 9px 5px 9px 7px; }"
        }
    ]
}
// array: two-way
// object: one-way (in > out)
{
    "cases": [
        [
            ".foo { border-radius: 1px; }"
        ],
        [
            ".foo { border-radius: 1px 2px; }",
            ".foo { border-radius: 2px 1px; }"
        ],
        {
            "in": ".foo { border-radius: 5px 9px 7px; }",
            "out": ".foo { border-radius: 9px 5px 9px 7px; }"
        }
    ]
}
// optional descriptor as first value
// @prop {string} [options.assert="two-way"] One of "one-way" or "two-way"
{
    "cases": [
        [
            ".foo { border-radius: 1px; }"
        ],
        [
            ".foo { border-radius: 1px 2px; }",
            ".foo { border-radius: 2px 1px; }"
        ],
        [
            {
                "assert": "one-way"
            },
            ".foo { border-radius: 5px 9px 7px; }",
            ".foo { border-radius: 9px 5px 9px 7px; }"
        ]
    ]
}
// optional descriptor as first value
// @prop {boolean} [options.roundTrip=true]
{
    "cases": [
        [
            ".foo { border-radius: 1px; }"
        ],
        [
            ".foo { border-radius: 1px 2px; }",
            ".foo { border-radius: 2px 1px; }"
        ],
        [
            {
                "roundTrip": false
            },
            ".foo { border-radius: 5px 9px 7px; }",
            ".foo { border-radius: 9px 5px 9px 7px; }"
        ]
    ]
}

The above all break the existing format, requiring ports to update the test case interpreter when upgrading. This is intentional.

If it's more readable as a separate set, though, we could go with a new top-level key. Not sure what to call it though.

// cases: performs round-trip assertions
// oneWay: no round-trip assertions
{
    "cases": [
        [
            ".foo { border-radius: 1px; }"
        ],
        [
            ".foo { border-radius: 1px 2px; }",
            ".foo { border-radius: 2px 1px; }"
        ]
    ],
    "oneWay": [
        [
            ".foo { border-radius: 5px 9px 7px; }",
            ".foo { border-radius: 9px 5px 9px 7px; }"
        ]
    ]
}

Krinkle avatar Feb 13 '15 03:02 Krinkle

Done in https://github.com/cssjanus/cssjanus/pull/49.

Krinkle avatar Mar 28 '23 02:03 Krinkle