Question

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

我可以在这个项目中使用全面的CSS测试套件吗？

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

我一直在寻找一个CSS测试套件来检查我的实现，但是我能找到的唯一一个，比如W3C test suite，主要关注文档的可视化表示。我正在寻找机器可读或易于适应的东西，并运用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短片的行为（例如line vs line-color），如果我实现它们与HTML相同的话。例如

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

产生“1px红色”线。有什么想法吗？

Answer 1

我怀疑有一个css选择器测试套件只适用于CSS。由于CSS被开发为一种伴随技术（并不是说它不能在其他地方使用，但它并不常见），测试套件专注于这种关系并且通常在浏览器中运行，{{3} }。

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

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

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

Answer 2

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

这样你可以编写你的CSS，然后使用jQuery的.css（）函数编写HTML并检查这些HTML元素的样式吗？

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

有CSS语法测试套件吗？

2 个答案: