7

我正在编写一个自定义 CSS 解析器，并希望用它来设置我的应用程序（不是 HTML）中的图形元素的样式。当涉及到选择器的优先级、“级联”等时，我想确保这符合通常的 CSS 行为。

有没有可以用于这个项目的综合 CSS 测试套件？

我的 CSS 具有大部分常规语法功能（例如匹配“标签”名称、ID、类、伪类），并且将与 HTML 的 CSS 共享许多格式化选项，但也有不同的选项，以适合“文档”的类型我在造型。

我一直在寻找一个 CSS 测试套件来检查我的实现，但我能找到的唯一一个，比如W3C 测试套件，主要关注文档的可视化表示。我正在寻找机器可读或易于适应的东西，并使用 CSS 引擎而不是布局引擎。类似于（伪测试规范）：

Stylesheet
    blah.blub { color: red; }
    .blub { color: blue; }

+ Document
    <blah class="blub" />

=> Expected result:
    <blah class="blub" style="color: red" />

或者

assert selector "#blub" matches element "moo#blub"
assert selector "blah#blub" does not match element "moo#blub"
...

我还想测试 CSS 速记（例如linevs line-color）的行为，以防我实现它们与 HTML 相同。例如

line: 1px solid blue;
line-color: red;

导致“1px纯红色”线。有任何想法吗？

4

2 回答 2

1

我怀疑是否存在仅适用于 CSS 的 CSS 选择器测试套件。由于 CSS 被开发为一种配套技术（并不是说它不能在其他地方使用，但它并不常见）测试套件专注于这种关系并且通常在浏览器中运行，例如这个.

用于 CSS 选择器的通用测试套件只能是语法检查器。除非将样式应用于某些东西，否则您将无法查看 CSS 解析器是否工作正常，对吗？

但是上面的套件为不同的 CSS3 选择器提供了大约 500 个测试（包括旧版本，因为它们仍然是 CSS3 的一部分），您至少应该能够将其用作您的实现规范。

如果您使用外部库来处理 HTML，您可以插入 CSS 解析器并使用现有的 HTML/CSS 套件来测试解析器引擎。但这可能工作量太大了？如果没有，看看 Chromium，看看他们的设计是否足够模块化，可以插入一个永恒的 CSS 解析器......

于 2013-02-22T21:45:56.153 回答
1

如何使用无头 Web 浏览器（例如 PhantomJS），然后使用具有 CSS 引擎的 JS 库（例如 jQuery）。

这样您就可以编写 CSS，然后编写 HTML 并使用 jQuery 的 .css() 函数检查这些 HTML 元素的样式？

另外我相信 PhantomJS 可以截取页面的屏幕截图，这可能是一个很好的视觉完整性检查。

于 2013-02-22T21:56:22.777 回答